/* IHS palette variables */
:root {
  --mysd-primary: #43d1b2;
  --mysd-primary-dark: #239b80;
  --mysd-accent: #23579b;
  --mysd-danger: #9b2323;
  --mysd-muted: #719773;
}
.mysd-wrap h1 { color: var(--mysd-accent); }
.mysd-cards { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin: 16px 0; }
.mysd-card { background: white; border-left: 6px solid var(--mysd-primary); padding: 12px; border-radius: 10px; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.mysd-card-title { font-weight: 600; color: var(--mysd-muted); }
.mysd-card-number { font-size: 28px; font-weight: 700; color: var(--mysd-accent); }

.mysd-table { width: 100%; border-collapse: collapse; }
.mysd-table thead th { background: var(--mysd-primary-dark); color: #fff; padding: 8px; text-align:left; }
.mysd-table td { border-bottom: 1px solid #eee; padding: 8px; }
.mysd-alert, .mysd-note, .mysd-success, .mysd-error { padding: 12px; border-radius: 8px; margin: 10px 0; }
.mysd-alert { background: #fff8e6; border: 1px solid #ffd37a; }
.mysd-success { background: #e7fff6; border:1px solid var(--mysd-primary-dark); }
.mysd-error { background: #ffeaea; border:1px solid var(--mysd-danger); }