:root {
  color-scheme: light;
  --ink: #17251f;
  --muted: #65736d;
  --surface: #ffffff;
  --canvas: #f3f6f4;
  --line: #dfe7e2;
  --brand: #176b4a;
  --brand-dark: #0c5237;
  --brand-soft: #e4f2eb;
  --danger: #9e2525;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: var(--canvas);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button, input, select { font: inherit; }

.site-header {
  display: flex;
  min-height: 72px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px clamp(18px, 4vw, 48px);
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.brand-mark {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  background: var(--brand);
}

.signed-in-user { display: flex; align-items: center; gap: 14px; }
.user-copy { display: grid; text-align: right; }
.user-copy small, .muted { color: var(--muted); }

.text-button {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 11px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}

.push-alert-button[data-enabled="true"] {
  border-color: #8bd6b5;
  color: #0c5237;
  background: #e4f7ee;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.page-shell {
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto;
  padding: 48px 0 72px;
}

.auth-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: var(--surface);
  box-shadow: 0 18px 55px rgba(27, 52, 43, 0.08);
}

.welcome-panel, .auth-card { padding: clamp(34px, 6vw, 70px); }

.welcome-panel {
  min-height: 520px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  background: linear-gradient(145deg, #0c5237, #27805e);
}

.welcome-panel h1, .dashboard-heading h1 {
  margin: 6px 0 14px;
  line-height: 1;
  letter-spacing: -0.04em;
}

.welcome-panel h1 { font-size: clamp(3.2rem, 7vw, 5.5rem); }
.welcome-panel p:last-child { max-width: 430px; line-height: 1.6; opacity: 0.88; }
.auth-card { align-self: center; }
.auth-card h2 { margin: 5px 0 26px; font-size: 2rem; }

.eyebrow {
  margin: 0;
  color: var(--brand);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.welcome-panel .eyebrow { color: #bfe6d4; }

.field { display: grid; gap: 7px; margin-top: 16px; }
.field span { font-size: 0.84rem; font-weight: 750; }

.field input, .field select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #cbd7d1;
  border-radius: 10px;
  padding: 10px 12px;
  color: var(--ink);
  background: #fff;
}

.field input:focus, .field select:focus {
  outline: 3px solid rgba(23, 107, 74, 0.14);
  border-color: var(--brand);
}

.primary-button {
  width: 100%;
  margin-top: 22px;
  border: 0;
  border-radius: 11px;
  padding: 13px 18px;
  color: #fff;
  background: var(--brand);
  font-weight: 800;
  cursor: pointer;
}

button:disabled { opacity: 0.6; cursor: wait; }

.form-message, .dashboard-notice {
  padding: 12px 14px;
  border-radius: 10px;
}

.form-message { margin: 16px 0 0; }
.error-message { color: var(--danger); background: #fff0f0; }
.portal { max-width: 900px; margin: 0 auto; }
.dashboard-heading { margin-bottom: 28px; }
.dashboard-heading h1 { font-size: clamp(2.4rem, 5vw, 4rem); }
.dashboard-heading > p:last-child { color: var(--muted); }
.dashboard-notice { margin-bottom: 18px; background: #fff6dd; color: #684d0c; }

.selection-card, .community-card, .apartment-card, .state-panel {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: 0 12px 35px rgba(27, 52, 43, 0.06);
}

.selection-card { padding: 22px 24px; margin-bottom: 20px; }
.selection-card .field { margin-top: 0; }
.selection-help { margin: 10px 0 0; color: var(--muted); font-size: 0.88rem; }

.home-context {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 20px;
}

.community-card, .apartment-card { padding: clamp(24px, 4vw, 34px); }
.community-card { align-self: start; background: linear-gradient(155deg, #ffffff, #edf6f1); }
.community-card h2, .apartment-card h2 { margin: 4px 0 8px; font-size: 1.65rem; letter-spacing: -0.025em; }

.card-heading { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.primary-badge { padding: 6px 9px; border-radius: 999px; background: var(--brand-soft); color: var(--brand-dark); font-size: 0.72rem; font-weight: 800; }
.unit-details { margin-top: 24px; }
.unit-details dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
.unit-details dl > div { padding: 14px; border-radius: 13px; background: #f6f8f6; }
.unit-details dt { color: var(--muted); font-size: 0.72rem; font-weight: 700; text-transform: uppercase; }
.unit-details dd { margin: 5px 0 0; font-weight: 800; }
.state-panel, .unit-empty { padding: 38px; text-align: center; }
.state-icon { display: inline-grid; width: 52px; height: 52px; place-items: center; margin-bottom: 12px; border-radius: 17px; background: var(--brand-soft); color: var(--brand); font-size: 1.5rem; }
.state-panel h2, .unit-empty h3 { margin: 6px 0; }
.state-panel p, .unit-empty p { margin: 6px auto 0; max-width: 550px; color: var(--muted); line-height: 1.55; }

@media (max-width: 900px) {
  .auth-layout, .home-context { grid-template-columns: 1fr; }
  .welcome-panel { min-height: 320px; }
}

@media (max-width: 640px) {
  .site-header { padding: 12px 16px; }
  .page-shell { width: min(100% - 24px, 1120px); padding-top: 24px; }
  .auth-layout { border-radius: 20px; }
  .welcome-panel, .auth-card { padding: 30px 24px; }
  .welcome-panel h1 { font-size: 3rem; }
  .user-copy { display: none; }
  .signed-in-user { gap: 7px; }
  .signed-in-user .text-button { padding: 7px 8px; font-size: .78rem; }
  .unit-details dl { grid-template-columns: 1fr; }
  .community-card, .apartment-card { padding: 22px; }
}

/* RD-02B2 COLORFUL RESIDENT LAUNCHER */

.resident-home-shell {
  grid-column: 1 / -1;
  display: grid;
  gap: 1.15rem;
  margin-top: 0.5rem;
}

.rh-launcher-header {
  margin-bottom: 1.1rem;
}

.rh-launcher-header h2 {
  margin: 0.15rem 0 0.25rem;
  font-size: clamp(1.6rem, 4vw, 2.15rem);
}

.rh-launcher-header > div > p:last-child {
  margin: 0;
  color: #657770;
}

.rh-tile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.rh-tile {
  appearance: none;
  position: relative;
  min-width: 0;
  min-height: 148px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  overflow: hidden;
  padding: 1.05rem;
  border: 0;
  border-radius: 20px;
  color: #fff;
  text-align: left;
  font: inherit;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(21, 45, 37, 0.14);
  transition:
    transform 160ms ease,
    box-shadow 160ms ease;
}

.rh-tile::after {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -35px;
  top: -35px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.11);
}

.rh-tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(21, 45, 37, 0.20);
}

.rh-tile:active {
  transform: translateY(0);
}

.rh-tile:focus-visible,
.rh-nav-item:focus-visible,
.rh-back-button:focus-visible {
  outline: 3px solid #102f25;
  outline-offset: 3px;
}

.rh-tile-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: auto;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.22);
  font-size: 1.3rem;
  backdrop-filter: blur(5px);
}

.rh-tile-title {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 0.85rem;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.15;
}

.rh-tile-copy {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 0.25rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.78rem;
  line-height: 1.3;
}

.rh-blue {
  background: linear-gradient(135deg, #2583f7, #1555c5);
}

.rh-purple {
  background: linear-gradient(135deg, #8b5cf6, #6431c8);
}

.rh-red {
  background: linear-gradient(135deg, #f05252, #c8293a);
}

.rh-teal {
  background: linear-gradient(135deg, #18a999, #08776e);
}

.rh-orange {
  background: linear-gradient(135deg, #ff9f43, #e36816);
}

.rh-pink {
  background: linear-gradient(135deg, #e94f9b, #b82970);
}

.rh-indigo {
  background: linear-gradient(135deg, #6574ef, #404cc9);
}

.rh-green {
  background: linear-gradient(135deg, #39ad68, #187a45);
}

.rh-amber {
  background: linear-gradient(135deg, #eab43b, #bd7712);
}

.rh-cyan {
  background: linear-gradient(135deg, #20b9d4, #087b99);
}

.rh-module-view {
  min-height: 360px;
}

.rh-back-button {
  appearance: none;
  margin-bottom: 1rem;
  padding: 0.65rem 0.9rem;
  border: 1px solid #dbe6e0;
  border-radius: 12px;
  background: #fff;
  color: #155b43;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}

.rh-module-card {
  --module-accent: #2583f7;
  padding: clamp(1.25rem, 4vw, 2rem);
  border: 1px solid #e0e8e4;
  border-top: 7px solid var(--module-accent);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(22, 54, 43, 0.08);
}

.rh-module-card[data-tone="blue"] { --module-accent: #2583f7; }
.rh-module-card[data-tone="purple"] { --module-accent: #7c4ee4; }
.rh-module-card[data-tone="red"] { --module-accent: #e33e49; }
.rh-module-card[data-tone="teal"] { --module-accent: #149888; }
.rh-module-card[data-tone="orange"] { --module-accent: #ed7b22; }
.rh-module-card[data-tone="pink"] { --module-accent: #d83f88; }
.rh-module-card[data-tone="indigo"] { --module-accent: #5665df; }
.rh-module-card[data-tone="green"] { --module-accent: #299555; }
.rh-module-card[data-tone="amber"] { --module-accent: #d4941d; }
.rh-module-card[data-tone="cyan"] { --module-accent: #159bb6; }

.rh-module-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin-bottom: 1.15rem;
  border-radius: 18px;
  background: color-mix(in srgb, var(--module-accent) 14%, white);
  font-size: 1.65rem;
}

.rh-module-card h2 {
  margin: 0.2rem 0 0.55rem;
  font-size: clamp(1.8rem, 5vw, 2.5rem);
}

.rh-module-copy {
  max-width: 620px;
  margin: 0;
  color: #64756e;
  line-height: 1.55;
}

.rh-module-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.4rem;
}

.rh-module-option {
  padding: 0.68rem 0.9rem;
  border-radius: 999px;
  background: #f2f6f4;
  color: #29483d;
  font-size: 0.85rem;
  font-weight: 700;
}

.resident-bottom-nav {
  position: sticky;
  bottom: 0.7rem;
  z-index: 10;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.25rem;
  max-width: 560px;
  width: 100%;
  margin: 0.4rem auto 0;
  padding: 0.42rem;
  border: 1px solid #dfe8e3;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 35px rgba(13, 62, 44, 0.15);
  backdrop-filter: blur(10px);
}

.rh-nav-item {
  appearance: none;
  display: grid;
  justify-items: center;
  gap: 0.18rem;
  padding: 0.48rem 0.2rem;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #74857e;
  font: inherit;
  font-size: 0.7rem;
  cursor: pointer;
}

.rh-nav-item > span {
  font-size: 1rem;
}

.rh-nav-active {
  background: #155b43;
  color: #fff;
}

[hidden] {
  display: none !important;
}

@media (min-width: 700px) {
  .rh-tile-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rh-tile {
    min-height: 165px;
  }
}

@media (min-width: 1050px) {
  .rh-tile-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 420px) {
  .rh-tile-grid {
    gap: 0.65rem;
  }

  .rh-tile {
    min-height: 138px;
    padding: 0.9rem;
    border-radius: 17px;
  }

  .rh-tile-title {
    font-size: 0.92rem;
  }
}


/* RD-02C ZUVO MOBILE HOME */

:root {
  --rd02c-bg: #050505;
  --rd02c-panel: #101012;
  --rd02c-text: #ffffff;
  --rd02c-muted: #a7a7b0;
}

.rd02c-enhanced {
  background: var(--rd02c-bg);
}

.rd02c-enhanced > :not(.rd02c-mobile-home) {
  display: none !important;
}

.rd02c-mobile-home {
  width: min(100%, 480px);
  margin: 0 auto;
  padding: 18px 14px 150px;
  color: var(--rd02c-text);
  background:
    radial-gradient(circle at 85% 4%, rgba(120, 77, 255, .19), transparent 27%),
    radial-gradient(circle at 5% 22%, rgba(0, 174, 255, .12), transparent 25%),
    #050505;
  border-radius: 28px;
  box-sizing: border-box;
}

.rd02c-property {
  position: relative;
  margin-bottom: 18px;
}

.rd02c-welcome {
  margin: 0 0 5px;
  color: #9b9ba5;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.rd02c-property-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0;
  border: 0;
  color: #fff;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.rd02c-property-name {
  margin: 0;
  font-size: clamp(1.45rem, 6vw, 2rem);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -.04em;
  background: linear-gradient(90deg, #62b6ff 0%, #a77cff 48%, #ff79a9 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.rd02c-chevron {
  flex: 0 0 auto;
  color: #fff;
  font-size: 1rem;
}

.rd02c-subline {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 10px;
}

.rd02c-unit {
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
}

.rd02c-friendly {
  color: #b7b7c1;
  font-size: .76rem;
}

.rd02c-property-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 17px;
  background: #17171b;
  box-shadow: 0 20px 55px rgba(0,0,0,.55);
}

.rd02c-property-menu.is-open {
  display: block;
}

.rd02c-property-option {
  width: 100%;
  padding: 12px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: #232329;
  font-weight: 800;
  text-align: left;
}

.rd02c-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin: 4px 2px 10px;
}

.rd02c-section-heading h2 {
  margin: 0;
  color: #fff;
  font-size: 1rem;
}

.rd02c-section-heading span {
  color: #777784;
  font-size: .68rem;
}

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

.rd02c-tile {
  position: relative;
  display: flex;
  min-height: 104px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 13px;
  border: 0;
  border-radius: 20px;
  color: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 10px 25px rgba(0,0,0,.24);
  cursor: pointer;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  transition:
    transform 150ms ease,
    opacity 150ms ease;
}

.rd02c-tile:active {
  transform: scale(.98);
}

.rd02c-tile.is-dragging {
  z-index: 20;
  opacity: .72;
  transform: scale(1.035);
}

.rd02c-tile-icon {
  position: absolute;
  top: 13px;
  left: 13px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 12px;
  background: rgba(255,255,255,.20);
  font-size: 1.05rem;
  backdrop-filter: blur(8px);
}

.rd02c-drag {
  position: absolute;
  top: 7px;
  right: 8px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  color: rgba(255,255,255,.72);
  background: transparent;
  font-size: 1rem;
  cursor: grab;
  touch-action: none;
}

.rd02c-drag:active {
  cursor: grabbing;
}

.rd02c-tile strong {
  display: block;
  max-width: 88%;
  color: #fff;
  font-size: .88rem;
  line-height: 1.12;
}

.rd02c-tile small {
  margin-top: 3px;
  color: rgba(255,255,255,.78);
  font-size: .64rem;
}

.rd02c-blue {
  background: linear-gradient(145deg, #0878ff, #38a5ff);
}

.rd02c-violet {
  background: linear-gradient(145deg, #6847ef, #9d62ff);
}

.rd02c-teal {
  background: linear-gradient(145deg, #009b93, #20cab4);
}

.rd02c-orange {
  background: linear-gradient(145deg, #f46a33, #ffad42);
}

.rd02c-pink {
  background: linear-gradient(145deg, #df3a80, #ff6aa4);
}

.rd02c-indigo {
  background: linear-gradient(145deg, #3f4ed8, #687cff);
}

.rd02c-green {
  background: linear-gradient(145deg, #198d57, #41c979);
}

.rd02c-cyan {
  background: linear-gradient(145deg, #087fa3, #37c0da);
}

.rd02c-plum {
  background: linear-gradient(145deg, #8b3bc0, #ce63db);
}

.rd02c-gold {
  background: linear-gradient(145deg, #b67400, #f5ae20);
}

.rd02c-slate {
  background: linear-gradient(145deg, #3c485e, #67758c);
}

.rd02c-panic-wrap {
  position: fixed;
  z-index: 50;
  right: max(22px, calc((100vw - 480px) / 2 + 20px));
  bottom: 82px;
}

.rd02c-panic {
  display: grid;
  width: 104px;
  height: 104px;
  place-items: center;
  border: 6px solid rgba(255,255,255,.93);
  border-radius: 50%;
  color: #fff;
  background:
    radial-gradient(circle at 35% 25%, #ff5656 0%, #e00018 53%, #95000e 100%);
  box-shadow:
    0 0 0 7px rgba(231,0,24,.15),
    0 16px 38px rgba(230,0,30,.43);
  font-size: .96rem;
  font-weight: 950;
  letter-spacing: .05em;
  cursor: pointer;
}

.rd02c-panic::before {
  content: "!";
  display: block;
  margin-bottom: -23px;
  font-size: 1.7rem;
}

.rd02c-toast {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: 92px;
  max-width: min(360px, calc(100vw - 32px));
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: #fff;
  background: rgba(28,28,32,.96);
  box-shadow: 0 14px 35px rgba(0,0,0,.4);
  font-size: .72rem;
  text-align: center;
  transform: translateX(-50%);
}

.rd02c-emergency-screen {
  display: none;
}

.rd02c-mobile-home.is-emergency .rd02c-home-screen {
  display: none;
}

.rd02c-mobile-home.is-emergency .rd02c-emergency-screen {
  display: block;
}

.rd02c-back {
  margin-bottom: 15px;
  padding: 8px 0;
  border: 0;
  color: #70b8ff;
  background: transparent;
  font-weight: 850;
  cursor: pointer;
}

.rd02c-emergency-title {
  margin: 0;
  color: #fff;
  font-size: 1.55rem;
}

.rd02c-emergency-copy {
  margin: 5px 0 15px;
  color: #a4a4ae;
  font-size: .78rem;
}

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

.rd02c-contact {
  min-height: 84px;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 17px;
  color: #fff;
  background: #161619;
}

.rd02c-contact strong {
  display: block;
  margin-top: 9px;
  color: #fff;
  font-size: .79rem;
}

.rd02c-contact span {
  font-size: 1.05rem;
}

.rd02c-safety-note {
  margin: 18px 0;
  color: #777783;
  font-size: .68rem;
  line-height: 1.4;
}

.rd02c-dialog {
  width: min(360px, calc(100vw - 32px));
  padding: 22px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 24px;
  color: #fff;
  background: #151518;
}

.rd02c-dialog::backdrop {
  background: rgba(0,0,0,.76);
  backdrop-filter: blur(5px);
}

.rd02c-dialog h3 {
  margin: 0 0 7px;
  color: #fff;
}

.rd02c-dialog p {
  margin: 0 0 18px;
  color: #aaaab3;
  font-size: .8rem;
}

.rd02c-dialog-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.rd02c-dialog-actions button {
  min-height: 45px;
  border: 0;
  border-radius: 13px;
  font-weight: 850;
  cursor: pointer;
}

.rd02c-cancel {
  color: #fff;
  background: #303036;
}

.rd02c-confirm {
  color: #fff;
  background: #d9001d;
}

@media (min-width: 700px) {
  .rd02c-mobile-home {
    margin-top: 18px;
    box-shadow: 0 24px 70px rgba(0,0,0,.35);
  }
}

@media (max-width: 420px) {
  .rd02c-mobile-home {
    padding-right: 11px;
    padding-left: 11px;
    border-radius: 0;
  }

  .rd02c-grid,
  .rd02c-contact-grid {
    gap: 8px;
  }

  .rd02c-tile {
    min-height: 99px;
    border-radius: 18px;
  }

  .rd02c-panic-wrap {
    right: 18px;
  }
}
.resident-unread-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  min-width: 28px;
  min-height: 28px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #241241;
  background: #d9c7ff;
  font-size: .78rem;
  font-weight: 900;
  text-align: center;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}