:root {
    --bg: #f5f7fb;
    --surface: #ffffff;
    --surface-soft: #f7fafc;
    --ink: #101828;
    --muted: #667085;
    --line: #d9e2ec;
    --line-strong: #b8c7d9;
    --accent: #006d77;
    --accent-dark: #064e55;
    --accent-soft: #e7f6f7;
    --green: #067647;
    --green-soft: #dcfae6;
    --amber: #b54708;
    --amber-soft: #fff4d6;
    --red: #b42318;
    --red-soft: #fee4e2;
    --shadow: 0 18px 42px rgba(16, 24, 40, 0.08);
    --shadow-soft: 0 10px 26px rgba(16, 24, 40, 0.06);
    --radius: 8px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        linear-gradient(180deg, rgba(0, 109, 119, 0.09), transparent 20rem),
        linear-gradient(135deg, #fbfcfe 0%, var(--bg) 50%, #eff7f5 100%);
}

a {
    color: inherit;
}

button,
input,
select,
textarea {
    font: inherit;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem clamp(1rem, 4vw, 3rem);
    background: rgba(251, 252, 254, .94);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(18px);
}

.brand {
    display: inline-flex;
    align-items: center;
    min-width: 16rem;
    gap: .75rem;
    text-decoration: none;
}

.brand-mark {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    color: white;
    font-weight: 900;
    background: linear-gradient(135deg, var(--ink), var(--accent));
    border-radius: var(--radius);
    box-shadow: 0 12px 24px rgba(0, 122, 138, .22);
}

.brand strong,
.brand small {
    display: block;
}

.brand small {
    margin-top: .1rem;
    color: var(--muted);
    font-size: .78rem;
}

.nav,
.admin-actions,
.hero-actions,
.filters,
.card-actions,
.form-footer {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
}

.logout-form {
    margin: 0;
}

.logout-form button {
    width: 100%;
}

.nav {
    padding: .25rem;
    background: rgba(255, 255, 255, .78);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.nav a,
.ghost-action,
.primary-action {
    min-height: 2.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .72rem 1rem;
    border-radius: var(--radius);
    text-decoration: none;
    border: 1px solid transparent;
    font-weight: 800;
    line-height: 1.1;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}

.nav a {
    color: var(--muted);
    min-height: 2.25rem;
    padding: .6rem .85rem;
}

.nav a.active,
.nav a:hover,
.ghost-action {
    color: var(--ink);
    background: var(--surface);
    border-color: var(--line);
}

.ghost-action:hover,
.primary-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(16, 24, 40, .1);
}

.primary-action {
    border-color: var(--accent);
    color: white;
    background: linear-gradient(135deg, var(--accent), var(--accent-dark));
    box-shadow: 0 14px 28px rgba(0, 109, 119, .2);
}

.quiet-link {
    color: var(--muted);
    box-shadow: none;
}

.shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1.8rem 0 4rem;
}

.hero,
.page-title,
.admin-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
    padding: clamp(1.4rem, 4vw, 3.4rem) 0 1.4rem;
}

.admin-hero {
    position: relative;
    align-items: center;
    margin: .4rem 0 1rem;
    padding: 1.4rem;
    background:
        linear-gradient(135deg, rgba(0, 109, 119, .1), rgba(255, 255, 255, .85)),
        var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.admin-hero h1 {
    margin-bottom: .65rem;
    font-size: clamp(2rem, 5vw, 3.6rem);
}

.admin-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1rem;
}

.admin-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: .38rem .65rem;
    color: var(--accent-dark);
    font-size: .82rem;
    font-weight: 900;
    background: rgba(255, 255, 255, .75);
    border: 1px solid #b8e5e8;
    border-radius: 999px;
}

.admin-subnav,
.admin-tabs {
    position: sticky;
    top: 4.7rem;
    z-index: 12;
    display: flex;
    gap: .35rem;
    margin: 0 0 1rem;
    padding: .35rem;
    overflow-x: auto;
    background: rgba(251, 252, 254, .92);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    backdrop-filter: blur(16px);
}

.admin-subnav a,
.admin-tabs button {
    flex: 1 0 auto;
    min-height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .6rem .8rem;
    color: var(--muted);
    text-decoration: none;
    font-weight: 900;
    border: 0;
    border-radius: var(--radius);
    background: transparent;
    cursor: pointer;
}

.admin-subnav a:hover,
.admin-tabs button:hover,
.admin-tabs button.active {
    color: var(--ink);
    background: var(--surface);
    box-shadow: 0 8px 18px rgba(16, 24, 40, .06);
}

.tab-workspace {
    display: block;
}

.tab-panel {
    display: none;
}

.tab-panel.active {
    display: block;
}

.tab-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin: .25rem 0 1rem;
}

.tab-heading h2 {
    margin: 0;
    font-size: 1.45rem;
}

.dashboard-heading {
    align-items: center;
    padding: .25rem 0 .5rem;
}

.dashboard-heading .muted {
    margin: .35rem 0 0;
}

.dashboard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
}

