.period-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:17px}.period-card{padding:22px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-sm)}.period-card__top{display:flex;align-items:center;justify-content:space-between}.period-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;background:#eaf0ff;color:var(--blue);font-size:20px;font-weight:800}.period-card h3{margin:17px 0 5px}.period-amount{display:block;font-size:27px;letter-spacing:-.03em}.period-card dl{margin:18px 0 13px;padding-top:10px;border-top:1px solid var(--line)}.period-card dl div{display:flex;justify-content:space-between;padding:5px 0;font-size:12px}.period-card dt{color:var(--muted)}.period-card dd{margin:0;font-weight:700}.progress{height:7px;border-radius:99px;background:#edf0f5;overflow:hidden}.progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3157d5,#1ab17d)}.period-card>small{display:block;margin-top:7px;color:var(--muted)}.money-stat{font-size:clamp(23px,3vw,32px)!important}.debt-matrix{min-width:1050px!important}.debt-matrix thead th:not(:first-child){text-align:center}.debt-matrix thead th small{display:block}.debt-matrix td:not(:first-child){text-align:center}.debt-state{display:inline-flex;padding:6px 9px;border-radius:8px;font-size:10px;font-weight:800}.debt-state--paid{background:#e6f8f1;color:#087858}.debt-state--partial{background:#fff3df;color:#a9610b}.debt-state--unpaid{background:#fff0f2;color:#b53249}.debt-state--overdue{background:#f4eaff;color:#7f42b8}.debt-state--none{background:#f0f2f5;color:#858b96}.debt-money{display:block;margin-top:5px;color:var(--muted);font-size:10px}.positive-money{color:#0c9168}.negative-money{color:#cd4057}.back-link{display:inline-block;margin-bottom:7px;color:var(--blue);font-size:12px;font-weight:750;text-decoration:none}.balance-hero{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:20px;padding:28px 30px;border-radius:20px;background:linear-gradient(135deg,#182650,#2e4386);color:#fff;box-shadow:var(--shadow)}.balance-hero>div span,.balance-hero>div small{display:block;color:#c7d2f1}.balance-hero>div strong{display:block;margin:4px 0;font-size:38px}.balance-hero dl{display:flex;gap:40px;margin:0}.balance-hero dl div{min-width:110px}.balance-hero dt{font-size:11px;color:#b7c4e8}.balance-hero dd{margin:4px 0 0;font-size:17px;font-weight:800}.balance-hero--positive{background:linear-gradient(135deg,#126d55,#18a578)}.statement-grid,.resident-finance-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.transaction-list>div{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}.transaction-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;font-weight:800}.transaction-icon--debt{background:#fff0f2;color:var(--red)}.transaction-icon--payment{background:#e7f8f1;color:var(--green)}.transaction-list p{display:flex;flex:1;flex-direction:column;margin:0}.transaction-list p small{color:var(--muted)}.resident-balance{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:1px;margin-bottom:20px;overflow:hidden;border-radius:20px;background:#2e4386;color:#fff;box-shadow:var(--shadow)}.resident-balance>div{padding:24px;background:linear-gradient(135deg,#192751,#30478d)}.resident-balance small,.resident-balance span{display:block;color:#c7d2f1}.resident-balance strong{display:block;margin:5px 0;font-size:27px}.resident-balance--clear,.resident-balance--clear>div{background:linear-gradient(135deg,#126d55,#18a578)}.resident-finance-grid{margin-top:20px}@media(max-width:900px){.statement-grid,.resident-finance-grid{grid-template-columns:1fr}.balance-hero{align-items:flex-start;flex-direction:column}.balance-hero dl{width:100%;justify-content:space-between}.resident-balance{grid-template-columns:1fr 1fr}.resident-balance>div:first-child{grid-column:span 2}}@media(max-width:600px){.period-grid{grid-template-columns:1fr}.balance-hero{padding:23px 20px}.balance-hero dl{display:grid;grid-template-columns:1fr 1fr;gap:15px}.balance-hero>div strong{font-size:32px}.resident-balance{grid-template-columns:1fr}.resident-balance>div:first-child{grid-column:auto}.resident-balance>div{padding:19px}.resident-balance strong{font-size:23px}}
