/* Shared by the rules panes (RulebookListPane, RuleListPane,
   RulebookDetailPane, RuleSweepPane): the pane surface, its heading, and the
   title chip. Counting them in this comment went stale the first time a
   fourth was added, so it no longer does. Load with
   <style src="@/assets/rules-shared.css" /> beside the component's own
   scoped block; never restate these there (#2903, milestone 299). */
.pane {
  background: var(--fs-surface-hover);
  padding: 1rem;
  overflow-y: auto;
}
.pane header h2 {
  font-family: Fraunces, serif;
  font-style: italic;
  margin: 0 0 0.5rem 0;
}
.form-buttons { display: flex; gap: 0.5rem; }

/* A small marker beside a rule's title. Two of these appeared within one
   milestone (tier, then verification) and were byte-identical; a third would
   have drifted. The pane's italic serif title is inherited by anything inside
   it, so the chip resets family and style explicitly. */
.rule-chip {
  margin-left: 0.4rem;
  font-family: var(--fs-font-body);
  font-style: normal;
  font-size: 0.62rem;
  color: var(--fs-text-secondary);
  background: var(--fs-surface-raised);
  border-radius: var(--fs-radius-pill);
  padding: 0.05rem 0.4rem;
  vertical-align: middle;
}