:root {
  --brand: #0f3d2e;
  --brand-dark: #0a2b20;
}
body { background: #f4f1ec; }
.text-brand { color: var(--brand); }
.app-navbar { background: var(--brand) !important; }
.btn-brand {
  background-color: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.btn-brand:hover, .btn-brand:focus {
  background-color: var(--brand-dark);
  border-color: var(--brand-dark);
  color: #fff;
}
.btn-outline-brand {
  color: var(--brand);
  border-color: var(--brand);
}
.btn-outline-brand:hover {
  background-color: var(--brand);
  color: #fff;
}
.stat-card { border: none; border-radius: 12px; }
.stat-number { font-size: 2rem; font-weight: 700; }
.stat-label { font-size: .8rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }
.card { border-radius: 12px; }
.table td, .table th { vertical-align: middle; }

@media (max-width: 576px) {
  .stat-number { font-size: 1.5rem; }
  h4 { font-size: 1.2rem; }
  .btn { font-size: .9rem; }
}

.year-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  padding: 3px 6px;
  border-radius: 5px;
  font-size: .72rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.2;
}
.year-dot-paid { background-color: #198754; }
.year-dot-unpaid { background-color: #dc3545; }
.year-dot-none { background-color: #adb5bd; color: #495057; }