/* tools/max-feedrate/tool.css — styles only the max feedrate checker needs. Loaded after
 * /assets/tool.css, and every class starts with mfr- so nothing here can restyle the shared kit. */

/* A block of fields shown or hidden as one (the screw helper, the TNC-L32 timings). */
.mfr-sub { display: grid; gap: var(--s-3); min-width: 0; }

/* ============================================================ the feed check
 *
 * The second answer: the pulse frequency a feed needs, against the limit. Set on the raised
 * page tone rather than a second dark slab — the page has one readout. */

.mfr-check { display: grid; gap: var(--s-3); min-width: 0; padding: var(--s-4) var(--s-5);
             background: var(--page-raised); border: var(--hair); border-radius: var(--r-md);
             box-shadow: var(--lip); }
.mfr-check > * { margin: 0; }
.mfr-check__head { display: flex; flex-wrap: wrap; align-items: center;
                   justify-content: space-between; gap: var(--s-2) var(--s-4); }
.mfr-check__k { margin: 0; font-family: var(--font-display); font-size: var(--t-xs);
                font-weight: var(--w-medium); letter-spacing: var(--ls-eyebrow);
                text-transform: uppercase; color: var(--page-muted); }
.mfr-check__v { font-family: var(--font-mono); font-variant-numeric: tabular-nums;
                font-size: var(--t-2xl); line-height: var(--lh-tight); letter-spacing: -0.02em;
                overflow-wrap: anywhere; }
.mfr-check__u { margin-left: 0.35em; font-size: var(--t-md); letter-spacing: 0;
                color: var(--page-muted); }
.mfr-check__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
                   gap: var(--s-3); margin: 0; }
.mfr-check__grid > div { display: grid; gap: 2px; min-width: 0; }
.mfr-check__grid dt { font-size: var(--t-xs); color: var(--page-muted); }
.mfr-check__grid dd { margin: 0; font-family: var(--font-mono); font-variant-numeric: tabular-nums;
                      font-size: var(--t-lg); overflow-wrap: anywhere; }

/* The headroom bar: an SVG whose fill width is set as an attribute, so the static page draws
 * it correctly with no style attribute and the script only moves geometry. */
.mfr-bar { display: block; width: 100%; height: 14px; }
.mfr-bar__track { fill: var(--page-sunk); }
.mfr-bar__fill--ok   { fill: var(--ok); }
.mfr-bar__fill--warn { fill: var(--warn); }
.mfr-bar__fill--bad  { fill: var(--danger); }
.mfr-bar__mark { stroke: var(--page-fg); stroke-width: 2; stroke-dasharray: 3 2;
                 vector-effect: non-scaling-stroke; }
.mfr-scale { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-2);
             font-size: var(--t-xs); color: var(--page-muted); }

/* ============================================================ messages and the ladder */

.mfr-msgs { display: grid; gap: var(--s-3); min-width: 0; }
.mfr-msgs:empty { display: none; }

.tk-table .mfr-over { color: var(--danger); }

@media print {
  .mfr-check { box-shadow: none; }
}
