:root{--ink:#17211f;--forest:#23443c;--mist:#eaf0ec;--ivory:#f8f7f3;--stone:#e5e4de;--red:#b94747}*{box-sizing:border-box}body{margin:0;background:var(--ivory);color:var(--ink);font:15px/1.55 Arial,sans-serif}header{min-height:64px;background:var(--ink);color:#fff;display:flex;align-items:center;gap:28px;padding:0 4%;flex-wrap:wrap}.logo{font:26px Georgia,serif;color:#fff}.logo span{color:#96c5ae}nav{display:flex;gap:18px;flex:1}nav a,.user a{color:#dce7e1;text-decoration:none;font-weight:bold}.user{font-size:13px}.wrap{max-width:1160px;margin:36px auto;padding:0 24px}h1,h2{font-family:Georgia,serif;margin:0 0 14px}h1{font-size:38px}.top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:26px}.card{background:#fff;border:1px solid var(--stone);border-radius:14px;padding:22px;margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.metric strong{font-size:29px;display:block}.metric strong a{color:inherit;text-decoration:none}.metric strong a:hover{text-decoration:underline}.metric small,.expense-total small{color:#64706b;text-transform:uppercase}.btn,button{background:var(--forest);color:#fff;border:0;border-radius:8px;padding:11px 15px;font-weight:bold;cursor:pointer;text-decoration:none;display:inline-block}.btn.alt{background:#fff;border:1px solid var(--stone);color:var(--ink)}input,select,textarea{width:100%;padding:10px;border:1px solid #cdd3ce;border-radius:7px;margin:5px 0 14px}label{font-weight:bold;font-size:13px}textarea{min-height:100px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:13px;border-bottom:1px solid var(--stone);text-align:left}.table th{font-size:12px;text-transform:uppercase;color:#64706b}.notice{padding:13px;border-radius:8px;margin-bottom:18px}.success{background:#e3f2e9;color:#276347}.danger{background:#fae6e6;color:#8d3030}.pill{font-size:12px;background:var(--mist);padding:4px 8px;border-radius:99px}.login{max-width:440px;margin:8vh auto}.legal{border-left:4px solid #b58a48;background:#fffaf0;padding:15px;margin:18px 0}.collection-card{background:linear-gradient(135deg,#17352f,#2c5b4d);color:#fff;border:0}.collection-card h2,.collection-card p{color:#fff}.collection-card small{color:#c9ded5;text-transform:uppercase;font-size:12px;font-weight:bold}.collection-filter{min-width:190px}.collection-filter label{display:block;color:#dbece4;margin-bottom:3px}.collection-filter select{background:#fff;color:#17211f;margin:0;padding:8px}.collection-body{display:flex;align-items:center;justify-content:space-between;gap:30px}.collection-figures{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;flex:1}.collection-figures strong{display:block;font:28px Georgia,serif}.collection-figures a{color:#fff}.collection-track{height:14px;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden}.collection-track span{display:block;height:100%;background:#a8d6b8;border-radius:inherit}.collection-note{color:#dbece4!important;margin:10px 0 0}.collection-chart{flex:0 0 175px;text-align:center}.collection-chart svg,.expense-chart svg{display:block;width:150px;height:150px;margin:auto}.chart-outstanding,.chart-collected,.expense-base,.expense-slice{fill:none;stroke-width:18}.chart-outstanding{stroke:rgba(255,255,255,.18)}.chart-collected{stroke:#a8d6b8;transform:rotate(-90deg);transform-origin:60px 60px}.chart-percent{fill:#fff;font:700 20px Georgia,serif}.chart-label{fill:#c9ded5;font:10px Arial,sans-serif}.chart-key{display:flex;justify-content:center;gap:10px;font-size:11px;color:#dbece4}.chart-key span{display:flex;gap:4px;align-items:center}.chart-key i,.expense-dot{width:9px;height:9px;border-radius:50%;display:block}.key-collected{background:#a8d6b8}.key-outstanding{background:rgba(255,255,255,.28)}.expense-card{border-top:4px solid #cb9847}.expense-body{display:flex;align-items:center;gap:30px}.expense-chart{flex:0 0 180px}.expense-base{stroke:#edf0ed}.expense-slice{transform:rotate(-90deg);transform-origin:60px 60px}.expense-slice.bond{stroke:#4e7a9e}.expense-slice.utilities{stroke:#6d9f76}.expense-slice.maintenance{stroke:#cb9847}.expense-slice.other{stroke:#8d7f92}.expense-percent{fill:#17211f;font:700 11px Arial,sans-serif}.expense-label{fill:#64706b;font:10px Arial,sans-serif}.expense-breakdown{flex:1;display:grid;gap:14px}.expense-row>div:first-child{display:flex;align-items:center;gap:8px}.expense-row strong{flex:1}.expense-row span:last-child{font-weight:bold}.expense-bar{height:10px;background:#edf0ed;border-radius:99px;overflow:hidden;margin-top:6px}.expense-bar i{height:100%;display:block;border-radius:inherit}.bond{background:#4e7a9e}.utilities{background:#6d9f76}.maintenance{background:#cb9847}.other{background:#8d7f92}.expense-dot.bond{background:#4e7a9e}.expense-dot.utilities{background:#6d9f76}.expense-dot.maintenance{background:#cb9847}.expense-dot.other{background:#8d7f92}@media(max-width:760px){header{padding:14px 20px}nav{order:3;flex-basis:100%;overflow:auto}.wrap{margin:24px auto;padding:0 16px}.grid,.form-grid,.collection-figures{grid-template-columns:1fr}.top,.collection-body,.expense-body{align-items:flex-start;flex-direction:column}.table{font-size:13px;display:block;overflow:auto}.collection-figures{gap:12px}.collection-figures strong{font-size:24px}.collection-chart,.expense-chart{align-self:center}}