/* hmac — tool-specific components (loaded after the global /styles.css) */

.hm-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.hm-out {
  font-family: var(--font-mono, ui-monospace, Consolas, monospace);
  font-size: var(--fs-sm, 0.889rem);
  word-break: break-all;
  cursor: pointer;
}
.hm-out:hover,
.hm-out:focus-visible {
  color: var(--brand, #3a5bd9);
}

.hm-match {
  min-height: 1.5em;
  margin-top: 0.75rem;
  font-weight: 700;
}
.hm-match.ok { color: var(--success, #1a7f4b); }
.hm-match.bad { color: var(--danger, #c0392b); }