/* firmware.css — minimal helpers for Sketch Library pages.
   Everything substantive uses native components (fact-block, fit-pair,
   fund-callout, fund-related, faq, rail-card, btn). Neutral + token-only:
   no decorative green/amber — green stays rare per the brand substrate. */

/* The flash call-to-action: the page's single primary action, given quiet
   emphasis on a raised surface (not colour). */
.flash-cta {
  margin: var(--space-6) 0;
  padding: var(--space-6) var(--space-5);
  background: var(--surface-raised);
  border: var(--rule-hairline);
  border-radius: var(--radius-base);
  text-align: center;
}
.flash-cta__meta {
  margin: var(--space-3) 0 0;
  font-family: var(--font-mono);
  font-size: var(--size-tiny);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
}
.flash-cta__note { margin: var(--space-3) 0 0; font-size: var(--size-small); color: var(--text-muted); }

/* Sample-packet code panel (lives inside a collapsed <details>, so the page
   stays calm at the core). Uses the site's own code tokens. */
.code-panel {
  margin: var(--space-3) 0 0;
  padding: var(--space-4);
  background: var(--code-bg);
  color: var(--code-fg);
  border-radius: var(--radius-base);
  font-family: var(--font-mono);
  font-size: var(--size-tiny);
  line-height: var(--lh-body);
  overflow-x: auto;
}

/* Per-board flash buttons: pick your board; the installer verifies the chip
   matches before writing (no silent auto-detect). Neutral throughout — status
   reads as a muted word, never a colour badge (green stays rare per the substrate). */
.flash-boards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: var(--space-4);
  max-width: 34rem;
  margin: 0 auto;
}
.flash-board { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); }
.flash-board__btn { width: 100%; }
.flash-board__meta { font-size: var(--size-tiny); color: var(--text-muted); text-align: center; }