/* Module: takeoff -- ranked review queue styles.
 *
 * Single tier: every rule is scoped under [data-module="takeoff"] because
 * this module renders everything inside its container -- it opens no
 * ctx.ui.modal({ content }) surfaces and mounts nothing on document.body,
 * so there is no unscoped modal-content tier.
 *
 * Tokens only, so both themes come free and there is no [data-theme="light"]
 * block in this file BY DESIGN -- every colour is a var() whose value already
 * flips, and the platform badge classes flip with it. The full set in use:
 *   --accent --border --border-strong --button-radius --error --font-mono
 *   --input-bg --panel --panel-2 --panel-radius --row-hover --shadow
 *   --studio-ink --success --text-primary --text-secondary --text-tertiary
 *   --transition-fn --transition-speed --warning --warning-soft
 * Adding a raw colour here would break light theme silently. If you add a
 * tint, layer it over --panel with a two-stop gradient (see .tk-banner-warn):
 * the -soft tokens are translucent, so used bare they let content scroll
 * through from underneath.
 */

[data-module="takeoff"] .tk-tabs {
  margin-bottom: 16px;
}

[data-module="takeoff"] .tk-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* -- banners ---------------------------------------------------------- */

[data-module="takeoff"] .tk-banner {
  padding: 10px 14px;
  border-radius: var(--button-radius);
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text-primary);
  font-size: 13px;
  margin: 8px 0;
}

[data-module="takeoff"] .tk-banner-warn {
  border-color: var(--warning);
  /* Two-stop gradient keeps a solid panel base under the translucent tint. */
  background: linear-gradient(var(--warning-soft), var(--warning-soft)), var(--panel);
}

/* -- latest-run card + coverage --------------------------------------- */

[data-module="takeoff"] .tk-run-card {
  padding: 20px;
}