.dashboard-command {
    display: grid;
    grid-template-columns: minmax(20rem, 1.25fr) minmax(18rem, .85fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.revenue-card {
    position: relative;
    display: grid;
    align-content: space-between;
    min-height: 17rem;
    padding: 1.35rem;
    color: white;
    background:
        linear-gradient(135deg, rgba(16, 24, 40, .88), rgba(0, 109, 119, .92)),
        var(--accent-dark);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.executive-card {
    min-height: 20rem;
    padding: 1.5rem;
}

.revenue-card::after {
    content: "";
    position: absolute;
    inset: auto -4rem -5rem auto;
    width: 16rem;
    height: 16rem;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 50%;
}

.revenue-card::before {
    content: "";
    position: absolute;
    inset: -9rem auto auto -6rem;
    width: 18rem;
    height: 18rem;
    background: radial-gradient(circle, rgba(255, 255, 255, .16), transparent 64%);
}

.executive-card-top {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
}

.revenue-card span,
.revenue-card p,
.revenue-card em {
    position: relative;
    z-index: 1;
}

.revenue-card span {
    color: rgba(255, 255, 255, .72);
    font-size: .8rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.revenue-card strong {
    position: relative;
    z-index: 1;
    display: block;
    margin: .6rem 0;
    font-size: clamp(2.15rem, 5vw, 3.65rem);
    line-height: 1;
}

.revenue-card p {
    margin: 0;
    color: rgba(255, 255, 255, .82);
    max-width: 34rem;
    line-height: 1.6;
}

.executive-strip {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1.5rem;
}

.revenue-card em {
    display: inline-flex;
    padding: .45rem .65rem;
    color: rgba(255, 255, 255, .9);
    font-style: normal;
    font-weight: 800;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
}

.dashboard-health {
    display: grid;
    gap: .75rem;
}

.health-card {
    display: grid;
    gap: .75rem;
    min-height: 6.2rem;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(247, 250, 252, .92));
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.health-card div:first-child {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.health-card span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.health-card strong {
    font-size: 1.65rem;
    line-height: 1;
}

.health-card em {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
    font-weight: 800;
}

.progress-track {
    overflow: hidden;
    height: .5rem;
    background: #e9eef5;
    border-radius: 999px;
}

.progress-track span {
    display: block;
    height: 100%;
    max-width: 100%;
    background: var(--accent);
    border-radius: inherit;
}

.health-card.success .progress-track span {
    background: var(--green);
}

.health-card.warning .progress-track span {
    background: var(--amber);
}

.dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr);
    gap: 1rem;
    align-items: stretch;
}

.dashboard-grid-wide {
    grid-template-columns: minmax(0, 1.35fr) minmax(19rem, .65fr);
}

.overview-panels {
    align-items: start;
}

.action-panel .alert-list {
    grid-template-columns: 1fr;
}

.action-panel .alert-list a {
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .15rem .8rem;
    min-height: 4.8rem;
}

.action-panel .alert-list strong {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    color: var(--accent-dark);
    background: var(--accent-soft);
    border-radius: var(--radius);
}

.action-panel .alert-list em {
    color: var(--muted);
    font-size: .8rem;
    font-style: normal;
}

.contract-row {
    grid-template-columns: 1fr auto;
    align-items: center;
}

.contract-row strong,
.contract-row span {
    min-width: 0;
}

.contract-row em {
    grid-row: span 2;
    color: var(--accent-dark);
    font-style: normal;
    font-weight: 900;
}

.priority-panel,
.contract-watch,
.recent-payments-panel,
.activity-panel {
    background:
        linear-gradient(180deg, rgba(231, 246, 247, .42), transparent 9rem),
        rgba(255, 255, 255, .94);
}

.priority-list {
    display: grid;
    gap: .7rem;
}

.priority-list a {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .2rem .8rem;
    align-items: center;
    padding: .85rem;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.priority-list a:hover,
.dashboard-payment-row:hover {
    transform: translateY(-1px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow-soft);
}

.priority-index {
    display: grid;
    grid-row: span 2;
    place-items: center;
    width: 3rem;
    height: 3rem;
    color: var(--accent-dark);
    font-size: 1.2rem;
    font-weight: 950;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.priority-list strong,
.dashboard-payment-row strong,
.activity-item strong {
    min-width: 0;
}

.priority-list em {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
}

.dashboard-row,
.quiet-row {
    padding: .8rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.dashboard-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
}

.dashboard-row em {
    align-self: center;
    padding: .35rem .5rem;
    color: var(--accent-dark);
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: 999px;
}

.dashboard-table {
    display: grid;
    gap: .65rem;
}

.dashboard-payment-row {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(8rem, .7fr) auto;
    gap: 1rem;
    align-items: center;
    padding: .85rem;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.dashboard-payment-row div {
    display: grid;
    gap: .2rem;
    min-width: 0;
}

.dashboard-payment-row span {
    color: var(--muted);
    font-size: .84rem;
}

.dashboard-payment-row .status-pill {
    justify-self: end;
    color: var(--ink);
}

.activity-stack {
    display: grid;
    gap: .72rem;
}

.activity-item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .75rem;
    align-items: start;
    padding: .78rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.activity-item > span {
    width: .7rem;
    height: .7rem;
    margin-top: .35rem;
    background: var(--accent);
    border-radius: 999px;
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.activity-item.notification > span {
    background: var(--green);
    box-shadow: 0 0 0 4px var(--green-soft);
}

.activity-item div {
    display: grid;
    gap: .2rem;
    min-width: 0;
}

.activity-item em,
.quiet-row span {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
}

.text-link {
    color: var(--accent-dark);
    font-size: .88rem;
    font-weight: 900;
    text-decoration: none;
}

.security-layout {
    display: grid;
    grid-template-columns: minmax(20rem, .95fr) minmax(18rem, 1.05fr);
    gap: 1rem;
    align-items: start;
}

.security-panel-card,
.security-guidance {
    background:
        linear-gradient(180deg, rgba(231, 246, 247, .42), transparent 9rem),
        rgba(255, 255, 255, .94);
}

.security-form {
    display: grid;
    gap: .9rem;
}

.security-form label {
    display: grid;
    gap: .35rem;
    font-weight: 850;
}

.security-form input {
    width: 100%;
    min-height: 2.9rem;
    padding: .75rem .85rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.security-form label:focus-within input {
    border-color: #9ed9dd;
    box-shadow: 0 0 0 4px rgba(0, 109, 119, .09);
    outline: 0;
}

.security-form small {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.45;
}

.security-checklist {
    display: grid;
    gap: .75rem;
}

.security-checklist div {
    display: grid;
    gap: .2rem;
    padding: .85rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.security-checklist span {
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.5;
}

.property-hero {
    min-height: 20rem;
    align-items: center;
    border-bottom: 1px solid var(--line);
}

.split-title {
    align-items: stretch;
}

.eyebrow {
    margin: 0 0 .5rem;
    color: var(--accent-dark);
    text-transform: uppercase;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .08em;
}

h1,
h2,
p {
    margin-top: 0;
}

h1,
h2 {
    letter-spacing: 0;
}

h1 {
    max-width: 48rem;
    margin-bottom: 1rem;
    font-size: clamp(2.05rem, 5.4vw, 4.25rem);
    line-height: 1;
}

h2 {
    margin-bottom: .3rem;
    font-size: 1.18rem;
}

.lead {
    max-width: 47rem;
    margin-bottom: 0;
    color: var(--muted);
    font-size: 1.04rem;
    line-height: 1.65;
}

.section-intro {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.5rem 0 .9rem;
}

.section-intro h2 {
    margin: 0;
    font-size: 1.55rem;
}

.section-intro span {
    color: var(--muted);
    font-weight: 800;
}

.flow-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
    margin: 0 0 1.2rem;
}

.flow-steps article {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .25rem .7rem;
    min-height: 5.2rem;
    padding: .9rem;
    background: rgba(255, 255, 255, .78);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.flow-steps span {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    color: var(--muted);
    font-weight: 900;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
}

.flow-steps strong,
.flow-steps em {
    display: block;
}

.flow-steps strong {
    font-size: .95rem;
}

.flow-steps em {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
}

.flow-steps .active {
    border-color: #a6dde1;
    background: var(--accent-soft);
}

.flow-steps .active span,
.flow-steps .done span {
    color: white;
    background: var(--accent);
    border-color: var(--accent);
}

.flow-steps .done {
    background: #f6fbfb;
}

.grid,
.metric-grid {
    display: grid;
    gap: 1rem;
}

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

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

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

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

.panel,
.card,
.metric-card,
.trust-panel {
    background: rgba(255, 255, 255, .9);
    border: 1px solid rgba(217, 226, 236, .96);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.panel {
    padding: 1.2rem;
    margin-bottom: 1.2rem;
}

.admin-panel {
    padding: 1.35rem;
}

.card {
    padding: 1.15rem;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.property-card {
    overflow: hidden;
}

.property-media {
    position: relative;
    display: grid;
    place-items: end start;
    min-height: 14rem;
    margin: -1.15rem -1.15rem 1rem;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(16, 24, 40, .86), rgba(0, 109, 119, .72)),
        var(--accent-dark);
}

.property-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.property-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 55%;
    background: linear-gradient(180deg, transparent, rgba(16, 24, 40, .58));
}

.property-media div {
    position: relative;
    z-index: 1;
    display: grid;
    gap: .2rem;
    padding: 1rem;
    color: #ffffff;
}

.property-media strong {
    font-size: 1.15rem;
}

.property-media span {
    color: rgba(255, 255, 255, .82);
    font-size: .9rem;
}

.property-media.empty {
    place-items: center;
    min-height: 11rem;
}

.property-media.empty::after {
    display: none;
}

.property-card:hover {
    transform: translateY(-2px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow);
}

.public-property-showcase {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.apartment-tile {
    display: grid;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.apartment-tile:hover {
    transform: translateY(-2px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow);
}

.apartment-media {
    position: relative;
    display: grid;
    height: 17rem;
    overflow: hidden;
    background: linear-gradient(135deg, var(--accent-dark), var(--accent));
}

.apartment-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.apartment-media.empty {
    place-items: center;
    padding: 1.5rem;
    color: #ffffff;
}

.apartment-media.empty div {
    display: grid;
    gap: .25rem;
    text-align: center;
}

.apartment-tile-body {
    display: grid;
    gap: .85rem;
    padding: 1rem;
}

.apartment-tile header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.apartment-tile h2,
.apartment-tile p {
    margin: 0;
}

.apartment-tile h2 {
    margin-top: .15rem;
    font-size: 1.2rem;
}

.apartment-tile header p,
.apartment-details,
.apartment-note {
    color: var(--muted);
    line-height: 1.55;
}

.apartment-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}

.apartment-facts div {
    display: grid;
    gap: .16rem;
    padding: .72rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.apartment-facts span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.apartment-facts strong {
    overflow-wrap: anywhere;
}

.apartment-facts em {
    color: var(--muted);
    font-size: .8rem;
    font-style: normal;
}

.apartment-note {
    padding: .72rem;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.apartment-tile footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .55rem;
    padding-top: .2rem;
}

.metric-card,
.trust-panel {
    padding: 1rem;
}

.metric-card span,
.trust-panel span {
    display: block;
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.45;
}

.metric-card strong {
    display: block;
    margin-top: .35rem;
    font-size: 1.55rem;
}

.metric-card {
    position: relative;
    overflow: hidden;
    min-height: 7rem;
}

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

.metric-card em {
    display: block;
    margin-top: .25rem;
    color: var(--muted);
    font-size: .8rem;
    font-style: normal;
    font-weight: 800;
}

.metric-card.warning::before {
    background: var(--amber);
}

.metric-card.success::before {
    background: var(--green);
}

.metric-card.danger::before {
    background: var(--red);
}

.trust-panel {
    width: min(25rem, 100%);
    align-self: center;
}

.trust-panel strong {
    display: block;
    margin-bottom: .3rem;
}

.card-head,
.section-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.section-head {
    margin-bottom: .9rem;
}

.section-head h2 {
    font-size: 1.25rem;
}

.card-head p,
.muted,
td span,
.count,
.form-footer span {
    color: var(--muted);
}

.status-chip,
.status-pill,
.dup {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    min-height: 1.75rem;
    padding: .3rem .6rem;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 900;
}

.status-chip,
.verified {
    color: var(--green);
    background: var(--green-soft);
}

.pending,
.unchecked,
.active,
.renewed,
.valid {
    color: var(--green);
    background: var(--green-soft);
}

.pending,
.needs-correction {
    color: var(--amber);
    background: var(--amber-soft);
}

.rejected,
.terminated,
.expired,
.invalid,
.dup {
    color: var(--red);
    background: var(--red-soft);
}

.correction-link {
    display: inline-flex;
    margin-top: .35rem;
    color: var(--amber);
    font-size: .78rem;
    font-weight: 900;
}

.flagged-row {
    background: rgba(254, 228, 226, .28);
}

.rent-band,
.selected-property {
    display: grid;
    gap: .2rem;
    margin: 1rem 0;
    padding: 1rem;
    background: linear-gradient(135deg, var(--accent-soft), #fbfefd);
    border: 1px solid #c3edf1;
    border-radius: var(--radius);
}

.terms-copy {
    max-height: 32rem;
    overflow: auto;
    padding: 1rem;
    color: #344054;
    font-size: .98rem;
    line-height: 1.7;
    white-space: normal;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.terms-accept {
    display: grid;
    gap: 1rem;
}

.terms-accept .toggle-row {
    padding: 1rem;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.contract-summary {
    margin-bottom: 0;
}

.rent-band span,
.selected-property span {
    color: var(--accent-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.rent-band strong,
.selected-property strong {
    font-size: 1.7rem;
}

.rent-band em,
.selected-property em {
    color: var(--muted);
    font-style: normal;
}

.detail-list {
    display: grid;
    gap: .65rem;
    margin: 1rem 0;
}

.detail-list div {
    display: grid;
    grid-template-columns: 9rem 1fr;
    gap: 1rem;
    padding-top: .65rem;
    border-top: 1px solid var(--line);
}

dt {
    color: var(--muted);
    font-size: .8rem;
    font-weight: 900;
}

dd {
    margin: 0;
    line-height: 1.45;
}

.property-admin-list {
    display: grid;
    gap: .75rem;
}

.property-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.property-workspace {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.property-editor {
    width: min(1040px, calc(100vw - 2rem));
}

.property-modal-form {
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
    background:
        linear-gradient(180deg, rgba(231, 246, 247, .45), transparent 12rem),
        var(--surface);
}

.property-new-link {
    margin: 1rem 1.2rem 0;
    width: fit-content;
}

.form-section {
    display: grid;
    grid-template-columns: minmax(13rem, .38fr) minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, .88);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.form-section-head {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    min-width: 0;
}

.form-section-head span {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    color: var(--accent-dark);
    font-size: .78rem;
    font-weight: 950;
    background: linear-gradient(135deg, #ffffff, var(--accent-soft));
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.form-section-head h3 {
    margin: .1rem 0 .25rem;
    font-size: 1rem;
    letter-spacing: 0;
}

.form-section-head p {
    margin: 0;
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.45;
}

.property-modal-form .form-grid {
    gap: .9rem;
}

.property-modal-form label {
    padding: .8rem;
    background: #fbfcfe;
    border: 1px solid #edf1f5;
    border-radius: var(--radius);
}

.property-modal-form label:focus-within {
    background: var(--surface);
    border-color: #b8e5e8;
    box-shadow: 0 0 0 3px rgba(0, 109, 119, .08);
}

.property-modal-form input,
.property-modal-form select,
.property-modal-form textarea {
    background: var(--surface);
    border-color: #c8d5e2;
    font-weight: 700;
}

.property-modal-form input::placeholder,
.property-modal-form textarea::placeholder {
    color: #69798a;
    font-weight: 650;
}

.property-modal-form textarea[name="terms_conditions"] {
    min-height: 14rem;
}

.property-toggle {
    align-content: center;
    min-height: 5.4rem;
    color: var(--accent-dark);
    background: linear-gradient(135deg, var(--accent-soft), #fbfefd) !important;
    border-color: #b8e5e8 !important;
}

.modal-actions {
    position: sticky;
    bottom: -1.15rem;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
    gap: .65rem;
    margin: .15rem -1.15rem -1.15rem;
    padding: 1rem 1.15rem;
    background: rgba(255, 255, 255, .96);
    border-top: 1px solid var(--line);
    backdrop-filter: blur(14px);
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(16, 24, 40, .46);
    backdrop-filter: blur(10px);
}

.modal-backdrop.active {
    display: flex;
}

.modal-window {
    max-height: min(86vh, 860px);
    overflow: auto;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.modal-head {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.2rem;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(12px);
}

.modal-head h2,
.modal-head p {
    margin-bottom: 0;
}

.receipt-viewer {
    width: min(1120px, calc(100vw - 2rem));
    height: min(86vh, 860px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.receipt-modal-head {
    align-items: center;
}

.receipt-modal-actions {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.receipt-frame-shell {
    min-height: 0;
    padding: .85rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.receipt-frame-shell iframe {
    width: 100%;
    height: 100%;
    min-height: 520px;
    display: block;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .12);
}

.sms-viewer {
    width: min(760px, calc(100vw - 2rem));
    overflow: hidden;
}

.sms-modal-head {
    align-items: center;
}

.sms-proof-body {
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.sms-proof-body pre {
    min-height: 220px;
    max-height: min(58vh, 520px);
    margin: 0;
    padding: 1.1rem;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: var(--text);
    font-family: inherit;
    font-size: .98rem;
    line-height: 1.65;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .1);
}

.icon-action {
    min-width: 5rem;
}

.property-directory-panel {
    min-width: 0;
}

.property-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem;
}

.property-inventory-card {
    display: grid;
    gap: .85rem;
    padding: 1rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.property-admin-thumb {
    width: 100%;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.property-inventory-card header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--line);
}

.property-inventory-card h3 {
    margin: .2rem 0;
    font-size: 1.18rem;
}

.property-inventory-card p {
    margin: 0;
    color: var(--muted);
}

.property-inventory-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.property-inventory-details div {
    display: grid;
    gap: .2rem;
    padding: .75rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.property-inventory-details span {
    color: var(--muted);
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.property-inventory-details strong {
    overflow-wrap: anywhere;
}

.property-inventory-details em {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
}

.property-unit-note {
    padding: .8rem;
    line-height: 1.55;
    background: #fbfcfe;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.property-inventory-card footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .55rem;
}

.property-viewer {
    width: min(1040px, calc(100vw - 2rem));
    max-height: min(88vh, 900px);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.property-view-head {
    align-items: center;
}

.property-view-body {
    display: grid;
    gap: 1rem;
    min-height: 0;
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.property-view-image {
    width: 100%;
    max-height: 340px;
    object-fit: cover;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.property-view-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.property-view-summary article {
    display: grid;
    gap: .18rem;
    padding: .9rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.property-view-summary span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.property-view-summary em {
    color: var(--muted);
    font-style: normal;
}

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

.operations-grid {
    align-items: stretch;
}

.form-panel {
    border-color: #c8e8eb;
}

.payments-panel {
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(231, 246, 247, .45), transparent 18rem),
        var(--surface);
}

.payments-command-head {
    align-items: start;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--line);
}

.payment-command-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
    flex-wrap: wrap;
}

.payment-insight-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
    margin: 1rem 0;
}

.payment-insight-grid article {
    display: grid;
    gap: .2rem;
    padding: .95rem;
    background: rgba(255, 255, 255, .9);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.payment-insight-grid span {
    color: var(--muted);
    font-size: .75rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.payment-insight-grid strong {
    font-size: 1.45rem;
    line-height: 1.1;
}

.payment-insight-grid em {
    color: var(--muted);
    font-size: .84rem;
    font-style: normal;
}

.payment-insight-grid .success {
    border-color: #bfe9ce;
    background: linear-gradient(135deg, #ffffff, var(--green-soft));
}

.payment-insight-grid .warning {
    border-color: #f3d28a;
    background: linear-gradient(135deg, #ffffff, var(--amber-soft));
}

.payment-insight-grid .danger {
    border-color: #f2b8b5;
    background: linear-gradient(135deg, #ffffff, var(--red-soft));
}

.payment-filters {
    display: grid;
    grid-template-columns: minmax(15rem, 1.2fr) 2fr;
    align-items: end;
    gap: .85rem;
    margin: 0 0 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, .92);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 8px 20px rgba(16, 24, 40, .03);
}

.payment-filters .filter-search {
    grid-row: span 2;
}

.payment-filters .filter-search input {
    min-height: 6.35rem;
    font-size: 1rem;
}

.filter-cluster {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
}

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

.filter-actions {
    display: flex;
    justify-content: flex-end;
    gap: .65rem;
    grid-column: 1 / -1;
}

.payment-review-list {
    display: grid;
    gap: 1.1rem;
}

.payment-directory {
    display: grid;
    gap: .65rem;
}

.payment-directory-head,
.payment-row {
    display: grid;
    grid-template-columns: minmax(16rem, 1.3fr) minmax(13rem, 1fr) minmax(11rem, .85fr) minmax(12rem, .95fr) auto;
    gap: .85rem;
    align-items: center;
}

.payment-directory-head {
    padding: .75rem .9rem;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: rgba(255, 255, 255, .9);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.payment-row {
    position: relative;
    min-height: 5.5rem;
    padding: .85rem .9rem;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.payment-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.payment-row.flagged::before {
    background: var(--red);
}

.payment-row:hover {
    transform: translateY(-1px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow-soft);
}

.payment-row > div {
    display: grid;
    gap: .18rem;
    min-width: 0;
}

.payment-row strong,
.payment-row span,
.payment-row em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.payment-row span,
.payment-row em {
    color: var(--muted);
    font-size: .84rem;
    font-style: normal;
}

.payment-primary-cell {
    display: flex !important;
    align-items: center;
    gap: .75rem;
}

.payment-avatar {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    min-width: 3rem;
    height: 2.55rem;
    padding: 0 .55rem;
    color: #ffffff !important;
    font-size: .82rem !important;
    font-weight: 950;
    background: linear-gradient(135deg, var(--accent), #182230);
    border-radius: 999px;
    box-shadow: 0 12px 26px rgba(0, 109, 119, .22);
}

.payment-row-status {
    align-content: start;
    justify-items: start;
}

.payment-row-status .dup {
    margin-top: .15rem;
}

.payment-row-actions {
    justify-items: end;
}

.payment-row-actions .primary-action {
    min-width: 5.25rem;
}

.payment-viewer {
    width: min(1120px, calc(100vw - 2rem));
    max-height: min(90vh, 920px);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.payment-modal-head {
    align-items: center;
}

.payment-modal-body {
    display: grid;
    gap: 1rem;
    min-height: 0;
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.payment-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

.payment-modal-summary article {
    display: grid;
    gap: .18rem;
    padding: .9rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.payment-modal-summary span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.payment-modal-summary em {
    color: var(--muted);
    font-style: normal;
    line-height: 1.35;
}

.payment-review-card {
    position: relative;
    display: grid;
    gap: .95rem;
    padding: 1.05rem;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(247, 250, 252, .92)),
        var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.payment-review-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--accent);
    border-radius: var(--radius) 0 0 var(--radius);
}

.payment-review-card:hover {
    transform: translateY(-1px);
    border-color: #c3d7e2;
    box-shadow: 0 16px 34px rgba(16, 24, 40, .08);
}

.payment-review-card.flagged::before {
    background: var(--red);
}

.payment-review-card.status-card-verified::before {
    background: var(--green);
}

.payment-review-card.status-card-pending::before {
    background: var(--amber);
}

.payment-review-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    padding: .15rem 0 .15rem .45rem;
}

.payment-review-head h3 {
    margin: .25rem 0 .25rem;
    font-size: 1.35rem;
    letter-spacing: 0;
}

.payment-review-head p,
.payment-amount span,
.payment-amount em {
    margin: 0;
    color: var(--muted);
}

.payment-person p span {
    color: #98a2b3;
}

.record-id {
    display: inline-flex;
    color: var(--accent-dark);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.payment-amount {
    display: grid;
    justify-items: end;
    gap: .12rem;
    min-width: 13rem;
    padding: .8rem .9rem;
    text-align: right;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.payment-amount strong {
    display: block;
    font-size: 1.45rem;
    line-height: 1.1;
}

.payment-amount em {
    max-width: 17rem;
    overflow-wrap: anywhere;
    font-size: .82rem;
    font-style: normal;
}

.status-rail {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .8rem .85rem;
    background: rgba(251, 252, 254, .86);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.payment-review-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

.review-block {
    display: grid;
    align-content: start;
    gap: .28rem;
    min-height: 8.5rem;
    padding: .9rem;
    background: rgba(255, 255, 255, .86);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.proof-block {
    background: linear-gradient(135deg, #ffffff, var(--accent-soft));
    border-color: #b8e5e8;
}

.review-block span {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.review-block strong {
    overflow-wrap: anywhere;
}

.review-block p {
    margin: 0;
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.45;
}

.proof-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.2rem;
    width: fit-content;
    padding: .52rem .7rem;
    color: var(--accent-dark);
    text-decoration: none;
    font-weight: 900;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.proof-link:hover {
    border-color: var(--accent);
}

.proof-link::before {
    content: "View";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.15rem;
    min-height: 1.25rem;
    margin-right: .45rem;
    color: #ffffff;
    font-size: .68rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: var(--accent);
    border-radius: 999px;
}

.sms-proof-link {
    cursor: pointer;
}

.sms-proof-link::before {
    content: "SMS";
    background: #182230;
}

.danger-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: .58rem .82rem;
    color: #ffffff;
    font-weight: 950;
    text-decoration: none;
    background: var(--red);
    border: 1px solid var(--red);
    border-radius: var(--radius);
    cursor: pointer;
}

.danger-action:hover:not(:disabled) {
    background: #8f1c13;
    border-color: #8f1c13;
}

.danger-action:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.danger-zone {
    margin-top: .75rem;
    padding: .75rem;
    background: #fff8f7;
    border: 1px solid #f7c9c5;
    border-radius: var(--radius);
}

.danger-zone summary {
    color: var(--red);
    font-weight: 950;
    cursor: pointer;
}

.danger-zone form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, .75fr) auto;
    gap: .65rem;
    align-items: end;
    margin-top: .75rem;
}

.danger-zone label {
    display: grid;
    gap: .3rem;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 850;
}

.danger-zone input {
    width: 100%;
    min-height: 2.35rem;
    padding: .55rem .65rem;
    color: var(--ink);
    background: #ffffff;
    border: 1px solid #f0b8b2;
    border-radius: var(--radius);
}

.danger-zone .toggle-row {
    align-self: center;
    color: var(--ink);
}

.edit-zone {
    padding: .85rem;
    background: #f3fbfc;
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.edit-zone summary {
    color: var(--accent-dark);
    font-weight: 950;
    cursor: pointer;
}

.inline-edit-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-top: .8rem;
}

.inline-edit-form label {
    display: grid;
    gap: .3rem;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 850;
}

.inline-edit-form input,
.inline-edit-form select,
.inline-edit-form textarea {
    width: 100%;
    min-width: 0;
    min-height: 2.35rem;
    padding: .55rem .65rem;
    color: var(--ink);
    background: #ffffff;
    border: 1px solid #a7dbe0;
    border-radius: var(--radius);
}

.inline-edit-actions {
    display: flex;
    justify-content: flex-end;
    grid-column: 1 / -1;
}

.payment-danger-zone form {
    grid-template-columns: minmax(0, 1fr) minmax(15rem, .9fr) auto;
}

.trash-list {
    display: grid;
    gap: .9rem;
}

.trash-directory {
    display: grid;
    gap: .65rem;
}

.trash-directory-head,
.trash-row {
    display: grid;
    grid-template-columns: minmax(15rem, 1.2fr) minmax(15rem, 1.2fr) minmax(10rem, .8fr) minmax(9rem, .7fr) auto;
    gap: .85rem;
    align-items: center;
}

.trash-directory-head {
    padding: .75rem .9rem;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.trash-row {
    position: relative;
    min-height: 5.3rem;
    padding: .85rem .9rem;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.trash-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--amber);
}

.trash-row.ready::before {
    background: var(--red);
}

.trash-row:hover {
    transform: translateY(-1px);
    border-color: #f0b8b2;
    box-shadow: var(--shadow-soft);
}

.trash-row > div {
    display: grid;
    gap: .18rem;
    min-width: 0;
}

.trash-row strong,
.trash-row span,
.trash-row em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.trash-row span,
.trash-row em {
    color: var(--muted);
    font-size: .84rem;
    font-style: normal;
}

.trash-primary-cell {
    display: flex !important;
    align-items: center;
    gap: .75rem;
}

.trash-avatar {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    color: #ffffff !important;
    font-size: .9rem !important;
    font-weight: 950;
    background: linear-gradient(135deg, var(--amber), var(--red));
    border-radius: 999px;
    box-shadow: 0 12px 26px rgba(180, 35, 24, .2);
}

.trash-row-actions {
    justify-items: end;
}

.trash-row-actions .primary-action {
    min-width: 5.25rem;
}

.trash-viewer {
    width: min(1040px, calc(100vw - 2rem));
    max-height: min(88vh, 900px);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.trash-modal-head {
    align-items: center;
}

.trash-modal-body {
    display: grid;
    gap: 1rem;
    min-height: 0;
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(180, 35, 24, .08), transparent 34%),
        #fffafa;
}

.trash-card {
    display: grid;
    gap: .9rem;
    padding: 1rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-left: 4px solid var(--amber);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.trash-card.ready {
    border-left-color: var(--red);
}

.trash-card header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.trash-card h3,
.trash-card p {
    margin: 0;
}

.trash-card p {
    color: var(--muted);
}

.trash-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    margin: 0;
}

.trash-meta div {
    display: grid;
    gap: .2rem;
    padding: .7rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.trash-meta dt {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.trash-meta dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.trash-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.trash-actions form {
    display: grid;
    gap: .55rem;
    padding: .75rem;
    background: #fbfcfe;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.trash-actions label {
    display: grid;
    gap: .3rem;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 850;
}

.trash-actions input {
    width: 100%;
    min-height: 2.35rem;
    padding: .55rem .65rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.contract-link,
.correction-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    padding: .3rem .65rem;
    color: var(--accent-dark);
    text-decoration: none;
    font-size: .76rem;
    font-weight: 950;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: 999px;
}

.contract-link {
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent), var(--accent-dark));
    border-color: var(--accent-dark);
}

.verification-workbench {
    display: grid;
    grid-template-columns: minmax(10rem, .9fr) repeat(3, minmax(0, 1fr)) minmax(14rem, 1.2fr) auto;
    align-items: end;
    gap: .75rem;
    padding: .9rem;
    background: linear-gradient(135deg, rgba(251, 252, 254, .98), #f3faf9);
    border: 1px solid #c8e8eb;
    border-radius: var(--radius);
}

.workbench-title {
    display: grid;
    align-self: center;
    gap: .15rem;
}

.workbench-title span {
    color: var(--accent-dark);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.workbench-title strong {
    font-size: .92rem;
    line-height: 1.25;
}

.verification-workbench label {
    font-size: .78rem;
}

.verification-workbench select,
.verification-workbench textarea {
    min-height: 2.55rem;
}

.verification-workbench .remarks-field {
    min-width: 0;
}

.review-actions {
    display: grid;
    align-items: end;
    gap: .55rem;
}

.notify-toggle {
    align-self: center;
    white-space: nowrap;
    padding: .45rem .55rem;
    background: rgba(255, 255, 255, .82);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.empty-state {
    display: grid;
    place-items: center;
    gap: .25rem;
    min-height: 11rem;
    color: var(--muted);
    background: var(--surface-soft);
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius);
}

.empty-state strong {
    color: var(--ink);
}

.alert-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.alert-list a {
    display: grid;
    gap: .2rem;
    padding: .85rem;
    text-decoration: none;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.alert-list a:hover {
    transform: translateY(-1px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow-soft);
}

.alert-list strong {
    font-size: 1.45rem;
}

.alert-list span,
.mini-list span,
.audit-list span,
.audit-list em {
    color: var(--muted);
    font-size: .86rem;
}

.mini-list,
.audit-list {
    display: grid;
    gap: .75rem;
}

.notification-directory,
.audit-directory {
    display: grid;
    gap: .65rem;
}

.notification-directory-head,
.notification-row,
.audit-directory-head,
.audit-row {
    display: grid;
    gap: .85rem;
    align-items: center;
}

.notification-directory-head,
.notification-row {
    grid-template-columns: minmax(14rem, 1.15fr) minmax(16rem, 1.35fr) minmax(9rem, .75fr) minmax(8rem, .65fr) auto;
}

.audit-directory-head,
.audit-row {
    grid-template-columns: minmax(16rem, 1.45fr) minmax(7rem, .55fr) minmax(8rem, .6fr) minmax(8rem, .65fr) auto;
}

.notification-directory-head,
.audit-directory-head {
    padding: .75rem .9rem;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.notification-row,
.audit-row {
    min-height: 4.7rem;
    padding: .8rem .9rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.notification-row:hover,
.audit-row:hover {
    transform: translateY(-1px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow-soft);
}

.notification-row > div,
.audit-row > div {
    display: grid;
    gap: .18rem;
    min-width: 0;
}

.notification-row strong,
.notification-row span,
.notification-row em,
.audit-row strong,
.audit-row span,
.audit-row em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.notification-row span,
.notification-row em,
.audit-row span,
.audit-row em {
    color: var(--muted);
    font-size: .84rem;
    font-style: normal;
}

.notification-row-actions,
.audit-row-actions {
    justify-items: end;
}

.notification-row-actions .primary-action,
.audit-row-actions .primary-action {
    min-width: 5.25rem;
}

.log-viewer {
    width: min(820px, calc(100vw - 2rem));
    max-height: min(86vh, 820px);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.log-modal-head {
    align-items: center;
}

.log-modal-body {
    display: grid;
    gap: .85rem;
    min-height: 0;
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.log-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    margin: 0;
}

.log-detail-grid div,
.log-message-box {
    display: grid;
    gap: .18rem;
    padding: .75rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.log-detail-grid dt,
.log-message-box span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.log-detail-grid dd,
.log-message-box p {
    margin: 0;
    overflow-wrap: anywhere;
    line-height: 1.55;
}

.tenant-profile-grid {
    display: grid;
    gap: 1rem;
}

.tenant-directory {
    display: grid;
    gap: .65rem;
}

.tenant-directory-head,
.tenant-row {
    display: grid;
    grid-template-columns: minmax(16rem, 1.35fr) minmax(13rem, 1fr) minmax(12rem, .95fr) minmax(10rem, .8fr) auto;
    gap: .85rem;
    align-items: center;
}

.tenant-directory-head {
    padding: .75rem .9rem;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.tenant-row {
    min-height: 5.5rem;
    padding: .85rem .9rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.tenant-row:hover {
    transform: translateY(-1px);
    border-color: #b8e5e8;
    box-shadow: var(--shadow-soft);
}

.tenant-row > div {
    display: grid;
    gap: .18rem;
    min-width: 0;
}

.tenant-row strong,
.tenant-row span,
.tenant-row em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.tenant-row em,
.tenant-row span {
    color: var(--muted);
    font-size: .84rem;
    font-style: normal;
}

.tenant-primary-cell {
    display: flex !important;
    align-items: center;
    gap: .75rem;
}

.tenant-avatar {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    color: #ffffff;
    font-size: .85rem;
    font-weight: 950;
    background: linear-gradient(135deg, var(--accent), #182230);
    border-radius: 999px;
    box-shadow: 0 12px 26px rgba(0, 109, 119, .22);
}

.tenant-avatar.large {
    width: 3.4rem;
    height: 3.4rem;
    font-size: 1.05rem;
}

.tenant-row-actions {
    justify-items: end;
}

.tenant-row-actions .primary-action {
    min-width: 5.25rem;
}

.tenant-viewer {
    width: min(1040px, calc(100vw - 2rem));
    max-height: min(88vh, 900px);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.tenant-modal-head {
    align-items: center;
}

.tenant-modal-title {
    display: flex;
    align-items: center;
    gap: .9rem;
    min-width: 0;
}

.tenant-modal-title h2 {
    overflow-wrap: anywhere;
}

.tenant-modal-body {
    display: grid;
    gap: 1rem;
    min-height: 0;
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(11, 94, 101, .08), transparent 34%),
        #f7fbfc;
}

.tenant-profile-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.tenant-profile-summary article {
    display: grid;
    gap: .18rem;
    padding: .9rem;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .035);
}

.tenant-profile-summary span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.tenant-profile-summary em {
    color: var(--muted);
    font-style: normal;
}

.tenant-profile-card {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.tenant-profile-card header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: .8rem;
    border-bottom: 1px solid var(--line);
}

.tenant-profile-card h3 {
    margin: .25rem 0 .2rem;
    font-size: 1.25rem;
}

.tenant-profile-card p {
    margin: 0;
    color: var(--muted);
}

.tenant-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
}

.tenant-info-grid section {
    padding: .85rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.tenant-info-grid section > span {
    display: block;
    margin-bottom: .65rem;
    color: var(--accent-dark);
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.tenant-info-grid dl {
    display: grid;
    gap: .55rem;
    margin: 0;
}

.tenant-info-grid dl div {
    display: grid;
    gap: .12rem;
}

.tenant-info-grid dt {
    color: var(--muted);
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.tenant-info-grid dd {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: .9rem;
}

.tenant-card-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .6rem;
}

.mini-list div,
.audit-list article {
    display: grid;
    gap: .25rem;
    padding: .78rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.mini-list div:hover,
.audit-list article:hover,
.property-admin-list article:hover {
    border-color: #b8e5e8;
    background: #fbfefd;
}

.audit-list em {
    font-style: normal;
}

.property-admin-list article {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: .75rem;
    padding: .85rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.property-admin-list strong,
.property-admin-list span {
    display: block;
}

.property-admin-list div span {
    margin-top: .2rem;
    color: var(--muted);
    font-size: .88rem;
}

.payment-form {
    display: grid;
    gap: 1.05rem;
}

fieldset {
    display: grid;
    gap: 1rem;
    margin: 0;
    padding: 1.05rem;
    border: 1px solid #dfe7ef;
    border-radius: var(--radius);
    background: var(--surface-soft);
}

legend {
    padding: 0 .45rem;
    color: var(--accent-dark);
    font-weight: 900;
    font-size: 1rem;
}

.field-note {
    margin: -.35rem 0 .15rem;
    color: var(--muted);
    font-size: .9rem;
    line-height: 1.5;
}

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

.compact {
    margin-top: 1rem;
}

label {
    display: grid;
    gap: .42rem;
    color: #344054;
    font-size: .88rem;
    font-weight: 850;
}

input,
select,
textarea {
    width: 100%;
    min-height: 2.85rem;
    padding: .76rem .85rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--ink);
}

input[readonly] {
    color: var(--accent-dark);
    font-weight: 800;
    background: #edfafa;
    border-color: #b8e5e8;
}

textarea {
    resize: vertical;
    line-height: 1.45;
}

input:hover,
select:hover,
textarea:hover {
    border-color: #92a8bd;
}

input:focus,
select:focus,
textarea:focus,
a:focus-visible,
button:focus-visible {
    outline: 3px solid rgba(0, 122, 138, .18);
    border-color: var(--accent);
}

small {
    min-height: 1rem;
    color: var(--red);
    font-size: .78rem;
    font-weight: 700;
}

small.ok {
    color: var(--green);
}

.span-2 {
    grid-column: 1 / -1;
}

.notice {
    display: grid;
    gap: .25rem;
    margin: 0 0 1rem;
    padding: 1rem;
    border-radius: var(--radius);
    border: 1px solid var(--line);
}

.success {
    color: var(--green);
    background: #ecfdf3;
}

.notice.warning {
    color: var(--amber);
    background: var(--amber-soft);
}

.error {
    color: var(--red);
    background: #fff1f0;
}

.compact-notice {
    margin: 0;
    padding: .75rem;
    font-size: .9rem;
}

.tenant-confirmation-card {
    display: grid;
    justify-items: center;
    gap: .85rem;
    width: min(100%, 30rem);
    padding: 1.5rem;
    text-align: center;
}

.tenant-confirmation-card h2,
.tenant-confirmation-card p {
    margin: 0;
}

.tenant-confirmation-card h2 {
    font-size: 1.55rem;
}

.tenant-confirmation-card > p:not(.eyebrow) {
    color: var(--muted);
    line-height: 1.6;
}

.tenant-confirmation-icon {
    display: grid;
    place-items: center;
    width: 3.4rem;
    height: 3.4rem;
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 950;
    background: linear-gradient(135deg, var(--green), var(--accent));
    border-radius: 999px;
    box-shadow: 0 14px 30px rgba(6, 118, 71, .22);
}

.confirmation-reference {
    display: grid;
    gap: .2rem;
    width: 100%;
    padding: .85rem;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.confirmation-reference span {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.confirmation-reference strong {
    color: var(--accent-dark);
    font-size: 1.35rem;
}

.confirmation-actions {
    grid-template-columns: 1fr 1fr;
    width: calc(100% + 3rem);
    margin: .25rem -1.5rem -1.5rem;
}

.login-wrap {
    min-height: 62vh;
    display: grid;
    place-items: center;
}

.login-card {
    width: min(430px, 100%);
}

.login-card h1 {
    font-size: clamp(2rem, 6vw, 3.2rem);
}

.toggle-row {
    align-content: center;
    grid-template-columns: auto 1fr;
}

.toggle-row input {
    width: 1.15rem;
    min-height: 1.15rem;
}

.filters {
    margin: .5rem 0 1rem;
    padding: 1rem;
    background: #fbfcfe;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.export-menu {
    position: relative;
}

.export-menu summary {
    list-style: none;
}

.export-menu summary::-webkit-details-marker {
    display: none;
}

.export-menu div {
    position: absolute;
    right: 0;
    top: calc(100% + .4rem);
    z-index: 30;
    display: grid;
    min-width: 12rem;
    padding: .35rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.export-menu a {
    padding: .65rem .75rem;
    color: var(--ink);
    text-decoration: none;
    font-weight: 800;
    border-radius: var(--radius);
}

.export-menu a:hover {
    background: var(--surface-soft);
}

.filter-check,
.small-toggle {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 2.85rem;
}

.filter-check input,
.small-toggle input {
    width: 1rem;
    min-height: 1rem;
}

details {
    margin-top: .45rem;
}

summary {
    color: var(--accent-dark);
    cursor: pointer;
    font-weight: 800;
}

details p {
    margin: .4rem 0 0;
    max-width: 18rem;
    color: var(--muted);
    font-size: .84rem;
}

.filters input,
.filters select {
    width: auto;
    min-width: 13rem;
}

.payment-filters input,
.payment-filters select {
    width: 100%;
    min-width: 0;
}

.payment-filters .filter-check {
    width: 100%;
    padding: 0 .75rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    background: var(--surface);
}

th,
td {
    padding: 1rem .95rem;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid var(--line);
}

thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--surface-soft);
}

tbody tr:first-child td,
thead tr:first-child th {
    border-top: 0;
}

tbody tr:hover {
    background: #fbfefd;
}

th {
    color: var(--muted);
    font-size: .76rem;
    text-transform: uppercase;
    letter-spacing: .06em;
}

td {
    line-height: 1.45;
}

.verify-form {
    display: grid;
    gap: .45rem;
    min-width: 13rem;
    padding: .65rem;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.empty {
    text-align: center;
    color: var(--muted);
}

.contract-body {
    background: #edf2f7;
}

.contract-shell {
    width: min(100% - 2rem, 980px);
    margin: 0 auto;
    padding: 1.5rem 0 3rem;
}

.contract-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
    margin-bottom: 1rem;
}

.contract-email-status {
    margin-right: auto;
    padding: .58rem .7rem;
    color: var(--accent-dark);
    font-size: .84rem;
    font-weight: 850;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.contract-document {
    position: relative;
    display: grid;
    gap: 1rem;
    padding: clamp(1.2rem, 3vw, 2rem);
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.contract-document::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: .35rem;
    background: linear-gradient(90deg, var(--accent-dark), var(--accent), #86c8c2);
    border-radius: var(--radius) var(--radius) 0 0;
}

.contract-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--ink);
}

.contract-brand-block {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.contract-brand-block img,
.contract-logo-fallback {
    display: grid;
    place-items: center;
    width: 5rem;
    height: 5rem;
    object-fit: contain;
    color: #ffffff;
    font-size: 2rem;
    font-weight: 950;
    background: linear-gradient(135deg, var(--ink), var(--accent));
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.contract-header h1 {
    margin: .2rem 0;
    font-size: 2rem;
    line-height: 1.08;
}

.contract-header p {
    margin: 0;
    color: var(--muted);
}

.contract-number {
    display: grid;
    justify-items: end;
    gap: .15rem;
    min-width: 11rem;
    padding: .8rem;
    background: linear-gradient(135deg, #ffffff, var(--surface-soft));
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
}

.approval-stamp {
    width: fit-content;
    padding: .25rem .5rem;
    color: var(--green) !important;
    background: var(--green-soft);
    border: 1px solid #bfe9ce;
    border-radius: 999px;
}

.contract-number span,
.contract-summary-strip span,
.contract-note span,
.contract-intro span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.contract-number em {
    color: var(--muted);
    font-size: .82rem;
    font-style: normal;
}

.contract-intro {
    padding: .85rem 1rem;
    color: #344054;
    line-height: 1.65;
    background: linear-gradient(135deg, #fbfcfe, #f2faf8);
    border: 1px solid #c8e8eb;
    border-radius: var(--radius);
}

.contract-intro p {
    margin: 0;
}

.contract-intro strong {
    color: var(--ink);
}

.contract-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
}

.contract-summary-strip div {
    display: grid;
    gap: .15rem;
    padding: .8rem;
    background: var(--accent-soft);
    border: 1px solid #b8e5e8;
    border-radius: var(--radius);
}

.contract-summary-strip strong {
    line-height: 1.2;
}

.contract-section {
    display: grid;
    gap: .75rem;
    padding-top: .85rem;
    border-top: 1px solid var(--line);
}

.contract-section h2 {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0;
    font-size: 1.05rem;
}

.contract-section h2::before {
    content: "";
    width: .55rem;
    height: .55rem;
    background: var(--accent);
    border-radius: 999px;
}

.contract-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
    margin: 0;
}

.contract-grid div,
.contract-note {
    display: grid;
    gap: .15rem;
    padding: .7rem;
    background: #fbfcfe;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.contract-grid dt {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.contract-grid dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.contract-note p,
.contract-terms {
    margin: 0;
    color: #344054;
    line-height: 1.65;
}

.contract-terms {
    padding: 1rem;
    background: #fbfcfe;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.signature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    padding-top: 2.5rem;
}

.signature-grid div {
    display: grid;
    gap: .45rem;
    min-height: 8rem;
    padding-top: 2.5rem;
    border-top: 2px solid var(--ink);
}

.signature-grid strong {
    font-size: 1rem;
}

.signature-grid span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.signature-grid em {
    color: var(--muted);
    font-style: normal;
}

.footer {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem clamp(1rem, 4vw, 3rem);
    color: var(--muted);
    border-top: 1px solid var(--line);
}

@media (max-width: 900px) {
    .topbar,
    .hero,
    .page-title,
    .admin-head,
    .footer {
        align-items: stretch;
        flex-direction: column;
    }

    .brand {
        min-width: 0;
    }

    .nav {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .admin-subnav,
    .admin-tabs {
        top: 0;
    }

    .nav a {
        flex: 1 0 auto;
    }

    .grid,
    .metric-grid,
    .property-metrics,
    .public-property-showcase,
    .apartment-facts,
    .form-grid,
    .flow-steps,
    .admin-grid,
    .alert-list,
    .payment-insight-grid,
    .payment-filters,
    .filter-cluster,
    .payment-review-grid,
    .verification-workbench,
    .danger-zone form,
    .inline-edit-form,
    .trash-actions,
    .trash-meta,
    .trash-row,
    .property-card-grid,
    .property-view-summary,
    .notification-row,
    .audit-row,
    .log-detail-grid,
    .tenant-row,
    .tenant-profile-summary,
    .payment-row,
    .payment-modal-summary,
    .tenant-info-grid,
    .dashboard-layout,
    .dashboard-command,
    .dashboard-kpis,
    .dashboard-grid,
    .dashboard-grid-wide,
    .kpi-stack,
    .dashboard-payment-row,
    .dashboard-row,
    .security-layout,
    .property-summary-grid,
    .form-section,
    .property-workspace,
    .property-inventory-details {
        grid-template-columns: 1fr;
    }

    .span-2 {
        grid-column: auto;
    }

    .property-hero {
        min-height: auto;
    }

    .apartment-media {
        height: 14.5rem;
    }

    .detail-list div {
        grid-template-columns: 1fr;
        gap: .25rem;
    }

    .filters input,
    .filters select,
    .filters button,
    .filters a,
    .form-footer button,
    .property-admin-list .ghost-action {
        width: 100%;
    }

    .form-footer {
        align-items: stretch;
    }

    .payments-command-head,
    .payment-command-actions,
    .filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .payment-command-actions,
    .payment-command-actions .ghost-action,
    .filter-actions .primary-action,
    .filter-actions .ghost-action {
        width: 100%;
    }

    .payment-filters .filter-search {
        grid-row: auto;
    }

    .payment-filters .filter-search input {
        min-height: 2.85rem;
    }

    .payment-insight-grid,
    .filter-cluster,
    .compact-filters,
    .contract-summary-strip,
    .contract-grid,
    .signature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payment-review-card {
        padding: .9rem;
    }

    .payment-directory-head {
        display: none;
    }

    .notification-directory-head,
    .audit-directory-head,
    .trash-directory-head {
        display: none;
    }

    .notification-row,
    .audit-row {
        align-items: stretch;
        gap: .7rem;
    }

    .notification-row-actions,
    .audit-row-actions {
        justify-items: stretch;
    }

    .notification-row-actions .primary-action,
    .audit-row-actions .primary-action {
        width: 100%;
    }

    .property-viewer,
    .log-viewer,
    .trash-viewer {
        width: calc(100vw - 1rem);
        max-height: calc(100dvh - 1rem);
    }

    .property-view-head,
    .log-modal-head,
    .trash-modal-head {
        align-items: stretch;
        flex-direction: column;
    }

    .trash-row {
        align-items: stretch;
        gap: .7rem;
    }

    .trash-row-actions,
    .inline-edit-actions {
        justify-items: stretch;
    }

    .trash-row-actions .primary-action,
    .inline-edit-actions .primary-action {
        width: 100%;
    }

    .payment-row {
        align-items: stretch;
        gap: .7rem;
    }

    .payment-row-actions {
        justify-items: stretch;
    }

    .payment-row-actions .primary-action {
        width: 100%;
    }

    .payment-viewer {
        width: calc(100vw - 1rem);
        max-height: calc(100dvh - 1rem);
    }

    .payment-modal-head {
        align-items: stretch;
        flex-direction: column;
    }

    .tenant-directory-head {
        display: none;
    }

    .tenant-row {
        align-items: stretch;
        gap: .7rem;
    }

    .tenant-row-actions {
        justify-items: stretch;
    }

    .tenant-row-actions .primary-action {
        width: 100%;
    }

    .tenant-viewer {
        width: calc(100vw - 1rem);
        max-height: calc(100dvh - 1rem);
    }

    .tenant-modal-head {
        align-items: stretch;
        flex-direction: column;
    }

    .review-actions {
        grid-template-columns: 1fr;
    }

    .property-editor {
        width: min(100%, calc(100vw - 1rem));
    }

    .property-modal-form {
        padding: .85rem;
    }

    .form-section {
        padding: .85rem;
    }

    .modal-actions {
        display: grid;
        grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr);
        margin: .1rem -.85rem -.85rem;
        padding: .85rem;
    }

    .modal-actions button,
    .modal-actions a {
        width: 100%;
    }

    .admin-actions,
    .admin-actions .ghost-action,
    .export-menu {
        width: 100%;
    }

    .export-menu div {
        position: static;
        margin-top: .4rem;
        box-shadow: none;
    }

    .payment-review-head {
        flex-direction: column;
    }

    .payment-amount {
        justify-items: start;
        width: 100%;
        min-width: 0;
        text-align: left;
    }

    .review-actions .primary-action,
    .proof-link {
        width: 100%;
    }

    .tenant-profile-card header,
    .tenant-card-actions,
    .dashboard-heading,
    .executive-card-top,
    .contract-row,
    .property-inventory-card header,
    .property-inventory-card footer {
        align-items: stretch;
        flex-direction: column;
    }

    .modal-head {
        align-items: stretch;
        flex-direction: column;
    }

    .receipt-viewer {
        width: calc(100vw - 1rem);
        height: calc(100dvh - 1rem);
    }

    .sms-viewer {
        width: calc(100vw - 1rem);
    }

    .sms-proof-body {
        padding: .6rem;
    }

    .sms-proof-body pre {
        min-height: 260px;
        max-height: 62vh;
        padding: .9rem;
        font-size: .92rem;
    }

    .receipt-modal-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }

    .receipt-modal-actions .ghost-action {
        width: 100%;
    }

    .receipt-frame-shell {
        padding: .6rem;
    }

    .receipt-frame-shell iframe {
        min-height: 420px;
    }

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

    .property-editor .modal-head .icon-action {
        width: auto;
        min-width: 5rem;
        justify-self: end;
    }

    .section-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .contract-header,
    .contract-brand-block {
        align-items: stretch;
        flex-direction: column;
    }

    .contract-number {
        justify-items: start;
        width: 100%;
    }

    .table-wrap {
        border: 0;
        overflow: visible;
    }

    .property-admin-list article {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    table,
    thead,
    tbody,
    th,
    td,
    tr {
        display: block;
        min-width: 0;
    }

    thead {
        display: none;
    }

    tbody {
        display: grid;
        gap: .85rem;
    }

    tr {
        background: var(--surface);
        border: 1px solid var(--line);
        border-radius: var(--radius);
        box-shadow: 0 10px 22px rgba(16, 24, 40, .07);
    }

    td {
        display: grid;
        grid-template-columns: 7rem 1fr;
        gap: .75rem;
        border-top: 1px solid var(--line);
    }

    td:first-child {
        border-top: 0;
    }

    td::before {
        color: var(--muted);
        font-size: .76rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: .06em;
    }

    td:nth-child(1)::before { content: "ID"; }
    td:nth-child(2)::before { content: "Tenant"; }
    td:nth-child(3)::before { content: "Contract"; }
    td:nth-child(4)::before { content: "Payment"; }
    td:nth-child(5)::before { content: "Receipt"; }
    td:nth-child(6)::before { content: "Status"; }
    td:nth-child(7)::before { content: "Verify"; }
}

@media (max-width: 520px) {
    .shell {
        width: min(100% - 1rem, 1180px);
        padding-top: 1rem;
    }

    .panel,
    .card,
    fieldset {
        padding: .9rem;
    }

    h1 {
        font-size: 2.2rem;
    }

    .flow-steps article {
        min-height: auto;
    }

    td {
        grid-template-columns: 1fr;
        gap: .35rem;
    }

    .contract-shell {
        width: min(100% - 1rem, 980px);
    }

    .contract-summary-strip,
    .contract-grid,
    .signature-grid {
        grid-template-columns: 1fr;
    }
}

@media print {
    @page {
        size: A4;
        margin: 12mm;
    }

    html,
    body,
    .contract-body {
        background: #ffffff;
        font-size: 9pt;
        line-height: 1.28;
    }

    .topbar,
    .footer,
    .contract-toolbar {
        display: none !important;
    }

    .contract-shell {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .contract-document {
        display: block;
        gap: 0;
        padding: 2.5mm;
        border: 0;
        box-shadow: none;
    }

    .contract-document::before {
        display: none;
    }

    .contract-header {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        gap: .6rem;
        padding-bottom: .35rem;
        margin-bottom: .35rem;
        border-bottom-width: 1.5px;
    }

    .contract-brand-block {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: .55rem;
    }

    .contract-brand-block img,
    .contract-logo-fallback {
        width: 2.6rem;
        height: 2.6rem;
        font-size: 1.15rem;
    }

    .contract-header h1 {
        margin: .08rem 0;
        font-size: 15pt;
        line-height: 1.08;
    }

    .contract-header p,
    .contract-number em,
    .contract-grid dd,
    .contract-note p,
    .contract-terms,
    .signature-grid em {
        font-size: 8.7pt;
    }

    .contract-number {
        width: auto !important;
        justify-items: end !important;
        min-width: 8.5rem;
        padding: .35rem .45rem;
        gap: .05rem;
    }

    .approval-stamp {
        padding: .12rem .34rem;
        border-radius: 4px;
    }

    .contract-intro {
        padding: .35rem .45rem;
        margin-bottom: .35rem;
        line-height: 1.32;
        border-radius: 4px;
    }

    .contract-intro p {
        font-size: 8.7pt;
    }

    .contract-summary-strip {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: .25rem;
        margin-bottom: .35rem;
    }

    .contract-summary-strip div {
        padding: .32rem .4rem;
        gap: .03rem;
    }

    .contract-summary-strip strong,
    .contract-number strong {
        font-size: 9.4pt;
        line-height: 1.15;
    }

    .contract-section {
        gap: .24rem;
        padding-top: .32rem;
        margin-top: .32rem;
        border-top-width: 1px;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .terms-section {
        break-inside: auto;
        page-break-inside: auto;
    }

    .contract-section h2 {
        font-size: 9.8pt;
        line-height: 1.1;
        break-after: avoid;
        page-break-after: avoid;
    }

    .contract-section h2::before {
        width: .35rem;
        height: .35rem;
    }

    .contract-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .22rem;
        break-before: avoid;
        page-break-before: avoid;
    }

    .contract-grid div,
    .contract-note {
        padding: .28rem .34rem;
        gap: .02rem;
        border-radius: 4px;
    }

    .contract-grid dt,
    .contract-number span,
    .contract-summary-strip span,
    .contract-note span,
    .approval-stamp,
    .signature-grid span {
        font-size: 6.7pt;
        letter-spacing: .04em;
    }

    .contract-note {
        margin-top: .22rem;
        break-before: avoid;
        page-break-before: avoid;
    }

    .contract-note p,
    .contract-terms {
        line-height: 1.3;
    }

    .contract-terms {
        padding: .42rem .5rem;
        border-radius: 4px;
        break-before: avoid;
        page-break-before: avoid;
    }

    .signature-grid {
        gap: .7rem;
        padding-top: 1rem;
        break-inside: avoid;
    }

    .signature-grid div {
        gap: .18rem;
        min-height: 4.6rem;
        padding-top: 1rem;
        border-top-width: 1.5px;
    }

    .contract-brand-block img,
    .contract-logo-fallback {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
}