.dev-hero{display:flex;justify-content:space-between;gap:24px;padding:28px;border-radius:22px;background:linear-gradient(125deg,#071d49,#153873);color:#fff;margin-bottom:18px}.dev-hero h1{margin:4px 0 6px}.dev-hero p{margin:0;color:#d7e2f3}.dev-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.dev-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:18px}.dev-stats article{background:#fff;border:1px solid #dce5e2;border-top:3px solid #e3b83d;border-radius:16px;padding:16px}.dev-stats small,.dev-stats strong{display:block}.dev-stats strong{font-size:22px;margin-top:5px}.dev-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.dev-span{grid-column:1/-1}.dev-projects{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.dev-project{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:14px;border:1px solid #e1e8e5;border-radius:14px}.dev-project small,.dev-project strong,.dev-project b{display:block}.dev-dues form{display:grid;grid-template-columns:1fr 105px 90px 130px auto;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #e7ecea}.dev-dues small,.dev-dues strong{display:block}.dev-updates>div{position:relative;padding:12px 12px 12px 62px;border-bottom:1px solid #e7ecea}.dev-updates span{position:absolute;left:0;top:12px;width:48px;height:48px;border-radius:50%;background:#eef3fb;color:#071d49;display:grid;place-items:center}.dev-updates small,.dev-updates strong{display:block}.dev-updates p{margin:6px 0 0}.status.active{color:#14714e;background:#def3e8}.status.completed{color:#315a92;background:#e2ebf8}.status.on_hold{color:#9a6720;background:#fff0cd}@media(max-width:1100px){.dev-stats{grid-template-columns:repeat(3,1fr)}.dev-grid{grid-template-columns:1fr}.dev-projects{grid-template-columns:1fr}.dev-dues form{grid-template-columns:1fr 100px 90px}.dev-dues form input[type=date],.dev-dues form button{grid-column:auto}}@media(max-width:700px){.dev-hero{display:block;padding:20px}.dev-actions{justify-content:flex-start;margin-top:16px}.dev-stats{grid-template-columns:repeat(2,1fr)}.dev-project{grid-template-columns:auto 1fr}.dev-project>div:last-child{grid-column:2}.dev-dues form{grid-template-columns:1fr 1fr}.dev-dues form>div{grid-column:1/-1}}
/* Tab switching — the buttons and JS already toggle an "active" class, but no
   CSS ever hid the inactive panel, so both sections showed stacked on one page. */
.dev-tabs{padding:6px!important}
.dev-tab-header{display:flex;gap:8px;flex-wrap:wrap}
.dev-tab-button{border:1px solid #dce4ec;background:#f4f7fb;color:#55665d;border-radius:10px;padding:10px 16px;font-weight:700;font-size:.85rem;cursor:pointer}
.dev-tab-button.active{background:#071d49;border-color:#071d49;color:#fff}
.dev-tab-panel{display:none}
.dev-tab-panel.active{display:block}
/* Shops Register grouped by mall, collapsed by default (native <details>, no JS needed) */
.mall-shop-group{border:1px solid #dce5e2;border-radius:14px;margin-top:12px;overflow:hidden}
.mall-shop-group+.mall-shop-group{margin-top:10px}
.mall-shop-group summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:14px 18px;background:#f7f9fc;font-size:.95rem}
.mall-shop-group summary::-webkit-details-marker{display:none}
.mall-shop-group summary::before{content:"▸";color:#071d49;font-size:.8rem;transition:transform .15s}
.mall-shop-group[open] summary::before{transform:rotate(90deg)}
.mall-shop-group summary strong{color:#071d49}
.mall-shop-group summary span{margin-left:auto;color:#667283;font-size:.82rem;font-weight:600}
.mall-shop-group .table-wrap{padding:0 4px 4px}
/* Multi-line construction expense entry — several payments logged in one save */
.modal-card.wide{max-width:640px}
.expense-line-items{display:flex;flex-direction:column;gap:10px}
.expense-line-row{display:grid;grid-template-columns:1.2fr 1.1fr 1fr .9fr auto;gap:8px;align-items:center;padding:10px;border:1px solid #e1e8e5;border-radius:12px;background:#f9fbfa}
.expense-line-row .line-category-custom{grid-column:1/3}
.expense-line-actions{display:flex}
.button.compact{padding:6px 12px;font-size:.8rem}
@media(max-width:760px){.expense-line-row{grid-template-columns:1fr 1fr}.expense-line-row .line-category-custom{grid-column:1/-1}}
/* Summary stat cards (mall tab totals) and construction site cards — previously bare
   <article>/HTML with no styling at all, so they rendered as plain stacked text. */
.dev-summary-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.summary-card{background:#fff;border:1px solid #dce5e2;border-top:3px solid #071d49;border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.summary-card span{color:#667283;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.summary-card strong{font-size:22px;color:#071d49}
.summary-card.warning{border-top-color:#e3b83d}
.summary-card.warning strong{color:#9a6720}
@media(max-width:1100px){.dev-summary-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.dev-summary-cards{grid-template-columns:1fr}}

.construction-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:6px}
.construction-project-card{background:#fff;border:1px solid #dce5e2;border-top:3px solid #e3b83d;border-radius:16px;padding:18px;transition:box-shadow .15s,border-color .15s}
.construction-project-card[data-href]{cursor:pointer}
.construction-project-card[data-href]:hover{box-shadow:0 6px 18px rgba(7,29,73,.1);border-color:#c9d6e8}
.construction-project-card .eyebrow{margin:0 0 2px}
.construction-project-card h3{margin:0 0 4px;color:#071d49;font-size:1.05rem}
.construction-project-card .card-open-hint{display:block;margin:0 0 14px;color:#8c98a6;font-size:.76rem;font-weight:600}
.construction-metrics{display:flex;flex-direction:column;gap:8px;border-top:1px solid #eef1f0;padding-top:12px}
.construction-metrics div{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.construction-metrics span{color:#667283;font-size:.82rem}
.construction-metrics strong{font-size:1rem;color:#14312e}
.construction-card-delete{margin-top:12px}
.panel-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.combined-voucher-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:12px 14px;background:#f7f9fc;border:1px solid #e1e8e5;border-radius:12px}
.combined-voucher-bar label{display:flex;align-items:center;gap:8px;font-size:.85rem;color:#3a4552}
.combined-voucher-bar input[type=text]{border:1px solid #cfd8e3;border-radius:8px;padding:6px 10px;min-width:180px}

.timeline-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:6px}
.timeline-block h3{margin:0 0 10px;font-size:.95rem;color:#071d49}
.timeline-item{position:relative;padding:12px 14px;border:1px solid #e7ecea;border-radius:12px;margin-bottom:10px;background:#f9fbfa}
.timeline-item strong{display:block;color:#071d49}
.timeline-item small{display:block;color:#667283;margin:2px 0 6px}
.timeline-item p{margin:0 0 8px}
@media(max-width:900px){.timeline-grid{grid-template-columns:1fr}}

.construction-metrics .pending-metric span{color:#9d5b00}
.construction-metrics .pending-metric strong{color:#9d5b00}