/* daemon.css — /daemon page (templates/daemon.html).
   Design tokens only (static/design/tokens.css); no raw colours or sizes
   beyond layout widths. Scoped under .dmn so it touches nothing else. */

.dmn {
  max-width: var(--size-admin-container);
  margin: 0 auto;
  padding: var(--spacing-3xl) var(--spacing-lg) var(--spacing-2xl);
  color: var(--color-cs-dark-text-primary);
  font-family: var(--font-family-cs-dark-body);
}

.dmn-hero { margin-bottom: var(--spacing-2xl); }

.dmn-title {
  font-family: var(--font-family-public-heading);
  font-size: var(--text-2xl);
  color: var(--color-cs-dark-text-primary);
  margin: 0 0 var(--spacing-sm);
}

.dmn-headline {
  font-size: var(--text-lg);
  color: var(--color-cs-dark-text-secondary);
  margin: 0 0 var(--spacing-md);
}

.dmn-badge {
  display: inline-block;
  padding: var(--spacing-badge-y) var(--spacing-badge-x);
  border: 1px solid var(--color-cs-dark-warning);
  border-radius: var(--radius-pill);
  color: var(--color-cs-dark-warning);
  font-size: var(--text-sm);
  margin: 0 0 var(--spacing-md);
}

.dmn-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
}

.dmn a { color: var(--color-cs-dark-accent-cyan); text-decoration: none; }
.dmn a:hover, .dmn a:focus-visible { text-decoration: underline; }

.dmn-card {
  background: var(--color-cs-dark-surface);
  border: 1px solid var(--color-cs-dark-border);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  margin-bottom: var(--spacing-xl);
}

.dmn-status { border-color: var(--color-cs-dark-accent); }

.dmn-h2 {
  font-size: var(--text-xl);
  color: var(--color-cs-dark-text-primary);
  margin: 0 0 var(--spacing-md);
}

.dmn-h3 {
  font-size: var(--text-lg);
  color: var(--color-cs-dark-text-secondary);
  margin: var(--spacing-lg) 0 var(--spacing-sm);
}

.dmn-lead { font-size: var(--text-lg); margin-bottom: var(--spacing-sm); }

.dmn-muted { color: var(--color-cs-dark-text-light); font-size: var(--text-md); }

.dmn-list, .dmn-projects, .dmn-roles {
  margin: 0;
  padding-left: var(--spacing-xl);
}

.dmn-list li, .dmn-projects li, .dmn-roles li { margin-bottom: var(--spacing-sm); }

.dmn-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: var(--spacing-xl);
}

.dmn-foot {
  margin-top: var(--spacing-2xl);
  padding-top: var(--spacing-lg);
  border-top: 1px solid var(--color-cs-dark-border);
}