[data-module="takeoff"] .tk-run-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-run-card-head h3 {
  margin: 0 0 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

[data-module="takeoff"] .tk-run-card-head p {
  margin: 0;
  font-size: 13px;
}

[data-module="takeoff"] .tk-check-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

/* Coverage lines are STATEMENTS OF RECORD, not prose: each is "<label> <value>".
 * Before, three or four of them stacked as identically-weighted grey sentences
 * and the eye could not tell where the coverage claim ended and the run
 * metadata began. The rule below gives the set a shared left edge so it reads
 * as one block, and .tk-cov-key carries the label weight. */
[data-module="takeoff"] .tk-cov-line {
  margin-top: 6px;
  padding-left: 10px;
  border-left: 2px solid var(--border);
  font-size: 13px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-cov-key {
  color: var(--text-secondary);
  font-weight: 600;
}

/* The first coverage line after the check chips opens the block. */
[data-module="takeoff"] .tk-check-chips + .tk-cov-line {
  margin-top: 10px;
}

[data-module="takeoff"] .tk-cov-grid {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 6px 12px;
  margin: 12px 0 0;
  font-size: 13px;
}

[data-module="takeoff"] .tk-cov-grid dt {
  color: var(--text-secondary);
  font-weight: 600;
}

[data-module="takeoff"] .tk-cov-grid dd {
  margin: 0;
  color: var(--text-primary);
}

[data-module="takeoff"] .tk-cov-list {
  margin: 0;
  padding-left: 18px;
}

/* -- report workspace ------------------------------------------------- */

[data-module="takeoff"] .tk-report-back {
  align-self: flex-start;
}

[data-module="takeoff"] .tk-report {
  min-width: 0;
  border-top: 1px solid var(--border-strong);
}

[data-module="takeoff"] .tk-report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 0 16px;
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-report-eyebrow {
  margin-bottom: 4px;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

[data-module="takeoff"] .tk-report-head h3 {
  margin: 0;
  font-size: 24px;
  line-height: 1.15;
}

[data-module="takeoff"] .tk-report-provenance {
  margin: 7px 0 0;
  font-size: 12px;
}

/* No TOP padding: the summary below now carries 12px of its own to centre its
 * label in a 44px target, and stacking the two put 21px of dead space above
 * the only line this strip shows when it is closed. The bottom keeps its 9px,
 * which is what separates the open body from the rule under it. */
[data-module="takeoff"] .tk-report-details {
  padding: 0 0 9px;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
}

/* THE FOURTH DISCLOSURE SUMMARY, on the same 44px touch minimum as the other
 * three. The report renders exactly four kinds of <summary> -- this one (Run
 * details), .tk-report-disclosure, .tk-fq-disclosure and .tk-fq-summary -- and
 * the earlier 44px fix reached the middle two. This was the smallest control
 * on the whole page at 18px: 12px text at the inherited line-height with no
 * vertical padding at all.
 *
 * Padded to 44 rather than min-height alone, so the label sits in the middle
 * of its target instead of at the top of it; 20px line-height + 12px top +
 * 12px bottom is the identical arithmetic .tk-report-disclosure > summary
 * already uses. `display` is deliberately NOT changed to flex: that would drop
 * `display: list-item` and take the disclosure triangle with it, and unlike
 * .tk-fq-summary this row has no worded "Show/Hide" label to fall back on. */
[data-module="takeoff"] .tk-report-details summary,
[data-module="takeoff"] .tk-report-coverage summary {
  box-sizing: border-box;
  min-height: 44px;
  width: fit-content;
  padding: 12px 0;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
}

[data-module="takeoff"] .tk-report-details summary:focus-visible,
[data-module="takeoff"] .tk-report-coverage summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

[data-module="takeoff"] .tk-report-details dl {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 5px 12px;
  margin: 10px 0 2px;
}

[data-module="takeoff"] .tk-report-details dt {
  color: var(--text-secondary);
  font-weight: 600;
}

[data-module="takeoff"] .tk-report-details dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  font-family: var(--font-mono);
}

[data-module="takeoff"] .tk-report-facts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-report-facts > div {
  min-width: 0;
  padding: 14px 12px;
  border-right: 1px solid var(--border);
}

[data-module="takeoff"] .tk-report-facts > div:first-child {
  padding-left: 0;
}

[data-module="takeoff"] .tk-report-facts > div:last-child {
  padding-right: 0;
  border-right: 0;
}

[data-module="takeoff"] .tk-report-facts dt {
  margin-bottom: 5px;
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

[data-module="takeoff"] .tk-report-facts dd {
  margin: 0;
  font-size: 17px;
  font-weight: 650;
  line-height: 1.2;
}

[data-module="takeoff"] .tk-report-facts dd span {
  display: block;
  margin-top: 5px;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.35;
}

/* The screenshot-evidence census: one evidence state per line, at a size that
   fits a whole state name on one line inside a fifth of the panel. `color:
   inherit` puts these back at the panel's VALUE colour -- they are the value,
   not the note the rule above styles -- rather than naming a second token. */
[data-module="takeoff"] .tk-report-facts dd span.tk-fact-state {
  margin-top: 0;
  color: inherit;
  font-size: 13px;
  font-weight: 650;
}

[data-module="takeoff"] .tk-report-facts dd span.tk-fact-state + span.tk-fact-state {
  margin-top: 3px;
}

[data-module="takeoff"] .tk-report-reliability {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
  font-size: 12.5px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-report-reliability strong {
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-report-coverage {
  padding: 11px 0;
  border-bottom: 1px solid var(--border-strong);
  font-size: 13px;
}

[data-module="takeoff"] .tk-report-coverage-body {
  padding: 5px 0 7px;
}

[data-module="takeoff"] .tk-report-review {
  padding-top: 22px;
}

[data-module="takeoff"] .tk-report-review-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 12px;
}

[data-module="takeoff"] .tk-report-review-head h4 {
  margin: 0;
  font-size: 18px;
}

[data-module="takeoff"] .tk-report-review-head p {
  max-width: 660px;
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
}

/* -- R3a: the first-page action summary ------------------------------- *
 *
 * The four bucket counts with a one-clause rule each, then the two sentences
 * that change how the list below them is read. Everything here is
 * always-visible by design; the argument behind each rule is one labelled
 * toggle away.
 */

[data-module="takeoff"] .tk-report-binding {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
}

[data-module="takeoff"] .tk-report-binding span {
  flex: 1 1 320px;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-bucket-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 12px;
}

[data-module="takeoff"] .tk-bucket-cell {
  min-width: 0;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
}

/* The bucket a reviewer is meant to start in is the only one accented. The
 * other three are deliberately identical: a colour ramp across four buckets
 * would read as a severity scale, and these are ORDER, not severity. */
[data-module="takeoff"] .tk-bucket-cell.tk-bucket-ready_to_fix {
  border-color: var(--accent);
}

[data-module="takeoff"] .tk-bucket-cell strong {
  display: block;
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  line-height: 1.1;
}

[data-module="takeoff"] .tk-bucket-cell span {
  display: block;
  margin-top: 3px;
  font-size: 12.5px;
  font-weight: 600;
}

[data-module="takeoff"] .tk-bucket-cell small {
  display: block;
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

[data-module="takeoff"] .tk-report-lede {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-report-lede span {
  font-size: 12px;
}

[data-module="takeoff"] .tk-report-disclosures {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 14px;
}

/* Every disclosure carries a real LABEL, never a bare chevron: the summary
 * says what opening it shows. */
[data-module="takeoff"] .tk-report-disclosure,
[data-module="takeoff"] .tk-fq-disclosure {
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
}

/* 44px MINIMUM AT EVERY WIDTH (.claude/rules/modules.md "Touch targets: 44px
 * minimum"). These summaries are the only way into the coverage, ordering and
 * gate panels, and at 9px of padding around 12px text they measured ~36px --
 * under the minimum on every phone, with no media rule to rescue them at 390px
 * or at 375px. The height is bought with line-height and symmetric padding
 * rather than `display: flex`, which would drop the native disclosure triangle
 * that these rows -- unlike .tk-fq-summary, which says "Show the evidence" in
 * words -- still rely on. box-sizing keeps min-height a real 44 rather than 44
 * plus padding. */
[data-module="takeoff"] .tk-report-disclosure > summary,
[data-module="takeoff"] .tk-fq-disclosure > summary {
  box-sizing: border-box;
  min-height: 44px;
  padding: 12px 13px;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
}

[data-module="takeoff"] .tk-report-disclosure > summary:focus-visible,
[data-module="takeoff"] .tk-fq-disclosure > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

[data-module="takeoff"] .tk-disclosure-body {
  padding: 0 13px 13px;
}

[data-module="takeoff"] .tk-disclosure-body > p {
  margin: 0 0 10px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-bucket-rules {
  margin: 0 0 14px;
}

[data-module="takeoff"] .tk-bucket-rules > div {
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr) 44px;
  gap: 10px;
  padding: 7px 0;
  border-top: 1px solid var(--border);
}

[data-module="takeoff"] .tk-bucket-rules dt {
  font-size: 12px;
  font-weight: 650;
}

[data-module="takeoff"] .tk-bucket-rules dd {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11.5px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-bucket-rule-count {
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

[data-module="takeoff"] .tk-order-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

[data-module="takeoff"] .tk-order-col {
  min-width: 0;
}

[data-module="takeoff"] .tk-order-col h6 {
  margin: 0;
  font-size: 12px;
}

[data-module="takeoff"] .tk-order-col p {
  margin: 4px 0 8px;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-order-col ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

[data-module="takeoff"] .tk-order-col li {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 4px 0;
  border-top: 1px solid var(--border);
  font-size: 11.5px;
}

[data-module="takeoff"] .tk-order-rank,
[data-module="takeoff"] .tk-order-mag {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="takeoff"] .tk-order-mag {
  text-align: right;
}

/* -- R3a: the queue itself -------------------------------------------- */

[data-module="takeoff"] .tk-bucket {
  padding-top: 16px;
}

[data-module="takeoff"] .tk-bucket-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border-strong);
}

[data-module="takeoff"] .tk-bucket-head h5 {
  margin: 0;
  font-size: 14px;
}

[data-module="takeoff"] .tk-bucket-head h5 span {
  color: var(--text-secondary);
  font-size: 11.5px;
  font-weight: 400;
}

[data-module="takeoff"] .tk-bucket-head > span {
  flex: none;
  color: var(--text-secondary);
  font-size: 11px;
}

[data-module="takeoff"] .tk-bucket-empty {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-fq-list {
  display: flex;
  flex-direction: column;
}

/* ONE ROW = the disclosure plus its decision control, side by side. The
 * control is a SIBLING of the <details>, never inside the <summary>: a form
 * control in a summary is swallowed by the disclosure toggle in several
 * browsers, and this is the one control that must work without opening
 * anything. */
[data-module="takeoff"] .tk-fq-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  /* START, not center: an EXPANDED row is a thousand pixels tall, and a
   * centred decision control floats into the middle of the evidence with
   * nothing beside it. Top-aligned it stays level with the headline it
   * decides on, open or closed. */
  align-items: start;
  border-bottom: 1px solid var(--border);
}

/* Overrides the .tk-finding CARD padding. That class is inherited on purpose --
 * it is what the disposition write path queries for, and its 3px left rail is
 * the decision-state signal (open accents, decided recedes) -- but its 14px/16px
 * card padding belongs to a card, and 40 of them make a queue twice the height
 * the accepted artifact measured. The rail is kept; the card padding is not.
 *
 * TWO CLASSES, DELIBERATELY: `.tk-finding` is declared LATER in this file at
 * equal specificity, so a single-class rule here loses the cascade and the card
 * padding survives silently. */
[data-module="takeoff"] .tk-fq-row.tk-finding {
  padding: 0 0 0 13px;
}

[data-module="takeoff"] .tk-fq {
  min-width: 0;
}

/* THE DEFAULT DISCLOSURE MARKER IS REMOVED, which is the opposite of hiding
 * the affordance: this row says "Show the evidence" IN WORDS, which is the
 * rule the accepted artifact set -- a real label, never a bare chevron.
 * Keeping the triangle as well cost 31px of leading inline space, and at 390px
 * that pushed the evidence chip 10px past the viewport, so the marker was both
 * redundant and the sole cause of the phone overflow. */
/* AND IT MEETS THE 44px TOUCH MINIMUM (.claude/rules/modules.md), like the two
 * secondary disclosures further up this file. That rule was applied to
 * .tk-report-disclosure and .tk-fq-disclosure and NOT to this one -- the
 * primary finding disclosure, and the most-used control on the page: 13px text
 * at 1.45 line-height inside 5px of vertical padding measured 31.8px, and the
 * phone rule below then took another pixel off the bottom. The two panels
 * nobody opens twice were reachable and the row every reviewer opens forty
 * times was not.
 *
 * box-sizing so min-height means 44 rather than 44 PLUS the padding, and
 * align-content (not align-items) to centre the content in the taller box:
 * align-items still owns how the headline and the chips sit relative to each
 * OTHER, which has to stay `baseline` or the chip rides up off the text.
 * align-content applies here because the container is flex-wrap: wrap -- it is
 * inert only on a nowrap container, single line or not.
 *
 * 44 is also what the decision cell beside it already measures (a 36px select
 * in 4px of padding), so this LEVELS the two halves of a closed row rather
 * than just growing one of them. */
[data-module="takeoff"] .tk-fq-summary {
  display: flex;
  box-sizing: border-box;
  min-height: 44px;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  align-content: center;
  justify-content: space-between;
  padding: 5px 0;
  cursor: pointer;
  list-style: none;
}

[data-module="takeoff"] .tk-fq-summary::-webkit-details-marker {
  display: none;
}

[data-module="takeoff"] .tk-fq-summary::marker {
  content: "";
}

[data-module="takeoff"] .tk-fq-summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

[data-module="takeoff"] .tk-fq-head {
  display: flex;
  flex: 1 1 320px;
  gap: 9px;
  min-width: 0;
}

[data-module="takeoff"] .tk-fq-pos {
  flex: none;
  min-width: 20px;
  color: var(--text-tertiary);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-fq-headline {
  min-width: 0;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

/* The chips sit in a scannable column at reading width and drop under the
 * headline when there is no room -- they WRAP rather than truncate, because a
 * clipped evidence state is worse than a two-line row. */
[data-module="takeoff"] .tk-fq-meta {
  display: flex;
  /* It may SHRINK and it may wrap to its own line; what it may never do is be
   * clipped. `flex: none` refused to shrink and so pushed the chip past the
   * viewport instead of dropping it under the headline. */
  flex: 0 1 auto;
  min-width: 0;
  flex-wrap: wrap;
  gap: 7px;
  align-items: baseline;
}

[data-module="takeoff"] .tk-state {
  display: inline-block;
  padding: 2px 7px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: 10.5px;
  white-space: nowrap;
}

/* The three states that mean "you can see the drawn population" read as
 * ordinary; the three that mean "you cannot" are marked. NONE of them uses the
 * error tone: a refused crop is a bounded statement about evidence, not a
 * failure of the run. */
[data-module="takeoff"] .tk-state-complete {
  border-color: var(--success);
  color: var(--success);
}

[data-module="takeoff"] .tk-state-partial,
[data-module="takeoff"] .tk-state-representative {
  border-color: var(--warning);
  color: var(--warning);
}

/* The bucket-derived row prose. Both the flag and the panel caveat are ALWAYS
 * in the DOM and hidden when they do not apply, so the in-place regrouping
 * after a disposition write has a node to correct. Both state their hidden
 * case explicitly rather than leaning on the UA sheet, which the first author
 * `display` declaration added here would silently outrank. */
[data-module="takeoff"] .tk-fq-flag {
  color: var(--text-tertiary);
  font-size: 10.5px;
}

[data-module="takeoff"] .tk-fq-flag[hidden],
[data-module="takeoff"] .tk-fq-caveat[hidden] {
  display: none;
}

[data-module="takeoff"] .tk-fq-more {
  color: var(--accent);
  font-size: 11px;
  white-space: nowrap;
}

[data-module="takeoff"] .tk-fq[open] .tk-fq-more {
  color: var(--text-secondary);
}

/* The closed/open halves of that label. Exactly one is displayed at a time,
 * and display:none keeps the other out of the accessibility tree as well as
 * off the screen -- so a screen reader hears one label, never both. */
[data-module="takeoff"] .tk-fq-more-hide,
[data-module="takeoff"] .tk-fq[open] .tk-fq-more-show {
  display: none;
}

[data-module="takeoff"] .tk-fq[open] .tk-fq-more-hide {
  display: inline;
}

[data-module="takeoff"] .tk-fq-panel {
  padding: 4px 0 16px 29px;
}

[data-module="takeoff"] .tk-fq-dec {
  display: flex;
  flex: none;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 4px 0;
}

[data-module="takeoff"] .tk-fq-caveat {
  margin: 0 0 8px;
  font-size: 12.5px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-fq-claim {
  max-width: 900px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-fq-statement,
[data-module="takeoff"] .tk-fq-gate-detail {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
  /* The crop layer's refusals and the engine's reasons are multi-line by
   * design and every word is load-bearing, so they wrap and scroll -- never a
   * clamp, an ellipsis or a "show more" that hides the tail. */
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-fq-reason {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-fq-gate {
  margin: 0;
  font-size: 12px;
}

[data-module="takeoff"] .tk-fq-gate code {
  font-family: var(--font-mono);
  font-size: 11.5px;
}

[data-module="takeoff"] .tk-fq-overcount {
  margin: 8px 0 0;
  color: var(--warning);
  font-size: 12px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-fq-facts {
  margin: 0;
}

[data-module="takeoff"] .tk-fq-facts > div {
  display: grid;
  grid-template-columns: 175px minmax(0, 1fr);
  gap: 10px;
  padding: 5px 0;
  border-top: 1px solid var(--border);
}

[data-module="takeoff"] .tk-fq-facts dt {
  color: var(--text-secondary);
  font-size: 11.5px;
}

[data-module="takeoff"] .tk-fq-facts dd {
  margin: 0;
  font-size: 11.5px;
  overflow-wrap: anywhere;
}

/* THE COUNTED CONTRIBUTIONS. R3a renders no crop, so this table IS the
 * population evidence: one row per marked instance, its stored callout label,
 * what it contributes, and the model coordinate it was measured at. */
[data-module="takeoff"] .tk-contrib-wrap {
  min-width: 0;
  margin-top: 10px;
  overflow-x: auto;
}

[data-module="takeoff"] .tk-contrib {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

[data-module="takeoff"] .tk-contrib caption {
  padding-bottom: 6px;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
  text-align: left;
}

[data-module="takeoff"] .tk-contrib th {
  padding: 4px 7px 4px 0;
  border-bottom: 1px solid var(--border);
  color: var(--text-secondary);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

[data-module="takeoff"] .tk-contrib td {
  padding: 4px 7px 4px 0;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  overflow-wrap: anywhere;
}

/* The index and the sheet name are IDENTIFIERS, not prose: wrapping them turns
 * mark 10 into "1 / 0" over two lines and LD-102 into "LD- / 102", which reads
 * as two different values. They hold their line; the table scrolls instead. */
[data-module="takeoff"] .tk-contrib td:first-child,
[data-module="takeoff"] .tk-contrib th:first-child {
  width: 26px;
  white-space: nowrap;
}

[data-module="takeoff"] .tk-contrib td:nth-child(4) {
  white-space: nowrap;
}

[data-module="takeoff"] .tk-contrib-coord {
  font-family: var(--font-mono);
  font-size: 10px;
  white-space: nowrap;
}

[data-module="takeoff"] .tk-fq-note-row {
  margin-top: 14px;
}

[data-module="takeoff"] .tk-report-filters {
  display: flex;
  gap: 6px;
  padding: 10px 0;
  overflow-x: auto;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  scrollbar-width: thin;
}

[data-module="takeoff"] .tk-report-filter {
  flex: none;
}

[data-module="takeoff"] .tk-report-filter[aria-pressed="true"] {
  border-color: var(--accent);
  color: var(--text-primary);
}

[data-module="takeoff"] .tk-report-evidence-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.35fr) minmax(0, 0.9fr);
  margin-top: 16px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-report-evidence-grid > section {
  min-width: 0;
  padding: 13px 12px;
  border-right: 1px solid var(--border);
}

[data-module="takeoff"] .tk-report-evidence-grid > section:first-child {
  padding-left: 0;
}

[data-module="takeoff"] .tk-report-evidence-grid > section:last-child {
  padding-right: 0;
  border-right: 0;
}

[data-module="takeoff"] .tk-report-evidence-grid > section > h6 {
  margin: 0 0 8px;
  color: var(--text-secondary);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

[data-module="takeoff"] .tk-report-evidence-grid .tk-ev-side {
  min-width: 0;
}

[data-module="takeoff"] .tk-report-evidence-grid .tk-ev-empty {
  min-height: 70px;
  padding: 10px;
}

[data-module="takeoff"] .tk-report-page-evidence strong {
  display: block;
  font-size: 18px;
}

[data-module="takeoff"] .tk-report-page-evidence p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-report-guidance {
  margin: 12px 0 0;
  font-size: 12.5px;
}

/* Schedule-provenance facts: flex-wrapping labelled spans, never a table --
 * the run panel already collapses to one column on a phone, so a fact that
 * does not fit just wraps onto the next line.
 *
 * A bare gap is NOT enough to bind a label to its value: across a wrap, the
 * label of fact N+1 sits the same distance from the value of fact N as from
 * its own, and the pairs stop being readable. Each fact gets its own chip
 * bounds, so the binding survives any wrap. */
[data-module="takeoff"] .tk-prov-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

[data-module="takeoff"] .tk-prov-fact {
  /* Content hashes have no break opportunities of their own. */
  overflow-wrap: anywhere;
  padding: 2px 8px;
  border-radius: var(--button-radius);
  background: var(--input-bg);
  border: 1px solid var(--border);
  min-width: 0;
}

[data-module="takeoff"] .tk-prov-label {
  color: var(--text-secondary);
  font-weight: 600;
}

/* A hash is an identifier, not a sentence -- give it the mono face so a
 * character-level difference between two runs is actually visible. */
[data-module="takeoff"] .tk-prov-mono {
  font-family: var(--font-mono);
  font-size: 0.95em;
}

/* -- queue ------------------------------------------------------------- */

[data-module="takeoff"] .tk-queue-stats {
  font-size: 13px;
  margin: 4px 0;
}

[data-module="takeoff"] .tk-group-head {
  margin: 16px 0 4px;
  font-size: 15px;
}

/* -- finding cards ----------------------------------------------------- */

[data-module="takeoff"] .tk-finding {
  padding: 14px 16px;
  /* The rail below carries decision state. Declared on the base class so
   * every card reserves the same width and a state change never reflows. */
  border-left: 3px solid transparent;
  /* Follows the recede, which is now a surface change rather than a fade. */
  transition: background var(--transition-speed) var(--transition-fn);
}

/* Disposition state, made VISIBLE. These classes were emitted and live-toggled
 * from the start but never styled, so a confirmed finding and an untouched one
 * were pixel-identical -- on a queue whose whole job is drive-to-zero, that is
 * the difference between "9 open" being a number and being a fact you can see.
 * Open is the only state that still wants attention, so it is the only one at
 * full strength. */
[data-module="takeoff"] .tk-status-open {
  border-left-color: var(--accent);
}

[data-module="takeoff"] .tk-status-confirmed {
  border-left-color: var(--warning);
}

[data-module="takeoff"] .tk-status-fixed_in_cad {
  border-left-color: var(--success);
}

[data-module="takeoff"] .tk-status-dismissed {
  border-left-color: var(--border-strong);
}

/* Resolved rows recede onto the RECESSED SURFACE, not by fading.
 *
 * This was `opacity: 0.72` on the whole card, which was wrong: opacity
 * composites every 12-13px secondary label, reason, timestamp and evidence
 * string along with the decoration, dropping secondary text to roughly 2.86:1
 * in light theme and 4.04:1 in dark -- both under the 4.5:1 floor for normal
 * text. Hover restored it, which is no help on touch and no help to anyone
 * reading rather than pointing. The rail already carries the state signal, so
 * the surface can do the receding and every string stays at full contrast.
 * (Codex review on the design-pass PR.) */
[data-module="takeoff"] .tk-status-confirmed,
[data-module="takeoff"] .tk-status-dismissed,
[data-module="takeoff"] .tk-status-fixed_in_cad {
  background: var(--panel-2);
}

/* A card that will leave the queue once focus goes elsewhere. Without a signal
 * the row simply vanished a moment later and read as a glitch. */
[data-module="takeoff"] .tk-finding[data-tk-pending-remove] {
  background: linear-gradient(var(--row-hover), var(--row-hover)), var(--panel);
}

[data-module="takeoff"] .tk-finding-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* Rank is the queue's ONLY priority signal (severity is stored but is 'ranked'
 * for every row today), so it gets to look like one instead of trailing grey. */
[data-module="takeoff"] .tk-rank {
  font-weight: 700;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  padding: 1px 7px;
  font-size: 12px;
  flex: none;
}

/* flex-wrap belongs on the BASE rule, not only in the phone media query below.
 * The pair-sense caption sets flex-basis 100% so it sits on its own line, and
 * without wrapping here that basis cannot take effect at desktop width: the
 * caption stayed on the same flex line and squeezed the two numbers it exists to
 * explain, so the intended layout only ever appeared on a phone. */
[data-module="takeoff"] .tk-values {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-top: 8px;
  font-size: 14px;
}

/* Drawn vs Scheduled is the comparison the whole card exists to make; the
 * numbers should not read as body copy. */
[data-module="takeoff"] .tk-value {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

[data-module="takeoff"] .tk-value-label {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
  margin-right: 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* What the pair MEANS, for the three kinds where an identical pair can sit over
 * a real finding. Deliberately NOT bold and NOT tabular: it is a sentence about
 * the numbers, not another number, and giving it the numbers' weight would have
 * a reader comparing three things instead of reading two and their caption. It
 * takes the whole remaining row so a long clause wraps under the pair rather
 * than pushing the pair off a narrow card. Colour comes from the shared
 * text-secondary utility on the element, so both themes follow the token. */
[data-module="takeoff"] .tk-value-sense {
  flex: 1 1 100%;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

[data-module="takeoff"] .tk-reason {
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
}

/* The phantom-finding warning. It sits among the reason paragraphs but it is the
 * one that says this card may not be about its own subject, so it takes primary
 * text and a leading rule rather than the secondary grey the engine reason uses
 * -- a warning in the same weight as the sentence above it is a warning nobody
 * reads before reaching the Decision control. Tokens only, so both themes
 * follow. */
[data-module="takeoff"] .tk-phantom-note {
  color: var(--text-primary);
  border-left: 3px solid var(--border);
  padding-left: 10px;
}

[data-module="takeoff"] .tk-evidence-row {
  margin-top: 10px;
}

/* -- the two sides of the reconciliation ------------------------------- */

/* Drawn left, scheduled right, EQUAL columns: neither side is subordinate.
 * The whole point of the card is that you can read both sources and decide
 * which one is wrong. */
[data-module="takeoff"] .tk-ev {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  margin-top: 12px;
}

[data-module="takeoff"] .tk-ev-side {
  min-width: 0;
}

[data-module="takeoff"] .tk-ev-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-ev-head .count {
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-tertiary);
}

/* "Nothing was found" is a STATEMENT, not a blank. The dashed bound says the
 * panel rendered and had nothing to put in it. */
[data-module="takeoff"] .tk-ev-empty {
  border: 1px dashed var(--border);
  border-radius: var(--button-radius);
  padding: 14px;
  font-size: 12px;
  color: var(--text-secondary);
  display: grid;
  place-items: center;
  min-height: 84px;
  text-align: center;
}

/* The schedule rows in the studio's own column order. Mono, because these are
 * the workbook's cells and should read as cells. */
[data-module="takeoff"] .tk-sched {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
  overflow-x: auto;
  font-family: var(--font-mono);
  font-size: 11px;
}

[data-module="takeoff"] .tk-sched table {
  width: 100%;
  border-collapse: collapse;
}

[data-module="takeoff"] .tk-sched th {
  text-align: left;
  padding: 5px 7px;
  font-size: 9.5px;
  letter-spacing: 0.04em;
  font-weight: 700;
  color: var(--text-secondary);
  background: var(--input-bg);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

[data-module="takeoff"] .tk-sched td {
  padding: 4px 7px;
  border-bottom: 1px solid var(--border);
  color: var(--text-primary);
  white-space: nowrap;
}

[data-module="takeoff"] .tk-sched tr:last-child td {
  border-bottom: none;
}

/* A continuation row has no channel number BY DESIGN, so the dash in that
 * cell is deliberate -- dimmed, rather than reading as a missing value. */
[data-module="takeoff"] .tk-sched tr.cont td:first-child {
  color: var(--text-tertiary);
  font-style: italic;
}

[data-module="takeoff"] .tk-sched-cap {
  font-size: 10.5px;
  padding: 5px 7px;
  border-top: 1px solid var(--border);
  color: var(--text-secondary);
  white-space: normal;
}

[data-module="takeoff"] .tk-evidence {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

[data-module="takeoff"] .tk-evidence[hidden] {
  display: none;
}

[data-module="takeoff"] .tk-evidence li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}

[data-module="takeoff"] .tk-evidence code {
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 6px;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

/* -- disposition controls ---------------------------------------------- */

[data-module="takeoff"] .tk-disp-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-disp-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-disp-select {
  width: auto;
  min-width: 140px;
}

[data-module="takeoff"] .tk-disp-note {
  flex: 1 1 200px;
  min-width: 160px;
}

[data-module="takeoff"] .tk-disp-meta {
  font-size: 12px;
  color: var(--text-secondary);
  margin-left: auto;
}

/* The note field commits on blur, not per keystroke, so without this the only
 * feedback for a write was the timestamp changing -- easy to miss, and
 * indistinguishable from "nothing happened". */
[data-module="takeoff"] .tk-disp-saving {
  color: var(--text-tertiary);
  font-style: italic;
}

/* -- runs table -------------------------------------------------------- */

[data-module="takeoff"] .tk-runs-table td {
  vertical-align: top;
}

/* -- spinners ---------------------------------------------------------- */

/* Was three inline style="margin: ..." attributes in index.js. */
[data-module="takeoff"] .tk-spinner {
  margin: 48px auto;
}

[data-module="takeoff"] .tk-spinner-inline {
  margin: 32px auto;
}

/* A count the Runs view has not checked against stored findings. */
[data-module="takeoff"] .tk-unverified {
  color: var(--text-tertiary);
  font-weight: 600;
}

[data-module="takeoff"] .tk-runs-note {
  font-size: 12px;
  margin: 8px 0 0;
}

/* -- export: the reconciliation report --------------------------------- */
/*
 * The options panel is anchored to the button INSIDE the module container --
 * not a ctx.ui.modal, whose content is body-mounted on .strata-overlay and
 * would fall outside [data-module="takeoff"], missing every rule in this file.
 * Keeping it in-container is what lets this module stay single-tier.
 */

[data-module="takeoff"] .tk-export-wrap {
  position: relative;
}

[data-module="takeoff"] .tk-export-panel {
  position: absolute;
  right: 0;
  top: 38px;
  width: 290px;
  z-index: 5;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow);
  padding: 14px;
  text-align: left;
}

[data-module="takeoff"] .tk-export-panel h4 {
  margin: 0 0 10px;
  font-size: 13px;
}

[data-module="takeoff"] .tk-export-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  margin-bottom: 8px;
  color: var(--text-primary);
  cursor: pointer;
}

[data-module="takeoff"] .tk-export-row input {
  accent-color: var(--accent);
  flex: none;
}

/* Coverage is not a preference -- the control states it, and says so.
 * Rendered as an ARIA checkbox rather than a `disabled` input: `disabled`
 * takes the control out of the tab ring, so a keyboard or screen-reader user
 * never reached the control OR the explanation beneath it. */
[data-module="takeoff"] .tk-export-locked {
  cursor: default;
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-export-locked:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 3px;
}

/* Checked-checkbox glyph for the locked control. */
[data-module="takeoff"] .tk-lockbox {
  position: relative;
  flex: none;
  width: 13px;
  height: 13px;
  border: 1px solid var(--border-strong);
  border-radius: 3px;
  background: var(--input-bg);
}

[data-module="takeoff"] .tk-lockbox::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.5px;
  width: 3px;
  height: 7px;
  border: solid var(--text-secondary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* --text-tertiary measures 3.5:1 (dark) and 2.5:1 (light) against the panel,
 * below the 4.5:1 minimum -- and these lines carry the per-scope finding
 * counts and the whole justification for the locked coverage control, so they
 * are load-bearing, not decoration. --text-secondary clears the bar. */
[data-module="takeoff"] .tk-export-sub {
  font-size: 11.5px;
  color: var(--text-secondary);
  margin: -4px 0 10px 22px;
}

[data-module="takeoff"] .tk-export-target {
  margin: -6px 0 10px;
  font-size: 11.5px;
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-export-foot {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

[data-module="takeoff"] .tk-export-count {
  font-size: 11.5px;
  color: var(--text-secondary);
  margin-right: auto;
}

/* -- staged takeoff setup -------------------------------------------- */

[data-module="takeoff"] .tk-setup,
[data-module="takeoff"] .tk-setup * {
  letter-spacing: 0;
}

[data-module="takeoff"] .tk-setup {
  min-width: 0;
}

[data-module="takeoff"] .tk-setup-lock {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

[data-module="takeoff"] .tk-submit-status {
  margin: 12px 18px 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-setup-progress {
  padding: 14px 18px 16px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
}

[data-module="takeoff"] .tk-setup-summary {
  margin: 0 0 10px;
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-setup-scroll {
  min-width: 0;
}

[data-module="takeoff"] .tk-setup-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

[data-module="takeoff"] .tk-setup-step {
  position: relative;
  min-width: 0;
  color: var(--text-tertiary);
  font-size: 12px;
  line-height: 1.25;
}

[data-module="takeoff"] .tk-setup-step > button,
[data-module="takeoff"] .tk-setup-step > div {
  display: block;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
}

[data-module="takeoff"] .tk-setup-step > button {
  cursor: pointer;
}

[data-module="takeoff"] .tk-setup-step:not(:last-child)::after {
  position: absolute;
  top: 12px;
  right: 0;
  left: 29px;
  height: 1px;
  background: var(--border-strong);
  content: "";
}

[data-module="takeoff"] .tk-setup-marker {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: 25px;
  height: 25px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  background: var(--panel-2);
  color: currentColor;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

[data-module="takeoff"] .tk-setup-name {
  display: block;
  min-width: 0;
  margin-top: 5px;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-setup-step.is-complete {
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-setup-step.is-complete .tk-setup-marker {
  border-color: var(--success);
  color: var(--success);
}

[data-module="takeoff"] .tk-setup-step.is-current {
  color: var(--text-primary);
  font-weight: 700;
}

[data-module="takeoff"] .tk-setup-step.is-current .tk-setup-marker {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--studio-ink);
}

[data-module="takeoff"] .tk-setup-workspace {
  min-width: 0;
  padding: 22px 18px 26px;
}

[data-module="takeoff"] .tk-setup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

[data-module="takeoff"] .tk-setup-head h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.25;
}

[data-module="takeoff"] .tk-setup-head p {
  max-width: 720px;
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-setup-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(250px, 0.65fr);
  gap: 24px;
}

[data-module="takeoff"] .tk-setup-main,
[data-module="takeoff"] .tk-setup-side,
[data-module="takeoff"] .tk-setup-section {
  min-width: 0;
}

[data-module="takeoff"] .tk-setup-side {
  padding-left: 22px;
  border-left: 1px solid var(--border);
}

[data-module="takeoff"] .tk-setup-section {
  padding: 0 0 22px;
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-setup-section + .tk-setup-section {
  padding-top: 20px;
}

[data-module="takeoff"] .tk-setup-section:last-child {
  border-bottom: 0;
}

[data-module="takeoff"] .tk-setup-section h4,
[data-module="takeoff"] .tk-setup-side h4 {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.35;
}

[data-module="takeoff"] .tk-folder-selection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  min-height: 48px;
  padding: 11px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--button-radius);
  background: var(--input-bg);
}

[data-module="takeoff"] .tk-folder-path {
  min-width: 0;
  overflow-wrap: anywhere;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-folder-detail {
  display: block;
  margin-top: 3px;
  color: var(--text-secondary);
  font-family: inherit;
}

[data-module="takeoff"] .tk-setup-label {
  display: block;
  margin-bottom: 4px;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
}

[data-module="takeoff"] .tk-folder-selection p {
  margin: 3px 0 0;
  font-size: 12px;
  line-height: 1.4;
}

[data-module="takeoff"] .tk-inventory {
  min-width: 0;
  overflow-x: auto;
  border-top: 1px solid var(--border);
}

[data-module="takeoff"] .tk-inventory-table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}

[data-module="takeoff"] .tk-inventory-table th,
[data-module="takeoff"] .tk-inventory-table td {
  padding: 10px 9px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: middle;
}

[data-module="takeoff"] .tk-inventory-table th {
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  text-transform: none;
}

[data-module="takeoff"] .tk-inventory-table th:first-child,
[data-module="takeoff"] .tk-inventory-table td:first-child {
  width: 44px;
  text-align: center;
}

[data-module="takeoff"] .tk-inventory-table th:last-child,
[data-module="takeoff"] .tk-inventory-table td:last-child {
  width: 132px;
}

[data-module="takeoff"] .tk-inventory-table input[type="checkbox"],
[data-module="takeoff"] .tk-machine-choice input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
}

[data-module="takeoff"] .tk-inventory-check {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

[data-module="takeoff"] .tk-inventory-file {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text-primary);
}

[data-module="takeoff"] .tk-inventory-file strong,
[data-module="takeoff"] .tk-inventory-file span {
  display: block;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-inventory-file strong {
  font-weight: 600;
}

[data-module="takeoff"] .tk-inventory-file span,
[data-module="takeoff"] .tk-inventory-meta,
[data-module="takeoff"] .tk-inventory-role {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-inventory-file span,
[data-module="takeoff"] .tk-inventory-meta {
  margin-top: 2px;
}

[data-module="takeoff"] .tk-inventory-role.is-target {
  color: var(--success);
  font-weight: 700;
}

[data-module="takeoff"] .tk-file-order {
  display: inline-flex;
  width: 24px;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

[data-module="takeoff"] .tk-file-order + .tk-icon-btn,
[data-module="takeoff"] .tk-icon-btn + .tk-icon-btn {
  margin-left: 5px;
}

[data-module="takeoff"] .tk-file-order-value {
  min-width: 24px;
  color: var(--text-secondary);
  font-size: 12px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

[data-module="takeoff"] .tk-icon-btn {
  display: inline-flex;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
  color: var(--text-primary);
}

[data-module="takeoff"] .tk-icon-btn svg {
  width: 16px;
  height: 16px;
  pointer-events: none;
}

[data-module="takeoff"] .tk-icon-btn:disabled {
  color: var(--text-tertiary);
  cursor: not-allowed;
}

[data-module="takeoff"] .tk-setup-facts {
  margin: 0;
}

[data-module="takeoff"] .tk-setup-fact {
  display: grid;
  grid-template-columns: minmax(96px, 0.8fr) minmax(0, 1.2fr);
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
}

[data-module="takeoff"] .tk-setup-fact dt {
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-setup-fact dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

[data-module="takeoff"] .tk-setup-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-setup-status::before {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

[data-module="takeoff"] .tk-setup-status.is-ready,
[data-module="takeoff"] .tk-setup-status.is-success {
  color: var(--success);
}

[data-module="takeoff"] .tk-setup-status.is-warning {
  color: var(--warning);
}

[data-module="takeoff"] .tk-setup-status.is-error {
  color: var(--error);
}

[data-module="takeoff"] .tk-setup-status.is-info {
  color: var(--accent);
}

[data-module="takeoff"] .tk-setup-banner {
  margin-top: 14px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: var(--panel-2);
  color: var(--text-primary);
  font-size: 12.5px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-setup-banner.is-warning {
  border-left-color: var(--warning);
}

[data-module="takeoff"] .tk-setup-banner.is-error {
  border-left-color: var(--error);
}

[data-module="takeoff"] .tk-setup-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 22px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-setup-actions-end {
  display: flex;
  gap: 8px;
  margin-left: auto;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-machine-list {
  border-top: 1px solid var(--border);
}

[data-module="takeoff"] .tk-machine-choice {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 64px;
  padding: 10px 8px;
  border-bottom: 1px solid var(--border);
  color: var(--text-primary);
  cursor: pointer;
}

[data-module="takeoff"] .tk-machine-choice:hover {
  background: var(--row-hover);
}

[data-module="takeoff"] .tk-machine-choice.is-selected,
[data-module="takeoff"] .tk-machine-choice:has(input:checked) {
  box-shadow: inset 3px 0 0 var(--accent);
  background: var(--panel-2);
}

[data-module="takeoff"] .tk-machine-choice.is-disabled,
[data-module="takeoff"] .tk-machine-choice:has(input:disabled) {
  color: var(--text-secondary);
  cursor: not-allowed;
}

[data-module="takeoff"] .tk-machine-meta {
  min-width: 0;
}

[data-module="takeoff"] .tk-machine-meta strong,
[data-module="takeoff"] .tk-machine-meta small,
[data-module="takeoff"] .tk-machine-meta > span {
  display: block;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-machine-meta small,
[data-module="takeoff"] .tk-machine-meta > span {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.4;
}

[data-module="takeoff"] .tk-machine-state {
  justify-self: end;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

[data-module="takeoff"] .tk-processing-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  padding: 18px 0 20px 18px;
  border-left: 4px solid var(--accent);
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-processing-hero.is-warning {
  border-left-color: var(--warning);
}

[data-module="takeoff"] .tk-processing-hero.is-error {
  border-left-color: var(--error);
}

[data-module="takeoff"] .tk-processing-hero.is-failure {
  border-left-color: var(--error);
}

[data-module="takeoff"] .tk-processing-hero h3 {
  margin: 0;
  font-size: 22px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-processing-hero p {
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

[data-module="takeoff"] .tk-processing-id {
  color: var(--text-secondary);
  font-family: var(--font-mono);
  font-size: 11px;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-processing-axes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--border);
}

[data-module="takeoff"] .tk-processing-axis {
  min-width: 0;
  padding: 16px 14px;
  border-right: 1px solid var(--border);
}

[data-module="takeoff"] .tk-processing-axis:last-child {
  border-right: 0;
}

[data-module="takeoff"] .tk-processing-label {
  display: block;
  margin-bottom: 5px;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

[data-module="takeoff"] .tk-processing-value {
  display: block;
  overflow-wrap: anywhere;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

[data-module="takeoff"] .tk-activity {
  min-width: 0;
  margin-top: 20px;
}

[data-module="takeoff"] .tk-activity h4 {
  margin: 0 0 8px;
  font-size: 14px;
}

[data-module="takeoff"] .tk-activity .tk-setup-head {
  margin-bottom: 8px;
}

[data-module="takeoff"] .tk-activity-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

[data-module="takeoff"] .tk-activity-event {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
  padding: 9px 0;
  border-top: 1px solid var(--border);
  font-size: 13px;
  line-height: 1.45;
}

[data-module="takeoff"] .tk-activity-time {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="takeoff"] .tk-activity-message {
  min-width: 0;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* -- dispatch --------------------------------------------------------- */

[data-module="takeoff"] .tk-header-actions {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-dispatch-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

[data-module="takeoff"] .tk-dispatch {
  padding: 18px;
}

[data-module="takeoff"] .tk-dispatch-head,
[data-module="takeoff"] .tk-jobs-head,
[data-module="takeoff"] .tk-job-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-dispatch-head h3,
[data-module="takeoff"] .tk-jobs-head h3,
[data-module="takeoff"] .tk-job-card h4 {
  margin: 0 0 4px;
}

[data-module="takeoff"] .tk-dispatch-head p,
[data-module="takeoff"] .tk-jobs-head p,
[data-module="takeoff"] .tk-job-card-head p {
  margin: 0;
  font-size: 13px;
}

[data-module="takeoff"] .tk-dispatch-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

[data-module="takeoff"] .tk-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

[data-module="takeoff"] .tk-field-wide {
  grid-column: 1 / -1;
}

[data-module="takeoff"] .tk-field label {
  font-weight: 600;
  font-size: 13px;
}

[data-module="takeoff"] .tk-field input,
[data-module="takeoff"] .tk-field select {
  min-height: 38px;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
  color: var(--text-primary);
  padding: 8px 10px;
}

[data-module="takeoff"] .tk-field p {
  margin: 0;
  font-size: 12.5px;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-checkline {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 38px;
  font-size: 12.5px;
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-checkline input {
  flex: none;
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
}

[data-module="takeoff"] .tk-inline-control {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

[data-module="takeoff"] .tk-inline-control input {
  flex: 1 1 auto;
}

[data-module="takeoff"] .tk-box-picks {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

[data-module="takeoff"] .tk-box-pick-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
}

[data-module="takeoff"] .tk-box-pick-copy {
  min-width: 0;
}

[data-module="takeoff"] .tk-box-pick-label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-secondary);
}

[data-module="takeoff"] .tk-box-pick-path,
[data-module="takeoff"] .tk-box-pick-empty {
  margin-top: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-box-pick-empty {
  color: var(--text-secondary);
  font-weight: 500;
}

[data-module="takeoff"] .tk-box-pick-card p {
  margin-top: 6px;
}

[data-module="takeoff"] .tk-box-pick-actions {
  flex: 0 0 auto;
}

[data-module="takeoff"] .tk-dispatch-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  margin: 16px 0 0;
  list-style: none;
}

[data-module="takeoff"] .tk-dispatch-checks li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  font-size: 12.5px;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-dispatch-checks span {
  flex: none;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--warning);
}

[data-module="takeoff"] .tk-dispatch-checks .is-ok span {
  background: var(--success);
}

[data-module="takeoff"] .tk-dispatch-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
  flex-wrap: wrap;
}

[data-module="takeoff"] .tk-dispatch-result {
  margin-top: 16px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
}

[data-module="takeoff"] .tk-dispatch-result dl,
[data-module="takeoff"] .tk-job-axes {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 6px 10px;
  margin: 10px 0;
  font-size: 13px;
}

[data-module="takeoff"] .tk-dispatch-result dt,
[data-module="takeoff"] .tk-job-axes dt {
  color: var(--text-secondary);
  font-weight: 600;
}

[data-module="takeoff"] .tk-dispatch-result dd,
[data-module="takeoff"] .tk-job-axes dd {
  margin: 0;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-jobs {
  padding: 18px;
}

[data-module="takeoff"] .tk-job-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

[data-module="takeoff"] .tk-job-card {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  padding: 14px;
  min-width: 0;
}

[data-module="takeoff"] .tk-job-progress {
  margin: 8px 0 0;
  font-size: 13px;
}

[data-module="takeoff"] .tk-job-message {
  margin-top: 10px;
}

[data-module="takeoff"] .tk-job-missing {
  margin: 0;
  padding-left: 18px;
  font-size: 12.5px;
  overflow-wrap: anywhere;
}

[data-module="takeoff"] .tk-job-message-label {
  color: var(--text-secondary);
  font-weight: 600;
  font-size: 12.5px;
  margin-bottom: 4px;
}

[data-module="takeoff"] .tk-job-verbatim {
  margin: 0;
  max-height: 220px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
  color: var(--text-primary);
  padding: 10px;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.45;
}

/* -- staged takeoff narrow layout ------------------------------------ */

@media (max-width: 960px) {
  [data-module="takeoff"] .tk-report-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-module="takeoff"] .tk-report-facts > div {
    padding: 12px;
    border-bottom: 1px solid var(--border);
  }

  [data-module="takeoff"] .tk-report-facts > div:first-child {
    padding-left: 12px;
  }

  [data-module="takeoff"] .tk-report-facts > div:nth-child(even) {
    border-right: 0;
  }

  [data-module="takeoff"] .tk-report-facts > div:last-child {
    grid-column: 1 / -1;
    padding-right: 12px;
    border-bottom: 0;
  }
}

@media (max-width: 820px) {
  [data-module="takeoff"] .tk-setup-columns {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-setup-side {
    padding: 20px 0 0;
    border-top: 1px solid var(--border);
    border-left: 0;
  }

  [data-module="takeoff"] .tk-inventory {
    overflow: visible;
  }

  [data-module="takeoff"] .tk-inventory-table {
    display: block;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  [data-module="takeoff"] .tk-processing-axes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-module="takeoff"] .tk-processing-axis:nth-child(2) {
    border-right: 0;
  }

  [data-module="takeoff"] .tk-processing-axis:nth-child(-n + 2) {
    border-bottom: 1px solid var(--border);
  }

  [data-module="takeoff"] .tk-report-review-head {
    align-items: flex-start;
    flex-direction: column;
  }

  /* Four bucket cells across stop being readable well before phone width. */
  [data-module="takeoff"] .tk-bucket-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-module="takeoff"] .tk-order-compare {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-bucket-rules > div {
    grid-template-columns: minmax(0, 1fr) 44px;
  }

  [data-module="takeoff"] .tk-bucket-rules dd:first-of-type {
    grid-column: 1 / -1;
  }
}

/* -- phone ------------------------------------------------------------- */

@media (max-width: 640px) {
  [data-module="takeoff"] .tk-report-head {
    flex-direction: column;
    padding-top: 16px;
  }

  [data-module="takeoff"] .tk-report-head h3 {
    font-size: 20px;
  }

  [data-module="takeoff"] .tk-report-provenance {
    font-size: 10.5px;
  }

  [data-module="takeoff"] .tk-report-details dl {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  [data-module="takeoff"] .tk-report-details dd {
    margin-bottom: 6px;
  }

  [data-module="takeoff"] .tk-report-facts dd {
    font-size: 15px;
  }

  [data-module="takeoff"] .tk-report-reliability {
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
  }

  [data-module="takeoff"] .tk-bucket-strip {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  /* AT PHONE WIDTH THE FOUR ALWAYS-VISIBLE ELEMENTS ALL SURVIVE, which is the
   * rule the accepted artifact set: the headline wraps, the chip and the
   * disclosure label drop under it, and the decision control moves to its own
   * full-width line rather than shrinking. Nothing is hidden at 390px that is
   * visible at desktop width -- a queue that drops the evidence chip on a
   * phone is a queue a reviewer cannot trust on a phone. */
  [data-module="takeoff"] .tk-fq-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding-bottom: 8px;
  }

  [data-module="takeoff"] .tk-fq-summary {
    padding-bottom: 4px;
  }

  [data-module="takeoff"] .tk-fq-dec {
    padding-top: 0;
  }

  [data-module="takeoff"] .tk-fq-dec .tk-disp-select {
    flex: 1 1 100%;
  }

  [data-module="takeoff"] .tk-fq-panel {
    padding-left: 0;
  }

  [data-module="takeoff"] .tk-fq-facts > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  /* The contributions table keeps readable columns inside its own horizontal
   * scroller rather than crushing the coordinate column into two lines. */
  [data-module="takeoff"] .tk-contrib {
    min-width: 520px;
  }

  [data-module="takeoff"] .tk-report-evidence-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-report-evidence-grid > section,
  [data-module="takeoff"] .tk-report-evidence-grid > section:first-child,
  [data-module="takeoff"] .tk-report-evidence-grid > section:last-child {
    padding: 12px 0;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  [data-module="takeoff"] .tk-report-evidence-grid > section:last-child {
    border-bottom: 0;
  }

  [data-module="takeoff"] .tk-setup-progress {
    padding-right: 14px;
    padding-left: 14px;
  }

  [data-module="takeoff"] .tk-setup-workspace {
    padding-right: 14px;
    padding-left: 14px;
  }

  [data-module="takeoff"] .tk-setup-step {
    font-size: 11px;
  }

  [data-module="takeoff"] .tk-setup-head {
    flex-direction: column;
  }

  [data-module="takeoff"] .tk-folder-selection,
  [data-module="takeoff"] .tk-processing-hero {
    display: flex;
    align-items: stretch;
    flex-direction: column;
  }

  [data-module="takeoff"] .tk-folder-selection > button {
    width: 100%;
    min-height: 44px;
  }

  [data-module="takeoff"] .tk-setup-actions > *,
  [data-module="takeoff"] .tk-setup-actions-end > * {
    flex: 1 1 132px;
    min-height: 44px;
  }

  [data-module="takeoff"] .tk-setup-actions-end {
    flex: 1 1 auto;
    margin-left: 0;
  }

  [data-module="takeoff"] .tk-icon-btn {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
    min-height: 44px;
  }

  [data-module="takeoff"] .tk-inventory-check {
    width: 44px;
    height: 44px;
  }

  [data-module="takeoff"] .tk-inventory-table th,
  [data-module="takeoff"] .tk-inventory-table td {
    height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  [data-module="takeoff"] .tk-inventory-table th:nth-child(2),
  [data-module="takeoff"] .tk-inventory-table td:nth-child(2) {
    min-width: 220px;
  }

  [data-module="takeoff"] .tk-inventory-table th:nth-child(3),
  [data-module="takeoff"] .tk-inventory-table td:nth-child(3) {
    min-width: 112px;
  }

  [data-module="takeoff"] .tk-machine-choice {
    grid-template-columns: 24px minmax(0, 1fr);
    min-height: 68px;
  }

  [data-module="takeoff"] .tk-machine-state {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  [data-module="takeoff"] .tk-processing-axes {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-processing-axis {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  [data-module="takeoff"] .tk-processing-axis:last-child {
    border-bottom: 0;
  }

  [data-module="takeoff"] .tk-activity-event {
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
  }

  [data-module="takeoff"] .tk-header-actions,
  [data-module="takeoff"] .tk-header-actions > *,
  [data-module="takeoff"] .tk-dispatch-actions > * {
    width: 100%;
  }

  [data-module="takeoff"] .tk-dispatch-grid,
  [data-module="takeoff"] .tk-box-picks,
  [data-module="takeoff"] .tk-dispatch-checks,
  [data-module="takeoff"] .tk-dispatch-result dl,
  [data-module="takeoff"] .tk-job-axes {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-inline-control {
    flex-direction: column;
  }

  [data-module="takeoff"] .tk-box-pick-card {
    flex-direction: column;
  }

  [data-module="takeoff"] .tk-box-pick-actions,
  [data-module="takeoff"] .tk-box-pick-actions .btn-secondary {
    width: 100%;
  }

  [data-module="takeoff"] .tk-field input,
  [data-module="takeoff"] .tk-field select {
    font-size: 16px;
    min-height: 44px;
  }

  [data-module="takeoff"] .tk-inline-control .btn-secondary,
  [data-module="takeoff"] .tk-box-pick-actions .btn-secondary,
  [data-module="takeoff"] .tk-dispatch-actions .btn-primary,
  [data-module="takeoff"] .tk-dispatch-actions .btn-secondary,
  [data-module="takeoff"] .tk-jobs-head .btn-secondary {
    min-height: 44px;
  }

  [data-module="takeoff"] .tk-checkline {
    min-height: 44px;
    align-items: center;
  }

  [data-module="takeoff"] .tk-disp-select,
  [data-module="takeoff"] .tk-disp-note {
    /* Prevent iOS Safari auto-zoom on focus. */
    font-size: 16px;
    /* And the 44px touch minimum: both inherit the platform's 36px, which is
     * the last thing between this report and a phone-clean touch audit. */
    min-height: 44px;
  }

  /* A 290px popover pinned to the right edge overflows a 375px viewport once
   * the shell's own padding is counted. On a phone the panel stops floating
   * and simply flows under the button at full width -- no absolute
   * positioning, so nothing can anchor to an unrelated ancestor or get
   * clipped by an overflow container on the way up. */
  [data-module="takeoff"] .tk-export-wrap {
    width: 100%;
  }

  [data-module="takeoff"] .tk-export-panel {
    position: static;
    width: auto;
    margin-top: 8px;
    box-shadow: none;
  }

  [data-module="takeoff"] .tk-export-foot {
    flex-wrap: wrap;
  }

  /* Each option row was a ~16px target -- the label text line plus a 13px
   * browser checkbox, with the 8px margin OUTSIDE the clickable area. Adjacent
   * scopes were a mis-tap apart. modules.md: 44px minimum on touch. */
  [data-module="takeoff"] .tk-export-row {
    min-height: 44px;
    margin-bottom: 0;
    padding: 4px 0;
  }

  [data-module="takeoff"] .tk-export-sub {
    margin-top: -6px;
  }

  /* THE REPORT'S REMAINING TOUCH TARGETS, on the same rule as the export rows
   * directly above and the field controls further up this block. Measured
   * across every authority state in both themes, these were the last controls
   * the report renders under 44px on a phone: the bucket filter chips and the
   * two evidence buttons inherit the platform's 28px .strata-btn-sm, and the
   * decision select and note field sit at the platform's 36px.
   *
   * PHONE-SCOPED, like every other 44px rule in this block, because 44px is
   * the TOUCH minimum ("Mobile responsive -- Touch targets: 44px minimum") and
   * a pointer does not need it. The four <summary> disclosures are the
   * exception and take their 44px at every width, because a summary is the
   * only affordance its panel has and the earlier fix set that precedent.
   *
   * The filter strip is a horizontal scroller, so growing its chips costs no
   * width -- and its 10px vertical padding already sized the strip for a taller
   * chip. The decision select and note field take the same minimum, on the
   * font-size rule they already share further down this block. */
  [data-module="takeoff"] .tk-report-filter,
  [data-module="takeoff"] .tk-ev-side .strata-btn-sm {
    min-height: 44px;
    height: auto;
  }

  [data-module="takeoff"] .tk-cov-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-module="takeoff"] .tk-values {
    flex-wrap: wrap;
    gap: 8px;
  }

  /* Two evidence columns do not fit a phone. Stack them -- drawn first, so
   * the reading order stays "what is on the drawing, then what the schedule
   * says", the same order as on a wide screen. */
  [data-module="takeoff"] .tk-ev {
    grid-template-columns: minmax(0, 1fr);
  }

  /* The disposition row wrapped into three ragged lines at 375px because the
   * select and the note both held a min-width. Give each its own full-width
   * line instead: the control is the point, the label is not. */
  [data-module="takeoff"] .tk-disp-select,
  [data-module="takeoff"] .tk-disp-note {
    flex: 1 1 100%;
    min-width: 0;
    width: 100%;
  }

  [data-module="takeoff"] .tk-disp-meta {
    margin-left: 0;
  }

  /* The runs table needs NO rule here. platform/styles.css already makes
   * .strata-admin-table a scrolling block at this breakpoint, so the wrapper
   * + min-width this module used to add produced TWO nested horizontal
   * scrollers and a phone user had to traverse both to reach the last column.
   * One scroll owner, and it is the platform's. (Codex review.) */

  [data-module="takeoff"] .tk-finding {
    padding: 12px;
  }
}

/* -- motion ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  [data-module="takeoff"] .tk-finding {
    transition: none;
  }
}
