/* ============================================================
   COMPONENT · PLAQUE
   The engraved label. Use anywhere you need "this is what this
   control does" text. Letterpress-on-bezel feel.
   ============================================================ */

.c-plaque {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  font-family: var(--font-plaque);
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text-muted);
  background: var(--color-bezel-dark);
  border-radius: var(--radius-xs);
  box-shadow: var(--seam-engraved);
  /* Letterpress text effect */
  text-shadow: 0 1px 0 var(--c-bezel-hi), 0 -1px 0 rgba(0,0,0,0.6);
}

.c-plaque--bright { color: var(--color-text-strong); }
.c-plaque--phosphor { color: var(--color-phosphor); text-shadow: 0 0 4px var(--color-phosphor); }