@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

:root {
    --ink: #211f1a;
    --ink-2: #3b372f;
    --muted: #756f65;
    --muted-2: #9d968b;
    --line: #e4ded3;
    --line-soft: #eee9e1;
    --surface: #ffffff;
    --canvas: #f7f4ee;
    --champagne: #efe5d2;
    --gold: #a68035;
    --gold-bright: #d4ad5c;
    --gold-soft: #f3ead8;
    --green: #47735d;
    --green-soft: #e4f0e9;
    --red: #b84945;
    --red-soft: #f8e8e6;
    --blue: #2d83a2;
    --blue-soft: #e3f2f7;
    --amber: #a66e20;
    --amber-soft: #f9eed8;
    --shadow-sm: 0 1px 2px rgba(25, 20, 12, .04), 0 5px 18px rgba(38, 30, 18, .04);
    --shadow-md: 0 12px 35px rgba(34, 27, 17, .09);
    --radius: 14px;
    --sidebar: 258px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: "DM Sans", Inter, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }

.demo-ribbon {
    position: fixed; inset: 0 0 auto 0; height: 28px; z-index: 90;
    display: flex; align-items: center; justify-content: center; gap: 9px;
    background: #0b0b0a; color: #ddd2bb; font-size: 10px; font-weight: 700;
    letter-spacing: .16em; text-transform: uppercase;
}
.demo-dot { width: 3px; height: 3px; background: var(--gold-bright); border-radius: 50%; }

