body {
    font-family: "Segoe UI", Tahoma, Arial, sans-serif;
    background-color: #f7f8fa;
    position: relative;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='680' height='420' viewBox='0 0 680 420'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%237ec8f0'/%3E%3Cstop offset='100%25' stop-color='%23cdeaf9'/%3E%3C/linearGradient%3E%3ClinearGradient id='wallShade' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%23f3ede4'/%3E%3Cstop offset='100%25' stop-color='%23ded4c4'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' width='680' height='420' fill='url(%23sky)'/%3E%3Ccircle cx='580' cy='70' r='35' fill='%23ffe08a'/%3E%3Cellipse cx='120' cy='80' rx='55' ry='22' fill='%23ffffff' opacity='0.9'/%3E%3Cellipse cx='170' cy='90' rx='40' ry='18' fill='%23ffffff' opacity='0.9'/%3E%3Crect x='0' y='330' width='680' height='90' fill='%237bc47f'/%3E%3Crect x='0' y='330' width='680' height='8' fill='%2368b06d'/%3E%3Cpolygon points='220,330 220,180 340,90 460,180 460,330' fill='url(%23wallShade)' stroke='%23b9ac95' stroke-width='1'/%3E%3Cpolygon points='200,190 340,80 480,190 460,190 340,105 220,190' fill='%23a5453b'/%3E%3Cpolygon points='200,190 340,80 340,95 210,190' fill='%238f3b32'/%3E%3Crect x='255' y='220' width='55' height='55' fill='%238fc7e8' stroke='%235c86a0' stroke-width='2'/%3E%3Cline x1='282' y1='220' x2='282' y2='275' stroke='%235c86a0' stroke-width='2'/%3E%3Cline x1='255' y1='247' x2='310' y2='247' stroke='%235c86a0' stroke-width='2'/%3E%3Crect x='370' y='220' width='55' height='55' fill='%238fc7e8' stroke='%235c86a0' stroke-width='2'/%3E%3Cline x1='397' y1='220' x2='397' y2='275' stroke='%235c86a0' stroke-width='2'/%3E%3Cline x1='370' y1='247' x2='425' y2='247' stroke='%235c86a0' stroke-width='2'/%3E%3Crect x='318' y='250' width='45' height='80' fill='%236b4a35'/%3E%3Ccircle cx='352' cy='292' r='2.5' fill='%233c2a1e'/%3E%3Cline x1='318' y1='250' x2='363' y2='250' stroke='%234a3325' stroke-width='2'/%3E%3Crect x='440' y='150' width='20' height='45' fill='%238a7f70'/%3E%3Crect x='435' y='140' width='30' height='12' fill='%236f6558'/%3E%3Cg transform='translate(85,300)'%3E%3Crect x='0' y='30' width='140' height='35' rx='8' fill='%23c0392b'/%3E%3Cpath d='M15 30 L35 5 L100 5 L120 30 Z' fill='%23c0392b'/%3E%3Crect x='40' y='12' width='55' height='18' rx='3' fill='%23bcd9ea' opacity='0.85'/%3E%3Ccircle cx='30' cy='65' r='14' fill='%232b2b2b'/%3E%3Ccircle cx='30' cy='65' r='6' fill='%238a8a8a'/%3E%3Ccircle cx='105' cy='65' r='14' fill='%232b2b2b'/%3E%3Ccircle cx='105' cy='65' r='6' fill='%238a8a8a'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center 65%;
    background-size: min(900px, 90vw) auto;
    opacity: 0.09;
    z-index: -1;
    pointer-events: none;
}

.card {
    border: none;
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
}

.table thead {
    background-color: #eef7f0;
}

.btn-primary {
    background-color: #146c43;
    border-color: #146c43;
}

.btn-primary:hover {
    background-color: #0f5132;
    border-color: #0f5132;
}

.status-badge-Due { background-color:#ffc107; }
.status-badge-Paid { background-color:#198754; }
.status-badge-Late { background-color:#dc3545; }