.badge--low { opacity: .8; }
.badge--high { background: color-mix(in srgb, #d97706 18%, var(--surface)); color: #b45309; }
.badge--urgent { background: var(--danger-bg); color: var(--danger-text); border: 1px solid var(--danger-border); }
.due { font-weight: 750; }
.due--overdue { color: var(--danger-text); }
.due--soon { color: #b45309; }
.due--scheduled { color: var(--muted); }

html[data-theme="dark"] .badge--high,
html[data-theme="dark"] .due--soon { color: #fbbf24; }