.sidebar {
    position: fixed; inset: 28px auto 0 0; width: var(--sidebar); z-index: 60;
    display: flex; flex-direction: column; overflow-y: auto;
    color: #d8d5ce; background: #151513; border-right: 1px solid rgba(255,255,255,.06);
}
.brand { height: 88px; padding: 0 22px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.07); }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #806a3b; color: #e1be72; font: 700 13px/1 "Manrope", sans-serif; letter-spacing: .05em; }
.brand strong { display: block; color: #fff; font: 700 13px/1.2 "Manrope", sans-serif; letter-spacing: .11em; }
.brand span { display: block; color: #8f8c85; font-size: 10px; margin-top: 5px; }
.side-nav { flex: 1; padding: 22px 14px; }
.nav-label { margin: 0 12px 8px; color: #696760; font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.nav-link { position: relative; min-height: 42px; margin: 2px 0; padding: 0 12px; border-radius: 8px; display: flex; align-items: center; gap: 12px; color: #aaa69f; font-size: 13px; font-weight: 500; transition: .18s ease; }
.nav-link i { width: 20px; color: #817e77; font-size: 17px; text-align: center; transition: .18s ease; }
.nav-link small { margin-left: auto; min-width: 21px; height: 19px; padding: 0 6px; display: grid; place-items: center; border-radius: 8px; background: #322e25; color: #c9a65e; font-size: 10px; }
.nav-link:hover { background: rgba(255,255,255,.045); color: #eeeae2; }
.nav-link.active { color: #fff; background: linear-gradient(90deg, rgba(183,138,52,.2), rgba(183,138,52,.07)); box-shadow: inset 2px 0 0 var(--gold-bright); }
.nav-link.active i { color: var(--gold-bright); }
.sidebar-footer { padding: 14px; border-top: 1px solid rgba(255,255,255,.07); }
.portfolio-switcher { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 8px; }
.portfolio-switcher strong, .portfolio-switcher small { display: block; }
.portfolio-switcher strong { color: #eeeae4; font-size: 12px; }
.portfolio-switcher small { color: #77746e; font-size: 10px; margin-top: 2px; }
.portfolio-switcher > i { color: #77746e; }
.role-switch { width:100%; min-height: 38px; margin-top: 9px; padding: 0 12px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid rgba(212,173,92,.25); border-radius: 8px; color: #cdb783; background:transparent; font-size: 11px; font-weight: 600; cursor:pointer; }
.role-switch:hover { color: #fff; border-color: rgba(212,173,92,.55); background: rgba(212,173,92,.08); }

.avatar { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 50%; background: #302e29; color: #fff; font-size: 11px; font-weight: 700; }
.avatar-gold { background: #7e642e; color: #fff5df; }
.app-shell { min-height: 100vh; margin-left: var(--sidebar); padding-top: 28px; }
.topbar { position: sticky; top: 28px; z-index: 40; height: 68px; padding: 0 30px; display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.topbar-context { display: flex; align-items: center; gap: 7px; color: #98938a; font-size: 12px; }
.topbar-context i { font-size: 16px; }
.topbar-context strong { color: #4e4a43; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.today { margin: 0 6px; color: #77736b; font-size: 11px; font-weight: 600; }
.icon-button { position: relative; width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; transition: .18s ease; }
.icon-button:hover { border-color: #cfc7b8; background: #faf8f3; transform: translateY(-1px); }
.icon-button i { font-size: 17px; }
.has-notification::after { content: ""; position: absolute; top: 7px; right: 7px; width: 5px; height: 5px; border: 2px solid #fff; border-radius: 50%; background: var(--gold); }
.menu-button { display: none; }
.sidebar-overlay { display: none; }

.content-shell { width: min(1540px, 100%); margin: 0 auto; padding: 30px; }
.page-heading { margin-bottom: 25px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.eyebrow { margin: 0 0 9px; display: flex; align-items: center; gap: 8px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow span { width: 20px; height: 1px; background: var(--gold); }
.page-heading h1 { margin: 0; font: 700 clamp(26px, 2.2vw, 34px)/1.15 "Manrope", sans-serif; letter-spacing: -.035em; }
.page-heading > div > p:last-child { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.page-heading > div > p strong { color: var(--ink); }
.page-actions { display: flex; gap: 9px; }
.button { min-height: 40px; padding: 0 15px; border: 1px solid transparent; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; font-weight: 700; cursor: pointer; transition: .18s ease; }
.button i { font-size: 16px; }
.button span { min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 7px; background: rgba(255,255,255,.16); font-size: 10px; }
.button:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(30,24,15,.11); }
.button-primary { background: var(--ink); color: #fff; }
.button-primary:hover { background: #2b2823; }
.button-secondary { border-color: var(--line); background: #fff; color: #57534c; }
.button-gold { background: var(--gold); color: #fff; }
.text-link { color: #756134; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.text-link:hover { color: var(--ink); }

.kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.kpi-card { min-height: 156px; padding: 17px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.kpi-top { margin-bottom: 14px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kpi-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #f2eee5; color: #796538; }
.kpi-icon i { font-size: 16px; }
.kpi-card p { margin: 0; color: var(--muted); font-size: 11px; font-weight: 600; }
.kpi-card > strong { margin-top: 5px; display: block; font: 700 25px/1.2 "Manrope", sans-serif; letter-spacing: -.04em; }
.kpi-card > strong.currency { font-size: 21px; }
.kpi-card > small { margin-top: 7px; display: block; color: #918c84; font-size: 9.5px; line-height: 1.4; }
.trend, .muted-tag { padding: 4px 6px; border-radius: 7px; font-size: 8.5px; font-weight: 700; white-space: nowrap; }
.trend.positive { color: var(--green); background: var(--green-soft); }
.trend.negative { color: var(--red); background: var(--red-soft); }
.muted-tag { color: #7c776e; background: #f0ede7; }
.micro-progress { height: 3px; margin-top: 12px; overflow: hidden; border-radius: 3px; background: #eee9df; }
.micro-progress span { height: 100%; display: block; background: var(--gold); }
.green-text { color: var(--green); font-weight: 600; }
.warning-text { color: #9a681e !important; }
.feature-kpi { border-color: #d7c18f; background: linear-gradient(145deg,#fff,#fbf6ea); }
.alert-kpi { background: linear-gradient(145deg,#fff,#fff9f7); }

.dashboard-grid { display: grid; gap: 14px; }
.primary-grid { grid-template-columns: minmax(0, 1.72fr) minmax(285px, .72fr); margin-top: 14px; }
.lower-grid { grid-template-columns: 1.32fr .78fr; margin-top: 14px; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.panel-header { min-height: 69px; padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line-soft); }
.panel-header h2, .section-heading h2 { margin: 3px 0 0; font: 700 16px/1.2 "Manrope", sans-serif; letter-spacing: -.025em; }
.section-kicker { color: #9b885f; font-size: 8.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.period-select { height: 32px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #faf9f6; color: #6e6961; font-size: 10px; font-weight: 600; }
.collection-summary { padding: 16px 20px 2px; display: flex; gap: 50px; }
.collection-summary small, .collection-summary strong { display: block; }
.collection-summary small { color: var(--muted); font-size: 9px; }
.collection-summary strong { margin-top: 3px; font: 700 14px/1.2 "Manrope", sans-serif; }
.bar-chart { height: 215px; padding: 19px 20px 5px; display: grid; grid-template-columns: 32px 1fr; gap: 8px; }
.axis-labels { padding-bottom: 23px; display: flex; flex-direction: column; justify-content: space-between; color: #aaa59d; font-size: 8px; text-align: right; }
.bar-stage { position: relative; display: flex; align-items: stretch; justify-content: space-around; gap: 8px; border-bottom: 1px solid var(--line); }
.chart-grid-lines { position: absolute; inset: 0 0 22px; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }
.chart-grid-lines i { display: block; border-top: 1px dashed #eee9df; }
.bar-group { position: relative; z-index: 1; width: 9%; display: flex; align-items: flex-end; justify-content: center; gap: 3px; padding-bottom: 23px; }
.bar-group i { width: 9px; max-width: 34%; display: block; border-radius: 3px 3px 1px 1px; }
.bar-group .expected { background: #e8e2d7; }
.bar-group .actual { background: #947634; }
.bar-group.active .actual { background: var(--gold-bright); box-shadow: 0 4px 12px rgba(183,138,52,.28); }
.bar-group span { position: absolute; bottom: 5px; color: #969087; font-size: 8px; }
.chart-legend { padding: 5px 20px 15px; display: flex; justify-content: flex-end; gap: 16px; color: #8c877f; font-size: 8px; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }
.chart-legend i { width: 7px; height: 7px; border-radius: 2px; }
.legend-expected { background: #e8e2d7; }
.legend-actual { background: var(--gold); }

.donut-wrap { height: 170px; display: grid; place-items: center; }
.donut-chart { width: 132px; height: 132px; padding: 14px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#a68035 0 85.7%, #d9d2c6 85.7% 96.4%, #22201d 96.4% 100%); }
.donut-chart > div { width: 100%; height: 100%; display: grid; align-content: center; text-align: center; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px #eee9e0; }
.donut-chart strong { font: 700 26px/1 "Manrope",sans-serif; }
.donut-chart span { margin-top: 5px; color: var(--muted); font-size: 9px; }
.occupancy-legend { padding: 0 18px; }
.occupancy-legend > div { padding: 8px 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line-soft); font-size: 10px; }
.occupancy-legend > div > span { display: flex; align-items: center; gap: 7px; color: #69655f; }
.occupancy-legend strong { font-size: 11px; }
.occupancy-legend strong small { color: #99938b; font-weight: 500; }
.dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; }
.dot.occupied { background: #a68035; }.dot.vacant { background: #d9d2c6; }.dot.reserved { background: #22201d; }
.insight-callout { margin: 14px 16px 16px; padding: 11px; display: flex; align-items: center; gap: 9px; border-radius: 9px; background: #f7f2e7; }
.insight-callout > i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: #e8d6af; color: #806629; }
.insight-callout p, .insight-callout strong, .insight-callout span { margin: 0; display: block; }
.insight-callout strong { font-size: 10px; }.insight-callout span { margin-top: 2px; color: #81796c; font-size: 8.5px; }

.section-heading { margin: 25px 2px 12px; display: flex; align-items: flex-end; justify-content: space-between; }
.property-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.property-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); transition: .2s ease; }
.property-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.property-image { position: relative; height: 142px; padding: 15px; display: flex; align-items: flex-end; background-size: cover; background-position: center; color: #fff; }
.property-image > div { position: relative; z-index: 1; }
.property-image h3 { margin: 0; font: 700 17px/1.15 "Manrope",sans-serif; }.property-image p { margin: 5px 0 0; color: rgba(255,255,255,.72); font-size: 9px; }
.property-image p i { margin-right: 4px; }
.status-chip { position: absolute; top: 12px; right: 12px; min-height: 23px; padding: 0 8px; display: flex; align-items: center; gap: 5px; border-radius: 20px; font-size: 8px; font-weight: 700; backdrop-filter: blur(8px); }
.status-chip.light { background: rgba(22,21,19,.62); border: 1px solid rgba(255,255,255,.16); color: #fff; }
.status-chip i { width: 5px; height: 5px; border-radius: 50%; background: #d8b35e; }
.property-card-body { padding: 14px 15px; display: grid; grid-template-columns: .6fr 1.15fr 1fr; gap: 12px; }
.property-card-body span, .property-card-body strong { display: block; }
.property-card-body span { color: #99938a; font-size: 8px; }.property-card-body strong { margin-top: 3px; font-size: 10px; }
.property-progress { height: 3px; background: #ece7de; }.property-progress i { height: 100%; display: block; background: var(--gold); }

.activity-list { padding: 3px 18px 9px; }
.activity-row { min-height: 62px; display: grid; grid-template-columns: 33px 1fr auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line-soft); }
.activity-row:last-child { border-bottom: 0; }
.activity-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; }
.activity-icon.green { background: var(--green-soft); color: var(--green); }.activity-icon.amber { background: var(--amber-soft); color: var(--amber); }.activity-icon.blue { background: var(--blue-soft); color: var(--blue); }.activity-icon.red { background: var(--red-soft); color: var(--red); }
.activity-row > div strong, .activity-row > div span { display: block; }
.activity-row > div strong { font-size: 10px; }.activity-row > div span { margin-top: 2px; color: #918c83; font-size: 8.5px; }
.activity-value { text-align: right; }.activity-value strong { font-size: 9px !important; }.activity-value span { font-size: 8px !important; }
.count-pill { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; color: #9a7026; background: var(--amber-soft); font-size: 9px; font-weight: 700; }
.priority-row { min-height: 68px; margin: 0 17px; display: grid; grid-template-columns: 28px 1fr 16px; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }
.priority-row:last-child { border-bottom: 0; }
.priority-row:hover > i { transform: translateX(2px); }
.priority-number { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; color: #67625a; background: #f1eee8; font-size: 8px; font-weight: 800; }
.priority-number.danger { color: var(--red); background: var(--red-soft); }.priority-number.amber { color: var(--amber); background: var(--amber-soft); }
.priority-row strong, .priority-row span { display: block; }.priority-row strong { font-size: 10px; }.priority-row span { margin-top: 3px; color: #918c84; font-size: 8.5px; }.priority-row > i { color: #9f9990; transition: .18s ease; }

.toast-stack { position: fixed; top: 70px; right: 20px; z-index: 150; display: grid; gap: 8px; }
.toast { min-width: 285px; max-width: 360px; padding: 12px 14px; display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 10px; border: 1px solid #d9d1c2; border-radius: 11px; background: #fff; box-shadow: var(--shadow-md); animation: toast-in .22s ease; }
.toast i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: var(--green-soft); color: var(--green); }.toast strong { display: block; font-size: 11px; }.toast span { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; }
@keyframes toast-in { from { transform: translateY(-8px); opacity: 0; } }
.modal-backdrop { position: fixed; inset: 0; z-index: 200; padding: 20px; display: none; place-items: center; background: rgba(12,11,10,.58); backdrop-filter: blur(5px); }
.modal-backdrop.open { display: grid; }
.modal-card { position: relative; width: min(620px, 100%); max-height: 90vh; overflow-y: auto; border-radius: 16px; background: #fff; box-shadow: 0 25px 80px rgba(0,0,0,.25); animation: modal-in .2s ease; }
@keyframes modal-in { from { transform: translateY(10px) scale(.98); opacity: 0; } }
.modal-close { position: absolute; top: 14px; right: 14px; z-index: 2; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }

.profile-hero { margin-bottom: 15px; padding-bottom: 15px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line-soft); }
.profile-hero .avatar { width: 42px; height: 42px; }
.profile-hero strong,.profile-hero span { display: block; }
.profile-hero > div > strong { font-size: 11px; }
.profile-hero > div > span { margin-top: 4px; color: #918b82; font-size: 8px; }
.profile-tabs { margin: 16px 0 4px; padding-bottom: 8px; display: flex; gap: 6px; overflow-x: auto; border-bottom: 1px solid var(--line-soft); }
.profile-tabs button { padding: 6px 8px; border: 0; border-radius: 7px; background: transparent; color: #857f77; font-size: 7.5px; font-weight: 700; white-space: nowrap; }
.profile-tabs button.active { color: #fff; background: var(--ink); }
.modal-description { margin: 15px 0 0; padding: 11px; border-radius: 9px; color: #6f6961; background: #f7f4ee; font-size: 9px; line-height: 1.5; }
.reconciled { background: var(--green); }
.application-complete { opacity: .62; }
[hidden] { display: none !important; }

@media (max-width: 1280px) {
    .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
    :root { --sidebar: 250px; }
    .sidebar { transform: translateX(-100%); transition: transform .23s ease; box-shadow: 15px 0 40px rgba(0,0,0,.18); }
    body.nav-open .sidebar { transform: translateX(0); }
    .sidebar-overlay { position: fixed; inset: 28px 0 0; z-index: 55; border: 0; background: rgba(10,10,9,.35); backdrop-filter: blur(2px); }
    body.nav-open .sidebar-overlay { display: block; }
    .app-shell { margin-left: 0; }
    .menu-button { display: grid; }
    .topbar-context { margin-right: auto; margin-left: 12px; }
    .content-shell { padding: 25px 22px; }
}

@media (max-width: 768px) {
    .topbar { height: 62px; padding: 0 16px; }.topbar-context span,.topbar-context i { display: none; }
    .content-shell { padding: 20px 15px 30px; }
    .page-heading { align-items: stretch; flex-direction: column; gap: 17px; }
    .page-actions { display: grid; grid-template-columns: 1fr 1fr; }.button { padding: 0 11px; }
    .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .kpi-card { min-height: 146px; padding: 14px; }
    .kpi-card > strong { font-size: 22px; }.kpi-card > strong.currency { font-size: 17px; }
    .primary-grid, .lower-grid { grid-template-columns: 1fr; }
    .collection-summary { gap: 20px; justify-content: space-between; }.collection-summary strong { font-size: 11px; }
    .property-card-grid { grid-template-columns: 1fr; }
    .property-image { height: 170px; }
}

@media (max-width: 480px) {
    .mobile-hide { display: none !important; }
    .demo-ribbon { height: 24px; }.sidebar { inset-block-start: 24px; }.app-shell { padding-top: 24px; }.topbar { top: 24px; }
    .page-heading h1 { font-size: 25px; }
    .page-heading > div > p:last-child { font-size: 12px; line-height: 1.5; }
    .page-actions { grid-template-columns: 1fr; }
    .kpi-card > small { font-size: 8.5px; }
    .collection-summary { padding-inline: 14px; gap: 8px; }.collection-summary > div:last-child { display: none; }
    .bar-chart { padding-inline: 12px; height: 195px; }.bar-group i { width: 7px; }
    .activity-list { padding-inline: 12px; }.activity-row { grid-template-columns: 32px 1fr; }.activity-value { grid-column: 2; margin-top: -14px; text-align: left; }
    .section-heading { align-items: center; }
    .toast-stack { left: 12px; right: 12px; }.toast { min-width: 0; width: 100%; }
}

/* Shared inner-page components */
.inner-heading { margin-bottom: 20px; }
.summary-strip { min-height: 78px; margin-bottom: 14px; padding: 0 22px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.summary-strip > div { padding-left: 20px; border-left: 1px solid var(--line-soft); }
.summary-strip > div:first-child { padding-left: 0; border-left: 0; }
.summary-strip span, .summary-strip strong { display: block; }.summary-strip span { color: var(--muted); font-size: 9px; }.summary-strip strong { margin-top: 4px; font: 700 15px/1.2 "Manrope",sans-serif; }
.portfolio-grid-large { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.property-overview { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.property-overview-image { position: relative; height: 205px; padding: 19px; display: flex; align-items: flex-end; background-size: cover; background-position: center; color: #fff; }
.property-overview-image h2 { margin: 4px 0; font: 700 21px/1.1 "Manrope",sans-serif; }.property-overview-image p,.property-overview-image small { margin: 0; color: rgba(255,255,255,.7); font-size: 9px; }.property-overview-image p i { margin-right: 4px; }
.property-overview-body { padding: 16px; }.property-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }.property-stats > div { padding: 9px 4px; border-radius: 8px; background: #f7f5f0; text-align: center; }.property-stats span,.property-stats strong { display: block; }.property-stats span { color: #928c83; font-size: 7.5px; }.property-stats strong { margin-top: 3px; font-size: 12px; }
.rent-progress { margin: 16px 0; }.rent-progress > div:first-child { display: flex; justify-content: space-between; color: #7e7870; font-size: 9px; }.rent-progress strong { color: var(--ink); font-size: 10px; }.rent-progress strong small { color: #9b958c; font-weight: 500; }
.large-progress { height: 6px; margin-top: 8px; overflow: hidden; border-radius: 10px; background: #eee9e0; }.large-progress i { height: 100%; display: block; border-radius: inherit; background: var(--gold); }.large-progress.dark { background: rgba(255,255,255,.14); }.large-progress.dark i { background: var(--gold-bright); }
.property-open { width: 100%; }
.legend-inline { display: flex; align-items: center; gap: 6px; color: #837e75; font-size: 9px; }.legend-inline .unit-dot:not(:first-child) { margin-left: 10px; }
.unit-dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: #aaa; }.unit-dot.occupied,.occupied .unit-dot { background: var(--green); }.unit-dot.vacant,.vacant .unit-dot { background: #b7b1a6; }.unit-dot.reserved,.reserved .unit-dot { background: var(--gold); }.unit-dot.submitted { background: var(--red); }.unit-dot.assigned { background: var(--blue); }.unit-dot.progress { background: var(--amber); }.unit-dot.resolved { background: var(--green); }
.unit-grid { display: grid; gap: 9px; }.compact-unit-grid { grid-template-columns: repeat(12,minmax(0,1fr)); }.full-unit-grid { grid-template-columns: repeat(10,minmax(0,1fr)); }
.unit-card { min-width: 0; height: 86px; padding: 11px; border: 1px solid var(--line); border-top: 3px solid #b5afa5; border-radius: 10px; display: flex; flex-direction: column; align-items: flex-start; background: #fff; text-align: left; cursor: pointer; box-shadow: var(--shadow-sm); transition: .18s ease; }
.unit-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }.unit-card.occupied { border-top-color: var(--green); }.unit-card.vacant { border-top-color: #aaa397; background: #faf9f6; }.unit-card.reserved { border-top-color: var(--gold); background: #fffaf0; }
.unit-card span { width: 100%; overflow: hidden; color: #99938a; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.unit-card strong { margin-top: 8px; font: 700 13px/1 "Manrope",sans-serif; }.unit-card small { margin-top: auto; color: #777168; font-size: 7.5px; }
.filter-bar { min-height: 64px; margin-bottom: 12px; padding: 11px 13px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.search-control { width: min(380px,100%); height: 38px; padding: 0 12px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 9px; background: #faf9f6; }.search-control i { color: #8c877f; }.search-control input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 10px; }.search-control input::placeholder { color: #a39d94; }
.filter-controls,.table-toolbar > div { display: flex; align-items: center; gap: 8px; }
select,input[type="date"],.settings-card input,.settings-card textarea,.settings-card select,.compose-panel input,.compose-panel textarea,.compose-panel select { height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px; outline: none; background: #fff; color: #5f5a52; font-size: 10px; }
textarea { resize: vertical; }.unit-status-summary { margin-bottom: 13px; display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }.unit-status-summary > div { min-height: 61px; padding: 12px 15px; display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 11px; background: #fff; }.unit-status-summary span { color: #817c74; font-size: 9px; }.unit-status-summary span i { width: 6px; height: 6px; margin-right: 6px; display: inline-block; border-radius: 50%; }.unit-status-summary strong { font: 700 17px/1 "Manrope",sans-serif; }

.mini-kpis { margin-bottom: 13px; display: grid; grid-template-columns: repeat(4,1fr); gap: 11px; }.mini-kpis article { min-height: 92px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow-sm); }.mini-kpis span,.mini-kpis strong,.mini-kpis small { display: block; }.mini-kpis span { color: var(--muted); font-size: 9px; }.mini-kpis strong { margin-top: 7px; font: 700 18px/1 "Manrope",sans-serif; }.mini-kpis small { margin-top: 8px; color: #98928a; font-size: 8px; }
.positive-text { color: var(--green) !important; }.negative-text { color: var(--red) !important; }
.data-panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.table-toolbar { min-height: 64px; padding: 11px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line-soft); }.table-toolbar h2 { margin: 0; font: 700 14px/1.2 "Manrope",sans-serif; }.table-toolbar p { margin: 4px 0 0; color: var(--muted); font-size: 8.5px; }
.table-wrap { width: 100%; overflow-x: auto; }.data-table { width: 100%; border-collapse: collapse; white-space: nowrap; }.data-table th { height: 38px; padding: 0 13px; color: #8f8980; background: #faf9f6; border-bottom: 1px solid var(--line); font-size: 7.5px; font-weight: 700; letter-spacing: .08em; text-align: left; text-transform: uppercase; }.data-table td { height: 58px; padding: 8px 13px; border-bottom: 1px solid var(--line-soft); color: #625e57; font-size: 9px; }.data-table tbody tr:last-child td { border-bottom: 0; }.data-table tbody tr:hover { background: #fcfbf8; }.data-table td > strong,.data-table td > small { display: block; }.data-table td > strong { color: #312f2a; font-size: 9.5px; }.data-table td > small { margin-top: 3px; color: #9b958c; font-size: 7.5px; }
.empty-state { min-height: 120px; padding: 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #938d84; text-align: center; white-space: normal; }.empty-state i { margin-bottom: 8px; color: #a78138; font-size: 25px; }.empty-state strong,.empty-state span { display: block; }.empty-state strong { color: #37332d; font-size: 10px; }.empty-state span { max-width: 360px; margin-top: 5px; font-size: 8px; line-height: 1.5; }.compact-list .empty-state { min-height: 150px; grid-template-columns: 1fr; }
.person-cell { display: flex; align-items: center; gap: 9px; }.person-cell strong,.person-cell small { display: block; }.person-cell small { margin-top: 2px; color: #99938a; font-size: 7.5px; }.avatar-soft { background: #eee7d8; color: #80672f; }
.badge { min-height: 21px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center; border-radius: 20px; font-size: 7.5px; font-weight: 700; }.badge.green { color: var(--green); background: var(--green-soft); }.badge.amber { color: var(--amber); background: var(--amber-soft); }.badge.red { color: var(--red); background: var(--red-soft); }.badge.blue { color: var(--blue); background: var(--blue-soft); }
.row-action { width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 8px; display: grid; place-items: center; background: #fff; cursor: pointer; }.row-action:hover { border-color: #c5b98f; background: #fbf7ed; }.row-action i { font-size: 15px; }
.table-footer { min-height: 52px; padding: 8px 14px; display: flex; align-items: center; justify-content: space-between; color: #918b82; border-top: 1px solid var(--line-soft); font-size: 8.5px; }.table-footer > div { display: flex; gap: 4px; }.table-footer > div button { width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 8px; }.table-footer > div button.active { background: var(--ink); color: #fff; border-color: var(--ink); }

.application-summary,.maintenance-summary { margin-bottom: 13px; display: grid; grid-template-columns: repeat(4,1fr); gap: 11px; }.application-summary > div,.maintenance-summary > div { min-height: 72px; padding: 13px 15px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.summary-icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 9px; }.summary-icon.amber { color: var(--amber); background: var(--amber-soft); }.summary-icon.green { color: var(--green); background: var(--green-soft); }.summary-icon.red { color: var(--red); background: var(--red-soft); }.summary-icon.blue { color: var(--blue); background: var(--blue-soft); }.summary-icon i { font-size: 16px; }.application-summary p,.maintenance-summary p { margin: 0; }.application-summary strong,.application-summary span,.maintenance-summary strong,.maintenance-summary span { display: block; }.application-summary strong,.maintenance-summary strong { font: 700 12px/1.2 "Manrope",sans-serif; }.application-summary p span,.maintenance-summary p span { margin-top: 3px; color: #928c84; font-size: 8px; }
.application-layout { display: grid; grid-template-columns: minmax(0,1fr) 285px; gap: 13px; }.application-list { padding: 0 13px; }.application-row { width: 100%; min-height: 73px; padding: 10px 4px; border: 0; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: 36px 1.2fr 1fr auto 22px; align-items: center; gap: 11px; background: #fff; text-align: left; cursor: pointer; }.application-row:last-child { border-bottom: 0; }.application-row:hover { background: #fcfbf8; }.application-row > div strong,.application-row > div span { display: block; }.application-row > div strong { font-size: 9.5px; }.application-row > div span { margin-top: 3px; color: #928c84; font-size: 7.8px; }.application-row > i { color: #99938a; }.review-guide { padding: 28px 24px; border: 1px solid #e2d5b7; border-radius: var(--radius); background: linear-gradient(145deg,#f8f1e3,#fff); }.review-illustration { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 17px; background: #e7d5ad; color: #85682d; }.review-illustration i { font-size: 27px; }.review-guide h3 { margin: 20px 0 8px; font: 700 16px/1.2 "Manrope",sans-serif; }.review-guide p { margin: 0; color: #7d766b; font-size: 10px; line-height: 1.6; }.review-guide ul { margin: 20px 0 0; padding: 0; list-style: none; }.review-guide li { margin: 10px 0; display: flex; align-items: center; gap: 8px; color: #615c54; font-size: 9px; }.review-guide li i { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); }

.split-panels { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }.compact-list { padding: 3px 17px; }.compact-list > div { min-height: 75px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; border-bottom: 1px solid var(--line-soft); }.compact-list > div:last-child { border-bottom: 0; }.date-block { width: 40px; height: 44px; display: grid; place-content: center; border-radius: 9px; color: #fff; background: var(--ink); text-align: center; }.date-block strong,.date-block small { display: block; }.date-block strong { font: 700 13px/1 "Manrope",sans-serif; }.date-block small { margin-top: 3px; color: #cdb983; font-size: 6px; }.compact-list p { margin: 0; }.compact-list p strong,.compact-list p span { display: block; }.compact-list p strong { font-size: 9.5px; }.compact-list p span { margin-top: 3px; color: #938d84; font-size: 8px; }
.action-grid { padding: 15px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.action-grid button { min-height: 98px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; display: flex; flex-direction: column; align-items: flex-start; background: #faf9f6; cursor: pointer; }.action-grid button:hover { border-color: #d8c498; background: #fffaf0; }.action-grid button > i { color: var(--gold); font-size: 19px; }.action-grid strong,.action-grid span { display: block; }.action-grid strong { margin-top: 12px; font-size: 9.5px; }.action-grid span { margin-top: 4px; color: #948e85; font-size: 7.5px; }

.payment-hero { margin-bottom: 13px; padding: 18px 21px; display: grid; grid-template-columns: 2fr repeat(3,1fr); gap: 20px; border-radius: var(--radius); color: #fff; background: #191815; box-shadow: var(--shadow-md); }.payment-hero > div { padding-left: 20px; border-left: 1px solid rgba(255,255,255,.1); }.payment-hero > div:first-child { padding-left: 0; border-left: 0; }.payment-hero span,.payment-hero strong,.payment-hero small { display: block; }.payment-hero span { color: #a8a39a; font-size: 8.5px; }.payment-hero strong { margin-top: 7px; font: 700 19px/1 "Manrope",sans-serif; }.payment-hero small { margin-top: 7px; color: #858178; font-size: 7.5px; }.payment-hero > div:first-child strong { font-size: 24px; color: #ead5a4; }
.payment-layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 13px; }.channel { display: flex; align-items: center; gap: 5px; }.channel i { color: #8a713b; }.reconcile-card { padding: 17px; border: 1px solid #e0d2b3; border-radius: var(--radius); background: linear-gradient(150deg,#fffaf0,#fff); box-shadow: var(--shadow-sm); }.reconcile-head { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; }.reconcile-head h3,.reconcile-head small { margin: 0; display: block; }.reconcile-head small { color: #978f83; font-size: 7px; text-transform: uppercase; letter-spacing: .1em; }.reconcile-head h3 { margin-top: 2px; font: 700 12px/1.2 "Manrope",sans-serif; }.bank-transaction { margin: 16px 0 11px; padding: 15px; border-radius: 10px; color: #fff; background: #1b1a18; }.bank-transaction > span { color: #9c968b; font-size: 7px; letter-spacing: .12em; }.bank-transaction > strong { margin-top: 7px; display: block; color: #f0d8a3; font: 700 20px/1 "Manrope",sans-serif; }.bank-transaction dl { margin: 14px 0 0; }.bank-transaction dl div { margin-top: 6px; display: flex; justify-content: space-between; }.bank-transaction dt { color: #8d887f; font-size: 7.5px; }.bank-transaction dd { margin: 0; font-size: 7.5px; }.suggested-match { margin-bottom: 11px; padding: 12px; border: 1px dashed #c8ae76; border-radius: 9px; }.suggested-match span,.suggested-match strong,.suggested-match small { display: block; }.suggested-match span { color: #8e712f; font-size: 7.5px; font-weight: 700; }.suggested-match strong { margin-top: 8px; font-size: 9.5px; }.suggested-match small { margin-top: 4px; color: #8b857d; font-size: 7.5px; }.full-width { width: 100%; margin-top: 7px; }

.kanban-board { display: grid; grid-template-columns: repeat(4,minmax(220px,1fr)); gap: 12px; overflow-x: auto; }.kanban-column { min-width: 220px; min-height: 480px; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius); background: #efede8; }.kanban-column > header { height: 36px; padding: 0 5px 7px; display: flex; align-items: center; justify-content: space-between; color: #56524c; font-size: 9px; font-weight: 700; }.kanban-column > header span { display: flex; align-items: center; gap: 7px; }.kanban-column > header b { min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 7px; background: #ded9cf; font-size: 8px; }.ticket-card { width: 100%; min-height: 145px; margin-bottom: 8px; padding: 13px; border: 1px solid #e3ded5; border-radius: 11px; display: block; background: #fff; text-align: left; cursor: pointer; box-shadow: 0 2px 8px rgba(20,17,12,.04); }.ticket-card:hover { border-color: #ccb77f; transform: translateY(-1px); }.ticket-card h3 { margin: 11px 0 5px; font: 700 11px/1.3 "Manrope",sans-serif; }.ticket-card > p { margin: 0; color: #918b83; font-size: 8px; }.ticket-card > div { margin-top: 15px; display: flex; align-items: center; gap: 7px; color: #99938b; }.ticket-card > div small { font-size: 7px; }.ticket-card > div i { margin-left: auto; }.mini-avatar { width: 22px; height: 22px; flex-basis: 22px; font-size: 7px; }.vendor-line { margin-top: 10px; display: flex; align-items: center; gap: 5px; color: #6e6961; font-size: 7.5px; }

.communications-layout { display: grid; grid-template-columns: 360px minmax(0,1fr); gap: 13px; }.compose-panel { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }.compose-panel > header { padding: 16px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }.compose-panel header h2,.compose-panel header small { margin: 0; display: block; }.compose-panel header h2 { margin-top: 3px; font: 700 14px/1.2 "Manrope",sans-serif; }.compose-panel header small { color: #998f7d; font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }.compose-panel form { padding: 16px; }.compose-panel form > label { margin-bottom: 12px; display: block; color: #6f6a62; font-size: 8px; font-weight: 700; }.compose-panel form > label input,.compose-panel form > label select,.compose-panel form > label textarea { width: 100%; margin-top: 6px; }.compose-panel textarea { height: auto; padding: 10px; line-height: 1.5; }.channel-picker { margin-bottom: 12px; }.channel-picker > span { display: block; margin-bottom: 7px; color: #6f6a62; font-size: 8px; font-weight: 700; }.channel-picker label { min-height: 30px; margin: 0 3px 4px 0; padding: 0 8px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 8px; color: #6d675f; font-size: 7.5px; }.channel-picker input { accent-color: var(--gold); }.character-count { margin-top: -4px; display: flex; justify-content: space-between; color: #9b958c; font-size: 7px; }.message-history { min-width: 0; }.tabs { height: 49px; margin-bottom: 10px; padding: 5px; display: flex; gap: 4px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }.tabs button { padding: 0 13px; border: 0; border-radius: 8px; background: transparent; color: #79746c; font-size: 8.5px; font-weight: 700; }.tabs button.active { background: var(--ink); color: #fff; }.tabs button span { margin-left: 4px; color: #b99b5e; }.message-card { min-height: 115px; margin-bottom: 9px; padding: 15px; display: grid; grid-template-columns: 34px 1fr 30px; gap: 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow-sm); }.message-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--amber-soft); color: var(--amber); }.message-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.message-card h3 { margin: 2px 0; font: 700 11px/1.2 "Manrope",sans-serif; }.message-card p { margin: 8px 0; color: #746f67; font-size: 8.5px; line-height: 1.45; }.message-card footer { display: flex; flex-wrap: wrap; gap: 12px; color: #9a948b; font-size: 7px; }.message-card footer span { display: flex; align-items: center; gap: 4px; }
.conversation-heading { margin:24px 2px 10px; }.conversation-heading h2 { margin:3px 0 0;font:700 16px "Manrope",sans-serif; }.conversation-card { margin-bottom:12px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden; }.conversation-card > header { padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line-soft); }.conversation-card > header strong,.conversation-card > header span { display:block; }.conversation-card > header strong { font:700 11px "Manrope",sans-serif; }.conversation-card > header div > span { margin-top:4px;color:#8e887e;font-size:7px; }.conversation-thread { padding:16px;display:grid;gap:9px; }.conversation-bubble { max-width:82%;padding:10px 12px;border-radius:12px;background:#f4f1eb; }.conversation-bubble.staff-bubble { justify-self:start;border-bottom-left-radius:4px; }.conversation-bubble.resident-bubble { justify-self:end;border-bottom-right-radius:4px;background:#fcf3df; }.conversation-bubble strong { display:block;font-size:8px; }.conversation-bubble p { margin:4px 0;color:#5d5850;font-size:8.5px;line-height:1.55;white-space:pre-line; }.conversation-bubble small { color:#9b958d;font-size:6.5px; }.conversation-reply { padding:12px 16px;display:flex;gap:8px;border-top:1px solid var(--line-soft); }.conversation-reply textarea { min-width:0;flex:1;padding:9px;border:1px solid var(--line);border-radius:9px;resize:vertical;font-size:8px; }.conversation-starter { margin-top:12px;padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:11px;border:1px solid var(--line);border-radius:14px;background:#fff; }.conversation-starter h3 { grid-column:1/-1;margin:0;font:700 13px "Manrope",sans-serif; }.conversation-starter label { color:#6f6a62;font-size:8px;font-weight:700; }.conversation-starter input,.conversation-starter select,.conversation-starter textarea { width:100%;margin-top:6px; }.conversation-starter label:last-of-type,.conversation-starter button { grid-column:1/-1; }

.report-controls { min-height: 64px; margin-bottom: 13px; padding: 11px 14px; display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.report-controls > div { display: flex; align-items: center; gap: 8px; }.report-controls label { color: #8d877f; font-size: 7.5px; }.report-controls label input { margin-left: 6px; }.report-controls > div > span { color: #aaa49b; font-size: 8px; }.report-card-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 11px; }.report-card { min-height: 112px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; display: grid; grid-template-columns: 36px 1fr 20px; gap: 11px; align-items: flex-start; background: #fff; text-align: left; cursor: pointer; box-shadow: var(--shadow-sm); }.report-card:hover { border-color: #d2bd8d; transform: translateY(-2px); box-shadow: var(--shadow-md); }.report-card > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #f2ead9; color: #876b2e; }.report-card h3 { margin: 2px 0 6px; font: 700 10px/1.2 "Manrope",sans-serif; }.report-card p { margin: 0; color: #918b82; font-size: 7.5px; line-height: 1.45; }.report-card > i { color: #aaa39a; }.report-preview { grid-template-columns: 1.4fr .8fr; }.horizontal-chart { padding: 22px 20px; }.horizontal-chart > div { margin-bottom: 19px; display: grid; grid-template-columns: 78px 1fr 36px; align-items: center; gap: 10px; }.horizontal-chart span,.horizontal-chart strong { font-size: 8.5px; }.horizontal-chart > div > div { height: 8px; overflow: hidden; border-radius: 10px; background: #eeeae3; }.horizontal-chart i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#80662f,#d3ad5b); }.aging-donut { padding: 20px; display: flex; align-items: center; justify-content: center; gap: 23px; }.small-donut { width: 105px; height: 105px; padding: 13px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#b78a34 0 55%,#755f31 55% 84%,#b84945 84% 100%); }.small-donut span { width: 100%; height: 100%; display: grid; place-content: center; border-radius: 50%; background: #fff; color: #938c82; font-size: 7px; text-align: center; }.small-donut strong { color: var(--ink); font-size: 12px; }.aging-donut ul { margin: 0; padding: 0; list-style: none; }.aging-donut li { margin: 10px 0; display: grid; grid-template-columns: 7px 60px auto; gap: 6px; color: #837d74; font-size: 7.5px; }.aging-donut li i { width: 6px; height: 6px; margin-top: 2px; border-radius: 50%; }.aging-donut li strong { color: var(--ink); }
.report-kpi-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:13px; }.report-kpi-grid article { min-height:88px;padding:14px;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow-sm); }.report-kpi-grid p,.report-kpi-grid p small { display:block;margin:0; }.report-kpi-grid p { color:#37342f;font-size:8.5px;font-weight:700; }.report-kpi-grid p small { margin-top:5px;color:#948e84;font-size:7px;font-weight:500; }.report-kpi-grid article > strong { font:700 14px/1 "Manrope",sans-serif;white-space:nowrap; }.report-library-heading { margin-top:20px; }.report-library-heading p { margin:5px 0 0;color:#8f8980;font-size:8px; }.report-generation-form { margin-bottom:14px; }.report-format-row { min-height:58px;margin-bottom:11px;padding:10px 13px;display:flex;align-items:center;justify-content:space-between;border:1px solid #dacba9;border-radius:12px;background:linear-gradient(120deg,#fbf7ec,#fff); }.report-format-row strong,.report-format-row span { display:block; }.report-format-row strong { font-size:9px; }.report-format-row span { margin-top:4px;color:#8d8477;font-size:7.5px; }.report-format-row select { min-width:165px; }.report-card { transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease; }.report-card:focus-visible { outline:2px solid var(--gold);outline-offset:2px; }.report-runs-panel { margin-top:16px; }.report-runs-panel td small { margin-top:4px; }.muted-action { color:#b6afa4;background:#f1eee8;cursor:default; }
@media (max-width:1100px) { .report-kpi-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px) { .report-kpi-grid { grid-template-columns:1fr; }.report-format-row { align-items:stretch;flex-direction:column;gap:10px; }.report-format-row select { width:100%; }.report-kpi-grid article > strong { font-size:13px; }.report-preview { grid-template-columns:1fr; } }

.document-overview { min-height: 76px; margin-bottom: 12px; padding: 14px 18px; display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.document-overview p { margin: 0; }.document-overview strong,.document-overview p span { display: block; }.document-overview strong { font-size: 11px; }.document-overview p span { margin-top: 3px; color: #918b82; font-size: 8px; }.storage-meter { width: 220px; margin-left: auto; }.storage-meter > span { display: block; margin-bottom: 7px; color: #837d75; font-size: 8px; }.storage-meter > div { height: 5px; overflow: hidden; border-radius: 6px; background: #eee9e0; }.storage-meter i { height: 100%; display: block; background: var(--gold); }.document-name { display: flex; align-items: center; gap: 9px; }.document-name span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: var(--red); background: var(--red-soft); }.row-actions { display: flex; gap: 5px; }.row-actions button { width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 8px; display: grid; place-items: center; background: #fff; cursor: pointer; }.row-actions button:hover { background: #f8f4eb; }
.audit-banner { min-height: 70px; margin-bottom: 12px; padding: 14px 18px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 11px; border: 1px solid #cadfd4; border-radius: 12px; color: var(--green); background: var(--green-soft); }.audit-banner > i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: var(--green); }.audit-banner strong,.audit-banner div span { display: block; }.audit-banner strong { font-size: 10px; }.audit-banner div span,.audit-banner > span { margin-top: 3px; color: #658a79; font-size: 8px; }.data-table code { color: #716b62; background: #f0ede7; padding: 3px 6px; border-radius: 5px; font: 7.5px/1 monospace; }

.settings-layout { display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 13px; }.settings-nav { align-self: start; padding: 7px; display: grid; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.settings-nav button { height: 42px; padding: 0 11px; border: 0; border-radius: 8px; display: flex; align-items: center; gap: 10px; background: transparent; color: #777169; font-size: 9px; font-weight: 600; text-align: left; }.settings-nav button i { font-size: 15px; }.settings-nav button.active { color: #fff; background: var(--ink); }.settings-content { display: grid; gap: 12px; }.settings-card { border: 1px solid var(--line); border-radius: 12px; background: #fff; }.settings-card > header { padding: 16px 18px; border-bottom: 1px solid var(--line-soft); }.settings-card h2 { margin: 0; font: 700 13px/1.2 "Manrope",sans-serif; }.settings-card p { margin: 5px 0 0; color: #918b82; font-size: 8px; }.form-grid { padding: 17px; display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }.form-grid label { color: #6f6961; font-size: 8px; font-weight: 700; }.form-grid input,.form-grid select,.form-grid textarea { width: 100%; margin-top: 6px; }.form-grid textarea { height: auto; padding: 10px; }.full-field { grid-column: 1/-1; }.integration-row { min-height: 69px; margin: 0 17px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }.integration-row:last-child { border-bottom: 0; }.integration-row strong,.integration-row div span { display: block; }.integration-row strong { font-size: 9.5px; }.integration-row div span { margin-top: 3px; color: #918b82; font-size: 8px; }

/* Modal content */
.demo-modal-head { padding: 23px 24px 17px; border-bottom: 1px solid var(--line-soft); }.demo-modal-head .eyebrow { margin-bottom: 7px; }.demo-modal-head h2 { margin: 0; padding-right: 32px; font: 700 20px/1.2 "Manrope",sans-serif; }.demo-modal-head p { margin: 6px 0 0; color: var(--muted); font-size: 9px; }.demo-modal-body { padding: 20px 24px; }.modal-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.modal-summary > div { padding: 11px; border-radius: 9px; background: #f6f3ed; }.modal-summary span,.modal-summary strong { display: block; }.modal-summary span { color: #918b82; font-size: 7px; }.modal-summary strong { margin-top: 4px; font-size: 9.5px; }.detail-grid { margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.detail-field { padding-bottom: 10px; border-bottom: 1px solid var(--line-soft); }.detail-field span,.detail-field strong { display: block; }.detail-field span { color: #969087; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }.detail-field strong { margin-top: 5px; font-size: 9.5px; }.document-row { margin-top: 12px; padding: 10px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 9px; }.document-row i { color: var(--red); font-size: 17px; }.document-row div { flex: 1; }.document-row strong,.document-row span { display: block; }.document-row strong { font-size: 9px; }.document-row span { margin-top: 2px; color: #928c84; font-size: 7px; }.modal-actions { padding: 15px 24px; display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--line-soft); background: #faf9f6; }.button-danger { color: var(--red); border-color: #e2bab7; background: #fff; }.invoice-preview { padding: 28px; color: #eee9de; background: #151513; }.invoice-preview-head { display: flex; justify-content: space-between; align-items: flex-start; }.invoice-preview .brand strong { color: #fff; }.invoice-preview h2 { margin: 2px 0 0; color: #d0aa57; font: 700 22px/1 "Manrope",sans-serif; }.invoice-preview small { color: #8e8980; font-size: 7.5px; }.invoice-addresses { margin: 25px 0; display: grid; grid-template-columns: 1fr 1fr; }.invoice-addresses strong,.invoice-addresses span { display: block; }.invoice-addresses strong { margin: 5px 0; font-size: 10px; }.invoice-addresses span { color: #9d978d; font-size: 8px; }.invoice-lines { width: 100%; border-collapse: collapse; }.invoice-lines th,.invoice-lines td { padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 8px; text-align: left; }.invoice-lines th { color: #a69f93; font-weight: 500; }.invoice-lines th:last-child,.invoice-lines td:last-child { text-align: right; }.invoice-total { margin-top: 14px; display: flex; justify-content: flex-end; gap: 25px; color: #d4ad5c; font-size: 11px; font-weight: 700; }.timeline { margin-top: 18px; }.timeline-step { position: relative; min-height: 50px; padding-left: 28px; }.timeline-step::before { content:""; position:absolute; left:8px; top:13px; bottom:-8px; width:1px; background:#ddd6cb; }.timeline-step:last-child::before { display:none; }.timeline-step > i { position:absolute; left:0; top:1px; width:17px; height:17px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--green); font-size:9px; }.timeline-step.pending > i { background:#bdb6aa; }.timeline-step strong,.timeline-step span { display:block; }.timeline-step strong { font-size:9px; }.timeline-step span { margin-top:3px; color:#918b82; font-size:7.5px; }.reject-form { margin-top: 14px; }.reject-form label { color:#6d675f;font-size:8px;font-weight:700; }.reject-form textarea { width:100%; min-height:90px; margin-top:6px; padding:10px; border:1px solid var(--line); border-radius:9px; outline:0; }

@media (max-width: 1280px) {
    .compact-unit-grid { grid-template-columns: repeat(9,minmax(0,1fr)); }.full-unit-grid { grid-template-columns: repeat(8,minmax(0,1fr)); }
    .report-card-grid { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 1024px) {
    .portfolio-grid-large { grid-template-columns: 1fr 1fr; }.compact-unit-grid { grid-template-columns: repeat(7,minmax(0,1fr)); }.full-unit-grid { grid-template-columns: repeat(7,minmax(0,1fr)); }
    .application-layout,.payment-layout { grid-template-columns: 1fr; }.review-guide { display:none; }.reconcile-card { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.reconcile-head { grid-column:1/-1; }.bank-transaction,.suggested-match { margin:0; }.reconcile-card .button { align-self:end; }
    .communications-layout { grid-template-columns: 320px minmax(0,1fr); }.report-card-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 768px) {
    .summary-strip { padding:12px; grid-template-columns:repeat(2,1fr); gap:10px; }.summary-strip > div { padding:8px 10px; border:0; background:#f7f5f0; border-radius:8px; }.summary-strip > div:last-child { grid-column:1/-1; }
    .portfolio-grid-large { grid-template-columns: 1fr; }.compact-unit-grid,.full-unit-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }.unit-card { height:80px; }
    .filter-bar { align-items:stretch; flex-direction:column; }.search-control { width:100%; }.filter-controls { display:grid; grid-template-columns:1fr 1fr auto; }
    .unit-status-summary,.mini-kpis,.application-summary,.maintenance-summary { grid-template-columns:repeat(2,1fr); }
    .table-toolbar { align-items:stretch; flex-direction:column; }.table-toolbar > div { flex-wrap:wrap; }.table-wrap { border-top:1px solid var(--line-soft); }
    .split-panels,.report-preview { grid-template-columns:1fr; }.payment-hero { grid-template-columns:1fr 1fr; }.payment-hero > div:nth-child(3) { padding-left:0; border-left:0; }
    .kanban-board { padding-bottom:5px; }.communications-layout { grid-template-columns:1fr; }.compose-panel { order:2; }.report-controls { align-items:stretch; flex-direction:column; gap:10px; }.report-controls > div { justify-content:space-between; }.report-card-grid { grid-template-columns:1fr 1fr; }
    .settings-layout { grid-template-columns:1fr; }.settings-nav { grid-template-columns:repeat(3,1fr); }.settings-nav button { justify-content:center; }.settings-nav button i { display:none; }
}
@media (max-width: 480px) {
    .inner-heading { margin-bottom:15px; }.compact-unit-grid,.full-unit-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.legend-inline { display:none; }
    .unit-status-summary { grid-template-columns:1fr 1fr; }.mini-kpis article { min-height:84px; padding:13px; }.mini-kpis strong { font-size:15px; }
    .application-row { grid-template-columns:34px 1fr auto; }.application-row > div:nth-of-type(2),.application-row > i { display:none; }.application-summary,.maintenance-summary { grid-template-columns:1fr 1fr; }.application-summary > div,.maintenance-summary > div { min-height:65px;padding:10px; }
    .payment-hero { padding:15px; gap:14px; }.payment-hero > div { padding-left:12px; }.payment-hero strong { font-size:15px; }.payment-hero > div:first-child strong { font-size:18px; }
    .reconcile-card { display:block; }.reconcile-card > * { margin-bottom:10px; }.report-card-grid { grid-template-columns:1fr; }.report-controls > div:first-child label input { width:130px; }.report-controls > div:last-child { display:grid; grid-template-columns:1fr auto; }
    .document-overview { flex-wrap:wrap; }.storage-meter { width:100%; margin-left:46px; }.audit-banner { grid-template-columns:32px 1fr; }.audit-banner > span { display:none; }.settings-nav { grid-template-columns:1fr 1fr; }.form-grid { grid-template-columns:1fr; }.full-field { grid-column:auto; }
    .modal-summary { grid-template-columns:1fr 1fr; }.detail-grid { grid-template-columns:1fr; }.modal-actions { display:grid; grid-template-columns:1fr 1fr; }.modal-actions .button { width:100%; }.invoice-preview { padding:22px 18px; }
}

/* Login experience */
.login-page { min-height: 100vh; padding-top: 28px; background: #11110f; }
.login-layout { min-height: calc(100vh - 28px); display: grid; grid-template-columns: 1.08fr .92fr; }
.login-visual { position: relative; min-height: 650px; padding: 46px 54px; display: flex; flex-direction: column; background-size: cover; background-position: center; color: #fff; }
.login-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(183,138,52,.11),transparent 40%); pointer-events:none; }
.login-brand { position:relative; z-index:1; display:flex; align-items:center; gap:12px; }.login-brand .brand-mark { width:43px;height:43px; }.login-brand strong,.login-brand small { display:block; }.login-brand strong { font:700 13px/1.2 "Manrope",sans-serif; letter-spacing:.12em; }.login-brand small { margin-top:5px; color:rgba(255,255,255,.55); font-size:9px; }
.login-story { position:relative; z-index:1; width:min(570px,100%); margin:auto 0; }.login-story h1 { margin:12px 0 16px; font:700 clamp(38px,4vw,60px)/1.05 "Manrope",sans-serif; letter-spacing:-.055em; }.login-story > p { width:min(430px,100%); margin:0; color:rgba(255,255,255,.67); font-size:14px; line-height:1.6; }.login-proof { margin-top:45px; display:flex; gap:42px; }.login-proof > span { padding-left:14px; border-left:1px solid rgba(212,173,92,.48); }.login-proof strong,.login-proof small { display:block; }.login-proof strong { color:#e3c47f; font:700 19px/1 "Manrope",sans-serif; }.login-proof small { margin-top:6px; color:rgba(255,255,255,.48); font-size:8px; }.login-visual footer { position:relative; z-index:1; color:rgba(255,255,255,.45); font-size:8px; letter-spacing:.08em; text-transform:uppercase; }
.login-form-side { padding:42px; display:grid; place-items:center; background:#f6f3ed; }.login-form-card { width:min(420px,100%); padding:36px; border:1px solid #e3ded5; border-radius:18px; background:#fff; box-shadow:0 20px 60px rgba(26,21,14,.12); }.login-form-card h2 { margin:0; font:700 25px/1.15 "Manrope",sans-serif; letter-spacing:-.04em; }.login-subtitle { margin:8px 0 24px; color:#857f76; font-size:10px; }.login-form-card form > label { margin-bottom:14px; display:block; color:#625d55; font-size:8.5px; font-weight:700; }.phone-input,.password-input,.money-input { height:42px; margin-top:7px; display:flex; align-items:center; border:1px solid var(--line); border-radius:9px; background:#faf9f6; overflow:hidden; }.phone-input > span,.money-input > span { height:100%; padding:0 12px; display:flex; align-items:center; border-right:1px solid var(--line); color:#736e66; font-size:9px; font-weight:700; }.phone-input input,.password-input input,.money-input input { width:100%; height:100%; padding:0 12px; border:0; outline:0; background:transparent; font-size:10px; }.password-input button { width:39px;height:100%;border:0;background:transparent;color:#857f76;cursor:pointer; }.login-options { margin:-2px 0 18px; display:flex; align-items:center; justify-content:space-between; color:#8b857c; font-size:8px; }.login-options label { display:flex;align-items:center;gap:5px; }.login-options input { accent-color:var(--gold); }.login-options button { border:0;background:transparent;color:#8b6b2e;font-size:8px;cursor:pointer; }.demo-divider { margin:22px 0 14px; display:flex;align-items:center;gap:10px;color:#9a948b;font-size:7.5px;text-transform:uppercase;letter-spacing:.09em; }.demo-divider::before,.demo-divider::after { content:"";height:1px;flex:1;background:var(--line); }.demo-roles { display:grid;gap:7px; }.demo-roles a { min-height:62px;padding:10px 11px;display:grid;grid-template-columns:34px 1fr 18px;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;transition:.18s ease; }.demo-roles a:hover { border-color:#cdb77f;background:#fffaf0;transform:translateX(2px); }.demo-role-icon { width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#f0e6d2;color:#86682b; }.demo-roles strong,.demo-roles small { display:block; }.demo-roles strong { font-size:9px; }.demo-roles small { margin-top:3px;color:#938d84;font-size:7.5px; }.demo-roles > a > i { color:#aaa39a; }.login-security { margin:17px 0 0;display:flex;align-items:center;justify-content:center;gap:5px;color:#a09a91;font-size:7.5px; }.mobile-login-brand { display:none; }

/* Tenant portal */
.tenant-app { background:#f3f0e9; }.tenant-sidebar { position:fixed;inset:28px auto 0 0;width:230px;z-index:60;display:flex;flex-direction:column;color:#d9d5cd;background:#171613; }.tenant-sidebar .brand { height:84px; }.tenant-profile { margin:18px 14px 10px;padding:13px;display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.03); }.tenant-profile strong,.tenant-profile span { display:block; }.tenant-profile strong { color:#f3efe6;font-size:10px; }.tenant-profile span { margin-top:3px;color:#77736c;font-size:8px; }.tenant-sidebar nav { flex:1;padding:8px 14px; }.tenant-sidebar nav a { min-height:43px;margin:3px 0;padding:0 12px;display:flex;align-items:center;gap:11px;border-radius:8px;color:#99958e;font-size:10px;font-weight:600; }.tenant-sidebar nav a i { width:19px;color:#7f7b74;font-size:16px; }.tenant-sidebar nav a small { margin-left:auto;min-width:19px;height:19px;display:grid;place-items:center;border-radius:7px;background:#302b22;color:#d3aa57;font-size:7px; }.tenant-sidebar nav a.active { color:#fff;background:rgba(183,138,52,.16);box-shadow:inset 2px 0 0 var(--gold); }.tenant-sidebar nav a.active i { color:#d2aa57; }.tenant-sidebar-footer { padding:14px;border-top:1px solid rgba(255,255,255,.07); }.tenant-sidebar-footer a,.tenant-sidebar-footer button { width:100%;min-height:36px;padding:0 8px;border:0;display:flex;align-items:center;gap:8px;color:#89857e;background:transparent;font-size:8px;cursor:pointer; }.tenant-sidebar-footer a:hover,.tenant-sidebar-footer button:hover { color:#e8dfcc; }.tenant-shell { min-height:100vh;margin-left:230px;padding-top:28px; }.tenant-topbar { position:sticky;top:28px;z-index:40;height:65px;padding:0 28px;display:flex;align-items:center;justify-content:flex-end;background:rgba(255,255,255,.93);border-bottom:1px solid var(--line);backdrop-filter:blur(12px); }.tenant-topbar > div { display:flex;align-items:center;gap:9px; }.tenant-mobile-brand { display:none; }.tenant-content { width:min(1180px,100%);margin:0 auto;padding:28px; }.tenant-bottom-nav { display:none; }
.tenant-greeting { margin-bottom:20px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px; }.tenant-greeting h1 { margin:0;font:700 clamp(25px,3vw,34px)/1.15 "Manrope",sans-serif;letter-spacing:-.04em; }.tenant-greeting > div > p:last-child { margin:7px 0 0;color:#817b72;font-size:10px; }.tenant-balance-card { min-height:238px;padding:29px;display:grid;grid-template-columns:1.45fr 1fr;border-radius:18px;color:#fff;background:radial-gradient(circle at 80% 15%,rgba(195,151,62,.18),transparent 28%),linear-gradient(130deg,#151513,#28251f);box-shadow:0 18px 45px rgba(29,23,15,.18); }.balance-main { padding-right:35px;border-right:1px solid rgba(255,255,255,.11); }.balance-main > span { color:#ada79c;font-size:9px; }.balance-main > strong { margin-top:11px;display:block;color:#f2d99f;font:700 38px/1 "Manrope",sans-serif;letter-spacing:-.05em; }.balance-main > strong small { margin-right:7px;color:#a98b4b;font-size:12px; }.balance-main > p { margin:10px 0 24px;color:#958f85;font-size:9px; }.pay-button { min-height:45px;padding:0 18px;border:0;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:18px;color:#181611;background:#d3ab58;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;box-shadow:0 8px 22px rgba(183,138,52,.2); }.pay-button:hover { background:#e1bf77;transform:translateY(-1px); }.balance-side { padding-left:35px;display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:24px; }.balance-side > div span,.balance-side > div strong { display:block; }.balance-side > div span { color:#8e8980;font-size:8px; }.balance-side > div strong { margin-top:6px;color:#ede8df;font-size:10px; }.balance-status { grid-column:1/-1;width:max-content;padding:7px 9px;border-radius:8px;color:#e4c981!important;background:rgba(212,173,92,.12);font-size:8px!important;font-weight:700; }.balance-status i { margin-right:5px; }
.tenant-quick-actions { margin:13px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:11px; }.tenant-quick-actions a { min-height:78px;padding:14px;display:grid;grid-template-columns:36px 1fr;column-gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow-sm); }.tenant-quick-actions a:hover { border-color:#d3bf8f;transform:translateY(-1px); }.tenant-quick-actions a > span { grid-row:1/3;width:36px;height:36px;display:grid;place-items:center;border-radius:10px;color:#866b2f;background:#f0e5ce; }.tenant-quick-actions strong,.tenant-quick-actions small { display:block; }.tenant-quick-actions strong { align-self:end;font-size:9.5px; }.tenant-quick-actions small { align-self:start;margin-top:-2px;color:#938d85;font-size:7.5px; }
.tenant-dashboard-grid { display:grid;grid-template-columns:1.35fr .75fr;gap:12px;margin-top:12px; }.tenant-dashboard-grid.lower-tenant-grid { grid-template-columns:1.15fr .85fr; }.tenant-panel { border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden; }.tenant-panel > header { min-height:64px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft); }.tenant-panel > header h2 { margin:3px 0 0;font:700 13px/1.2 "Manrope",sans-serif; }.tenant-panel > header > a,.tenant-panel > header > button { border:0;background:transparent;color:#8a6b2f;font-size:8px;font-weight:700;cursor:pointer; }.tenant-activity { padding:1px 16px 8px; }.tenant-activity > div { min-height:64px;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;border-bottom:1px solid var(--line-soft); }.tenant-activity > div:last-child { border-bottom:0; }.tenant-activity p { margin:0; }.tenant-activity p strong,.tenant-activity p span { display:block; }.tenant-activity p strong { font-size:9px; }.tenant-activity p span { margin-top:3px;color:#948e85;font-size:7.5px; }.tenant-activity > div > div:last-child { text-align:right; }.tenant-activity > div > div:last-child strong { display:block;font-size:8.5px; }.tenant-activity .badge { margin-top:4px; }.tenant-activity button { border:0;background:transparent;color:#8a6a2e;font-size:8px;font-weight:700;cursor:pointer; }.tenant-notice { min-height:82px;margin:0 16px;padding:13px 0;display:grid;grid-template-columns:43px 1fr;gap:11px;border-bottom:1px solid var(--line-soft); }.tenant-notice:last-child { border-bottom:0; }.tenant-notice > span { width:40px;height:40px;padding:7px;display:grid;place-items:center;border-radius:9px;color:#80786b;background:#f0ede7;font-size:7px;font-weight:800;text-align:center; }.tenant-notice.important > span { color:#8c6826;background:var(--amber-soft); }.tenant-notice strong { font-size:9px; }.tenant-notice p { margin:5px 0 0;color:#8b857c;font-size:7.5px;line-height:1.45; }.tenant-ticket { padding:17px; }.tenant-ticket h3 { margin:10px 0 4px;font:700 12px/1.2 "Manrope",sans-serif; }.tenant-ticket p { margin:0;color:#908a81;font-size:8px; }.mini-timeline { margin-top:21px;display:flex;justify-content:space-between;position:relative; }.mini-timeline::before { content:"";position:absolute;left:5px;right:5px;top:4px;height:2px;background:#ded8ce; }.mini-timeline i { position:relative;z-index:1;width:10px;height:10px;border:2px solid #c9c2b6;border-radius:50%;background:#fff; }.mini-timeline i.done { border-color:var(--green);background:var(--green); }.mini-timeline-labels { margin-top:7px;display:flex;justify-content:space-between;color:#9a948b;font-size:6.5px; }.lease-snapshot > div { min-height:45px;margin:0 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft);font-size:8px; }.lease-snapshot > div span { color:#918b82; }.lease-snapshot > div strong { font-size:8.5px; }.lease-snapshot .button { width:calc(100% - 32px);margin:13px 16px; }

.tenant-page-heading { margin-bottom:18px;display:flex;align-items:flex-end;justify-content:space-between;gap:15px; }.tenant-page-heading h1 { margin:0;font:700 27px/1.15 "Manrope",sans-serif;letter-spacing:-.04em; }.tenant-payment-layout { display:grid;grid-template-columns:380px 1fr;gap:12px; }.pay-now-card { padding:22px;border-radius:15px;color:#fff;background:radial-gradient(circle at 90% 10%,rgba(200,157,67,.19),transparent 32%),#191815;box-shadow:var(--shadow-md); }.pay-now-card h2 { margin:9px 0 4px;color:#eed59d;font:700 30px/1 "Manrope",sans-serif; }.pay-now-card h2 small { margin-right:6px;color:#a98743;font-size:10px; }.pay-now-card > p { margin:0 0 20px;color:#938d84;font-size:8px; }.payment-methods { margin-bottom:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px; }.payment-methods button { min-height:73px;padding:9px 6px;border:1px solid rgba(255,255,255,.1);border-radius:9px;display:flex;flex-direction:column;align-items:flex-start;color:#a6a097;background:rgba(255,255,255,.03);cursor:pointer; }.payment-methods button.active { border-color:#b68b3a;color:#fff;background:rgba(183,138,52,.12); }.payment-methods i { color:#d2aa56;font-size:17px; }.payment-methods strong,.payment-methods span { display:block; }.payment-methods strong { margin-top:7px;font-size:8px; }.payment-methods span { margin-top:3px;color:#817d76;font-size:6.5px; }.pay-now-card form > label { margin-bottom:12px;display:block;color:#aaa49a;font-size:8px; }.pay-now-card .phone-input,.pay-now-card .money-input { border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.05); }.pay-now-card .phone-input input,.pay-now-card .money-input input { color:#fff; }.pay-now-card .phone-input > span,.pay-now-card .money-input > span { border-color:rgba(255,255,255,.12);color:#b5afa4; }.simulation-note { margin:7px 0 14px;padding:9px;display:flex;gap:7px;border-radius:8px;color:#b0a58d;background:rgba(212,173,92,.08);font-size:7px;line-height:1.45; }.payment-history-panel .mobile-table-list { padding:0 16px; }.mobile-table-list > div { min-height:72px;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;border-bottom:1px solid var(--line-soft); }.mobile-table-list > div:last-child { border-bottom:0; }.mobile-table-list p { margin:0; }.mobile-table-list p strong,.mobile-table-list p span,.mobile-table-list > div > div strong,.mobile-table-list > div > div span { display:block; }.mobile-table-list p strong { font-size:9px; }.mobile-table-list p span { margin-top:3px;color:#938d84;font-size:7px; }.mobile-table-list > div > div:last-child { text-align:right; }.mobile-table-list > div > div strong { font-size:8.5px; }.mobile-table-list > div > div span { margin-top:3px;color:#9a948b;font-size:6.5px; }
.maintenance-tenant-layout { display:grid;grid-template-columns:360px 1fr;gap:12px; }.issue-form-panel form { padding:17px; }.issue-form-panel form > label { margin-bottom:13px;display:block;color:#69645c;font-size:8px;font-weight:700; }.issue-form-panel input[type="text"],.issue-form-panel select,.issue-form-panel textarea { width:100%;margin-top:6px; }.issue-form-panel input[type="text"],.issue-form-panel textarea { padding:10px;border:1px solid var(--line);border-radius:9px;outline:0;font-size:9px; }.issue-form-panel textarea { height:auto; }.urgency-picker { margin-top:7px;display:grid;grid-template-columns:repeat(2,1fr);gap:5px; }.urgency-picker input { position:absolute;opacity:0; }.urgency-picker label { min-height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;color:#858078;font-size:8px;cursor:pointer; }.urgency-picker input:checked + label { border-color:#c3a059;color:#765c27;background:#f8eed8; }.upload-zone { min-height:95px!important;margin-top:6px!important;padding:14px!important;border:1px dashed #cfc6b7!important;border-radius:10px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;color:#8b857c!important;background:#faf9f6;cursor:pointer; }.upload-zone input { display:none; }.upload-zone i { color:#a6833b;font-size:20px; }.upload-zone strong { margin-top:6px;font-size:8px; }.upload-zone span { margin-top:3px;color:#aaa49b;font-size:6.5px;font-weight:400; }.maintenance-tenant-layout > div { display:grid;gap:12px; }.current-request-body { padding:17px; }.current-request-body > p { margin:0;color:#746f67;font-size:9px;line-height:1.5; }.vertical-timeline { margin-top:20px; }.vertical-timeline > div { position:relative;min-height:50px;padding-left:29px; }.vertical-timeline > div::before { content:"";position:absolute;left:8px;top:16px;bottom:-4px;width:1px;background:#dcd5ca; }.vertical-timeline > div:last-child::before { display:none; }.vertical-timeline > div > i { position:absolute;left:0;top:0;width:17px;height:17px;border:2px solid #c5beb3;border-radius:50%;background:#fff; }.vertical-timeline > div.done > i { display:grid;place-items:center;border:0;color:#fff;background:var(--green);font-size:9px; }.vertical-timeline p { margin:0; }.vertical-timeline strong,.vertical-timeline span { display:block; }.vertical-timeline strong { font-size:8.5px; }.vertical-timeline span { margin-top:3px;color:#968f86;font-size:7px; }
.lease-hero { min-height:245px;padding:28px;display:grid;grid-template-columns:1fr 270px;gap:35px;border-radius:16px;color:#fff;background:radial-gradient(circle at 80% 15%,rgba(205,166,79,.16),transparent 26%),#191815; }.lease-hero h2 { margin:15px 0 7px;color:#efdba8;font:700 24px/1.1 "Manrope",sans-serif; }.lease-hero p { margin:0;color:#979187;font-size:9px; }.lease-progress { height:6px;margin:34px 0 9px;overflow:hidden;border-radius:8px;background:rgba(255,255,255,.1); }.lease-progress i { height:100%;display:block;background:var(--gold-bright); }.lease-dates { display:flex;justify-content:space-between; }.lease-dates span,.lease-dates strong { display:block; }.lease-dates span { color:#7e7a73;font-size:7px; }.lease-dates strong { margin-top:4px;color:#d4cfc6;font-size:8px; }.lease-hero aside { padding:21px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.04); }.lease-hero aside > span,.lease-hero aside > strong { display:block; }.lease-hero aside > span { margin-top:8px;color:#8e8981;font-size:7.5px; }.lease-hero aside > strong { margin:5px 0 18px;color:#eee8de;font-size:12px; }.lease-hero .button-secondary { border-color:rgba(255,255,255,.14);color:#ddd7cd;background:rgba(255,255,255,.04); }.lease-detail-list { padding:4px 17px 10px; }.lease-detail-list > div { min-height:51px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft);font-size:8.5px; }.lease-detail-list span { color:#918b82; }.lease-actions { padding:8px 16px; }.lease-actions button { width:100%;min-height:66px;padding:10px 0;border:0;border-bottom:1px solid var(--line-soft);display:grid;grid-template-columns:34px 1fr 18px;align-items:center;gap:10px;background:#fff;text-align:left;cursor:pointer; }.lease-actions button:last-child { border-bottom:0; }.lease-actions strong,.lease-actions small { display:block; }.lease-actions strong { font-size:9px; }.lease-actions small { margin-top:3px;color:#938d84;font-size:7px; }
.tenant-document-grid { display:grid;grid-template-columns:1fr 1fr;gap:10px; }.tenant-document-grid > button { min-height:83px;padding:14px;border:1px solid var(--line);border-radius:12px;display:grid;grid-template-columns:39px 1fr 24px;align-items:center;gap:11px;background:#fff;text-align:left;cursor:pointer;box-shadow:var(--shadow-sm); }.tenant-document-grid > button:hover { border-color:#d2bd8a;transform:translateY(-1px); }.document-type { width:39px;height:39px;display:grid;place-items:center;border-radius:10px;font-size:18px; }.document-type.pdf { color:var(--red);background:var(--red-soft); }.document-type.receipt { color:var(--green);background:var(--green-soft); }.document-type.statement { color:var(--blue);background:var(--blue-soft); }.document-type.rules,.document-type.checklist { color:var(--amber);background:var(--amber-soft); }.tenant-document-grid strong,.tenant-document-grid span { display:block; }.tenant-document-grid strong { font-size:9px; }.tenant-document-grid div span { margin-top:4px;color:#948e85;font-size:7px; }.tenant-document-grid > button > i { color:#9b958c; }
.tenant-message-layout { display:grid;grid-template-columns:330px 1fr;gap:12px; }.tenant-inbox { padding:0 12px; }.tenant-inbox button { width:100%;min-height:92px;padding:13px 5px;border:0;border-bottom:1px solid var(--line-soft);display:grid;grid-template-columns:7px 1fr;gap:7px;background:#fff;text-align:left;cursor:pointer; }.tenant-inbox button.active { background:#fcf8ef; }.message-dot { width:6px;height:6px;margin-top:3px;border-radius:50%;background:var(--gold); }.tenant-inbox strong { font-size:9px; }.tenant-inbox p { margin:5px 0;color:#817b73;font-size:7.5px; }.tenant-inbox small { color:#a19b92;font-size:6.5px; }.message-reader > header > span { color:#928c83;font-size:7px; }.message-copy { min-height:265px;padding:23px;color:#69645d;font-size:9px;line-height:1.7; }.reply-box { padding:14px;border-top:1px solid var(--line-soft); }.reply-box textarea { width:100%;padding:10px;border:1px solid var(--line);border-radius:9px;outline:0;font-size:9px; }.reply-box .button { margin-top:8px; }
.tenant-inbox-item { min-height:88px;padding:13px 5px;display:grid;grid-template-columns:7px 1fr;gap:7px;border-bottom:1px solid var(--line-soft); }.tenant-inbox-item.unread { background:#fcf8ef; }.resident-conversations { display:grid;gap:12px; }.resident-conversations .message-copy { min-height:0; }.message-starter form { padding:18px; }

@media (max-width: 1024px) {
    .login-visual { padding:40px; }.login-form-side { padding:28px; }
    .tenant-sidebar { transform:translateX(-100%);transition:.22s ease;box-shadow:15px 0 40px rgba(0,0,0,.18); }.tenant-app.nav-open .tenant-sidebar { transform:translateX(0); }.tenant-shell { margin-left:0; }.tenant-topbar { justify-content:space-between; }.tenant-topbar > .menu-button { display:grid; }.tenant-mobile-brand { margin-right:auto;margin-left:10px;display:flex;align-items:center;gap:8px; }.tenant-mobile-brand .brand-mark { width:29px;height:29px;font-size:9px; }.tenant-mobile-brand strong { font:700 9px/1 "Manrope",sans-serif;letter-spacing:.1em; }
}
@media (max-width: 768px) {
    .login-layout { grid-template-columns:1fr; }.login-visual { min-height:310px;padding:30px; }.login-story { margin:auto 0 0; }.login-story h1 { font-size:35px; }.login-story > p,.login-proof,.login-visual footer { display:none; }.login-form-side { padding:22px 15px 40px; }.login-form-card { margin-top:-32px;padding:27px;position:relative;z-index:2; }
    .tenant-content { padding:22px 16px 90px; }.tenant-balance-card { grid-template-columns:1fr; }.balance-main { padding:0 0 24px;border-right:0;border-bottom:1px solid rgba(255,255,255,.1); }.balance-side { padding:22px 0 0; }.tenant-dashboard-grid,.tenant-dashboard-grid.lower-tenant-grid { grid-template-columns:1fr; }.tenant-payment-layout,.maintenance-tenant-layout { grid-template-columns:1fr; }.issue-form-panel { order:2; }.lease-hero { grid-template-columns:1fr;gap:22px; }.tenant-message-layout { grid-template-columns:1fr; }.tenant-inbox { max-height:290px;overflow-y:auto; }
}
@media (max-width: 520px) {
    .login-page { padding-top:24px; }.login-layout { min-height:calc(100vh - 24px); }.login-visual { display:none; }.login-form-side { min-height:calc(100vh - 24px);padding:22px 15px; }.login-form-card { margin:0;padding:24px 20px; }.mobile-login-brand { margin-bottom:34px;display:flex;align-items:center;gap:10px; }.mobile-login-brand .brand-mark { background:#171613; }.mobile-login-brand strong { font:700 10px/1 "Manrope",sans-serif;letter-spacing:.12em; }
    .tenant-topbar { top:24px;height:60px;padding:0 14px; }.tenant-shell { padding-top:24px; }.tenant-sidebar { inset-block-start:24px; }.tenant-topbar .avatar { display:none; }.tenant-greeting { align-items:flex-start; }.tenant-greeting .button { display:none; }.tenant-balance-card { padding:23px 20px; }.balance-main > strong { font-size:34px; }.tenant-quick-actions { gap:8px; }.tenant-quick-actions a { min-height:91px;padding:12px 7px;grid-template-columns:1fr;text-align:center; }.tenant-quick-actions a > span { grid-row:auto;margin:auto; }.tenant-quick-actions strong { margin-top:5px;font-size:8px; }.tenant-quick-actions small { display:none; }.tenant-bottom-nav { position:fixed;left:8px;right:8px;bottom:8px;z-index:50;height:61px;padding:5px;display:grid;grid-template-columns:repeat(5,1fr);border:1px solid rgba(255,255,255,.1);border-radius:15px;color:#807b73;background:rgba(24,23,20,.97);box-shadow:0 12px 35px rgba(0,0,0,.28);backdrop-filter:blur(12px); }.tenant-bottom-nav a { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:10px;font-size:6px;font-weight:700; }.tenant-bottom-nav a i { font-size:16px; }.tenant-bottom-nav a.active { color:#e1bb68;background:rgba(183,138,52,.13); }.tenant-page-heading h1 { font-size:23px; }.tenant-page-heading .button { padding:0 10px;font-size:8px; }.tenant-payment-layout { display:block; }.payment-history-panel { margin-top:11px; }.payment-methods button span { display:none; }.tenant-document-grid { grid-template-columns:1fr; }.lease-hero { padding:22px 18px; }.lease-dates span:nth-child(2) { text-align:center; }.message-reader { display:none; }
}

.payment-state,.receipt-preview { padding:34px 28px;text-align:center; }.payment-loader,.receipt-check { width:66px;height:66px;margin:0 auto 18px;display:grid;place-items:center;border-radius:50%;color:#8a6a2c;background:var(--amber-soft); }.payment-loader i { font-size:27px;animation:payment-pulse 1.2s ease infinite; }.receipt-check { color:#fff;background:var(--green); }.receipt-check i { font-size:29px; }.payment-state .eyebrow,.receipt-preview .eyebrow { justify-content:center; }.payment-state h2,.receipt-preview h2 { margin:8px 0;font:700 23px/1.2 "Manrope",sans-serif; }.payment-state > p,.receipt-preview > p { margin:0 auto 16px;max-width:390px;color:#7d776e;font-size:9px;line-height:1.55; }.payment-state .simulation-note { color:#7d6d4d;background:#f8f0df;text-align:left; }.receipt-preview dl { margin:18px 0;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:#faf9f6; }.receipt-preview dl div { min-height:34px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft); }.receipt-preview dl div:last-child { border-bottom:0; }.receipt-preview dt { color:#918b82;font-size:8px; }.receipt-preview dd { margin:0;font-size:8.5px;font-weight:700; }.receipt-preview .button { margin-top:7px; }
@keyframes payment-pulse { 50% { transform:scale(1.08);opacity:.72; } }

/* Billing workspace */
.billing-composer { margin-bottom:13px; border-color:#ddcda9; background:linear-gradient(145deg,#fff,#fcf8ef); }
.billing-composer[hidden],.billing-preview-result[hidden] { display:none; }
.billing-run-form { padding:16px; display:grid; grid-template-columns:minmax(190px,1fr) minmax(170px,.7fr) auto; align-items:end; gap:12px; }
.billing-run-form > label { color:#686158; font-size:8px; font-weight:700; }
.billing-run-form select,.billing-run-form input { width:100%; height:39px; margin-top:6px; padding:0 10px; border:1px solid var(--line); border-radius:8px; color:#332f29; background:#fff; font-size:9px; }
.billing-run-actions { display:flex; gap:7px; }
.billing-preview-result { margin:0 16px 16px; padding:13px 15px; border:1px solid #e0d2b3; border-radius:10px; color:#5e5648; background:#faf4e7; font-size:9px; }
.billing-preview-result strong,.billing-preview-result span { display:block; }
.billing-preview-result strong { color:#2b2823; font:700 15px/1.2 "Manrope",sans-serif; }
.billing-preview-result span { margin-top:5px; color:#837867; }
.billing-preview-result.error { border-color:#edcbc5; color:#9c3833; background:#fff5f3; }
.payment-account-grid { margin:0 0 17px; padding:13px; display:grid; grid-template-columns:1fr 1fr; gap:12px; border:1px solid rgba(255,255,255,.1); border-radius:10px; background:rgba(255,255,255,.035); }
.payment-account-grid > div:first-child { grid-column:1/-1; }
.payment-account-grid span,.payment-account-grid strong { display:block; }
.payment-account-grid span { color:#8f897f; font-size:7px; }
.payment-account-grid strong { margin-top:4px; color:#eee7d9; font-size:9px; }
.payment-guidance { margin-top:14px; padding:12px; display:grid; grid-template-columns:28px 1fr; gap:9px; align-items:center; border-radius:9px; color:#d7c18f; background:rgba(212,173,92,.1); }
.payment-guidance > i { font-size:18px; }.payment-guidance strong,.payment-guidance span { display:block; }.payment-guidance strong { font-size:8px; }.payment-guidance span { margin-top:3px; color:#aaa08c; font-size:7px; line-height:1.45; }
@media (max-width:768px) { .billing-run-form { grid-template-columns:1fr; }.billing-run-actions { justify-content:flex-end; } }

/* Grant Court Ventures black and gold brand */
.demo-ribbon { display:none; }
.sidebar,.tenant-sidebar { inset-block-start:0; color:#d8d5ce; background:linear-gradient(180deg,#171613,#0f0e0c); border-right-color:rgba(255,255,255,.07); }
.app-shell,.tenant-shell { padding-top:0; }
.topbar,.tenant-topbar { top:0; }
.brand-mark { border-color:#806a3b; color:#e1be72; }
.brand span,.tenant-profile span { color:#8f8c85; }
.nav-link,.tenant-sidebar nav a { color:#aaa69f; }
.nav-link i,.tenant-sidebar nav a i { color:#817e77; }
.nav-link.active,.tenant-sidebar nav a.active { color:#fff; background:linear-gradient(90deg,rgba(183,138,52,.22),rgba(183,138,52,.06)); box-shadow:inset 2px 0 0 #d4ad5c; }
.nav-link.active i,.tenant-sidebar nav a.active i { color:#d4ad5c; }
.nav-link small,.tenant-sidebar nav a small { color:#d9b968; background:rgba(183,138,52,.16); }
.role-switch { color:#cdb783; border-color:rgba(212,173,92,.28); }.role-switch:hover { border-color:#d4ad5c; background:rgba(212,173,92,.1); }
.avatar-gold { color:#fff5df; background:#7e642e; }
.button-primary { background:#211f1a; box-shadow:0 8px 20px rgba(33,31,26,.14); }.button-primary:hover { background:#343029; }
.button-gold,.pay-button { color:#241b0c; background:#d4ad5c; }.button-gold:hover,.pay-button:hover { background:#e2c47e; }
.eyebrow,.text-link,.public-link { color:#8d6a28; }.eyebrow span { background:#b78a34; }
.kpi-icon,.summary-icon.amber { color:#806629; background:#f3ead8; }
.feature-kpi { border-color:#d7c18f; background:linear-gradient(145deg,#fff,#fbf6ea); }
.micro-progress span,.property-progress i,.bar-group .actual,.bar-group.active .actual,.legend-actual { background:#b78a34; }
.bar-group.active .actual { box-shadow:0 4px 12px rgba(183,138,52,.28); }
.donut-chart { background:conic-gradient(#a68035 0 85.7%,#d9d2c6 85.7% 96.4%,#22201d 96.4% 100%); }.dot.occupied { background:#a68035; }.dot.vacant { background:#d9d2c6; }.dot.reserved { background:#22201d; }
.insight-callout { background:#f7f2e7; }.insight-callout > i { color:#806629; background:#e8d6af; }
.section-kicker { color:#9b885f; }
.topbar { background:rgba(255,255,255,.95); }
.login-page { padding-top:0; background:#f3efe7; }.login-layout { min-height:100vh; }.login-form-side { background:linear-gradient(145deg,#fbfaf7,#f1ebe0); }
.login-form-card { border-color:#e2d9ca; box-shadow:0 24px 70px rgba(30,25,17,.14); }
.form-errors { margin:0 0 14px; padding:10px 12px; border:1px solid #edcbc5; border-radius:9px; color:#9c3833; background:#fff5f3; font-size:9px; line-height:1.45; }.form-errors p { margin:0; }.field-error { display:block; margin-top:5px; color:#a53e38; font-size:8px; }.login-options a { color:#8b6b2e; }
.login-brand .brand-mark { color:#f0cf88; border-color:rgba(240,207,136,.62); }
.login-story .section-kicker { color:#e5c678; }.login-proof { border-color:rgba(255,255,255,.16); }.login-security { color:#7d766c; }
.demo-role-icon { color:#806629; background:#f3ead8; }.demo-roles a:hover { border-color:#d8c69f; background:#fdf9f0; }
.tenant-app { background:#f4f1eb; }
.tenant-balance-card,.pay-now-card,.lease-hero { background:radial-gradient(circle at 82% 14%,rgba(212,173,92,.22),transparent 29%),linear-gradient(130deg,#171613,#5b451c); box-shadow:0 18px 45px rgba(30,25,17,.2); }
.balance-main > strong,.pay-now-card h2,.lease-hero h2 { color:#ead096; }.balance-main > strong small,.pay-now-card h2 small { color:#d4ad5c; }
.balance-status { color:#edd59f!important; background:rgba(212,173,92,.12); }
.tenant-quick-actions a > span { color:#806629; background:#f3ead8; }.tenant-quick-actions a:hover,.tenant-document-grid > button:hover { border-color:#d7c18f; }
.tenant-panel > header > a,.tenant-panel > header > button { color:#8d6a28; }
.payment-methods button.active { border-color:#caa34e; background:rgba(212,173,92,.12); }.payment-methods i { color:#d4ad5c; }
.simulation-note { color:#dbc284; background:rgba(212,173,92,.1); }
.tenant-bottom-nav { color:#918b82; background:rgba(23,22,19,.97); }.tenant-bottom-nav a.active { color:#e1bb68; background:rgba(183,138,52,.14); }
.message-dot { background:#b78a34; }.tenant-inbox button.active { background:#fbf6ea; }
.receipt-check { background:#806629; }
.stacked-form { display:grid; gap:11px; }
.stacked-form label { display:grid; gap:5px; color:#776f64; font-size:8px; font-weight:700; }
.stacked-form input,.stacked-form select { width:100%; }
.inline-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.inline-actions .button { min-height:32px; padding:0 11px; }
.panel-form { margin-top:12px; border-top:1px solid var(--line-soft); }
.panel-form .button { align-self:end; }
.payment-workflow-grid { margin-top:14px; }
.toast.error { color:#8b2f2b; border-color:#e6b9b6; background:#fff7f6; }
.toast.success { color:#27633e; border-color:#b8d8c3; background:#f5fbf7; }
.ticket-card { display:block; width:100%; }
.ticket-card > small { display:block; margin-top:6px; color:var(--muted); line-height:1.45; }
.ticket-action-form { display:grid; gap:7px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }
.ticket-action-form input,.ticket-action-form select { width:100%; min-width:0; height:34px; padding:0 8px; border:1px solid var(--line); border-radius:8px; color:#4e4942; background:#fff; font-size:8px; }
.maintenance-control-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:16px; }
.maintenance-control-grid .stacked-form { padding:15px; border:1px solid var(--line); border-radius:12px; background:#faf9f6; }
.maintenance-control-grid h3 { margin:0 0 3px; }
.maintenance-schedule-list { padding:0 16px 16px; }
.tenant-request-list { display:grid; gap:12px; }
.issue-form-panel input[name="title"] { width:100%; margin-top:6px; padding:10px; border:1px solid var(--line); border-radius:9px; outline:0; font-size:9px; }
.resident-ticket { padding:14px; border:1px solid var(--line); border-radius:12px; background:#faf9f6; }
.resident-ticket h3 { margin:6px 0 0; }
.resident-resolution-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }

@media (max-width:760px) {
    .maintenance-control-grid,.resident-resolution-actions { grid-template-columns:1fr; }
}

@media (max-width: 480px) {
    .sidebar,.tenant-sidebar { inset-block-start:0; }.app-shell,.tenant-shell { padding-top:0; }.topbar,.tenant-topbar { top:0; }
}
@media (max-width: 520px) {
    .login-page { padding-top:0; }.login-layout,.login-form-side { min-height:100vh; }
}