/*
 * THE RENDER-EVEN TAIL — the setup page's spacing layer, and the LAST stylesheet the
 * page links.
 *
 * [HARD] THIS FILE WINS ONLY BY BEING LAST. It re-declares `.tpl-start
 * .tpl-section-block`, `#tpl-participant-data-body`, `.tpl-end-toggle` and
 * `.tpl-section-band + .tpl-flat-subcard` at IDENTICAL specificity to setup-page.css.
 * `App\Support\SetupPageSource::ownCssPaths()` asserts the link order against
 * start.blade.php's own <link> lines, so a reordered @push is a hard error rather than a
 * silent spacing change.
 *
 * ── THE THREE RULES THIS LAYER IS BUILT ON ──────────────────────────────────────────
 *
 * 1. NESTING IS THE RHYTHM. A card is a column at --step-group, so its children read as
 *    groups; a list inside a card is a column at --step-row, so its rows read as peers
 *    and tighter than the group boundary above them. A flat run of children with
 *    per-element margins cannot express that difference.
 *
 * 2. THE STEP IS THE ENTIRE DISTANCE. Held space at a junction a step governs is zeroed
 *    here rather than left to add to it. A step that says 16 while a padding quietly
 *    contributes 10 is not a step, it is a suggestion.
 *
 * 3. HELD SPACE STAYS WHERE IT IS DOING A JOB. Under RENDER-EVEN the target is the INK
 *    the eye sees, so declared = 16 − (space held inside the two boxes): declared values
 *    VARY while rendered ones do not. Every inset the negative margins cancel is
 *    load-bearing — a well's positioning inset that --col-line-x measures from, a rail
 *    row's inset from its neighbour's hairline, a padded box's interior. Removing one
 *    cost a live regression and a revert. The sibling pulls up instead.
 *
 * [HARD] A CONTAINER TAKES A STEP ONLY IF IT STACKS ITS CHILDREN — a property of its own
 * flex-direction, not of what it holds. `.tpl-flat-subcard` is a CLASS and the DM
 * criterion card's header band carries it while being a flex ROW. The
 * `:not(.tpl-edit-row)` below is that fix; spacingprobe.html is the guard, and fails any
 * element carrying a step row-gap whose computed flex-direction is a row.
 *
 * THE VALUES ARE IN templates.css AND ONLY THERE. No step number is declared in this
 * file; every arm is written against the token so moving --step-tight moves all of them
 * together. The scheme itself is `.claude/rules/setup-geometry.md`.
 *
 * ── WHERE THE MEASUREMENTS WENT ─────────────────────────────────────────────────────
 * The before/after figures behind every arm below, and the three rules that were tried
 * here and deleted, are docs/decision-record.md, "RENDER-EVEN and the three steps: what
 * each arm was measured against (2026-09-17)". Each arm keeps a one-line pointer.
 */

/* GROUP — a card is a column of groups. */
.tpl-start .tpl-form-card,
.tpl-start .tpl-section-block{
    display:flex;
    flex-direction:column;
    row-gap:var(--step-group);
}
/* #tpl-participant-data-body is scoped by ID, NOT by .tpl-instructions-body: that class
   has a fourth consumer (DM's end-of-criterion questions container) this must not reach. */
.tpl-start #tpl-participant-data-body{
    display:flex;
    flex-direction:column;
    row-gap:var(--step-group);
}
/* Held space at a junction the GROUP step above governs — .tpl-edit-row--header's own
   margin-bottom (templates.css) would ADD to the card's row-gap. */
.tpl-start #tpl-participant-data-card .tpl-edit-row--header{margin-bottom:0;}

/* ROW — every list inside a card is a column of peers. `:not(.tpl-edit-row)` is the
   flex-direction rule in the header above; do not widen it back to the bare class. */
.tpl-start .tpl-flat-subcard:not(.tpl-edit-row),
/* Scoped `.tpl-flat-subcard >`: DM's copy of this class lives inside .tpl-crit-pair,
   which is already on this list, and must NOT be reached twice. */
.tpl-start .tpl-flat-subcard > .tpl-instructions-body,
.tpl-start #tpl-flat-questions-list,
.tpl-start .tpl-questions-list,
.tpl-start .tpl-crit-part--questions,
.tpl-start .tpl-section-block .tpl-crit-pair,
.tpl-start .tpl-questions-list .tpl-crit-pair,
.tpl-start #tpl-segment-selected,
.tpl-start .tpl-sidebar-inner > [id^="tpl-sidebar-slot-"]{
    display:flex;
    flex-direction:column;
    row-gap:var(--step-row);
}

/* Held space at a governed junction, zeroed. THE HORIZONTAL TERMS ARE UNTOUCHED:
   .tpl-flat-subcard's left inset is the row band's box and every field's line column is
   measured from it. The base `.tpl-instructions-body{margin-top:var(--stack-gap)}` still
   stands for its three other consumers. */
.tpl-start .tpl-flat-subcard > .tpl-instructions-body{margin-top:0;}

/* [HARD] A FLEX COLUMN STRETCHES ITS CHILDREN, AND THAT IS NOT A SPACING DECISION. The
   rows are meant to stretch and do; the adders are not. align-self on the adders, never
   align-items on the column, which would shrink the rows too. The padding is restated at
   this rule's specificity because the adder became a flex item and the column offset
   started arriving as padding. */
.tpl-start .tpl-add-item,
.tpl-start #tpl-add-item,
.tpl-start #tpl-flat-add-question{align-self:flex-start;width:max-content;max-width:100%;
  padding:var(--inset-tag) var(--gap-row);}

/* ── THE SURVEY CARD'S TWO UNDECLARED JUNCTIONS ──────────────────────────────────────
   The opposite of every other arm here: there is no held space to take back, there is a
   MISSING DECLARATION, and both junctions read ~1–2.5px because nothing states a distance.
   `.qt-row-collapsed` IS a flex row — its badge, chip and controls sit on one line — but
   the Instruction/Hint field WRAPS to a second flex line, so the chip-line-to-field-line
   distance is the container's row-gap, which defaulted to `normal`. Each subtrahend is
   the ink the junction already renders. */
.tpl-start #tpl-flat-questions-body{
    display:flex;
    flex-direction:column;
}
/* [HARD] SCOPED :not(.slim-mode), AND NOT CANCELLED. The junction this gap exists for is
   #tpl-flat-questions-sublabel -> the questions list, and that heading is emitted
   `@unless($slimMode)`. On slim the first child is #tpl-slim-question-label instead — a
   .tpl-crit-tag, which carries --step-tight as its OWN margin-bottom — so on slim the gap
   did not replace a missing distance, it STACKED on a declared one. No counter-margin and
   no row-gap:0: the declaration simply does not reach the page whose child already states
   the distance. */
/* THE SUBTRAHEND IS A MEASUREMENT, NOT A TASTE, AND HERE IS WHERE TO LOOK WHEN THE TYPE
   MOVES. 2.5px is the ink the junction already renders with no row-gap at all — the
   descent below the last line above and the ascent above the first line below — from the
   ink-to-ink sweep recorded in docs/decision-record.md, "RENDER-EVEN and the three steps:
   what each arm was measured against". A line-height change moves it, so a line-height
   change is when to re-run that sweep rather than to nudge this number.
   RE-CHECKED 2026-09-19 (P7), /templates/blank_survey/start at 1280: this container
   computes row-gap 13.5px and its three children sit at exactly 13.50 / 13.50, against
   #tpl-flat-questions-list's own --step-row of 16. The arm still states what it claims. */
.tpl-start:not(.slim-mode) #tpl-flat-questions-body{
    row-gap:calc(var(--step-row) - 2.5px);
}
/* Same shape, 1px, same sweep. RE-CHECKED 2026-09-19: row-gap computes 15px and the two
   flex lines measure 15.00 apart — the chip line ending at 670.89, .tpl-edit-field
   starting at 685.89 on the same page. */
.tpl-start .qt-row-collapsed{
    row-gap:calc(var(--step-row) - 1px);
}

/* ══════════════════════════════════════════════════════════════════════════
   LABEL TO FIELD RENDERS --step-tight, INK TO INK
   ══════════════════════════════════════════════════════════════════════════
   The target is the label's ink to the FIELD'S TEXT ink, never to the field's box. A
   control holds that text at its own offset, so the DECLARED number differs per field
   type while the rendered one does not. Every subtrahend below is space the control's
   own interior already holds. */
/* An input centres its value: 5px below the box top at the facilitator field size. */
.tpl-start .tpl-crit-tag:has(+ input){margin-bottom:calc(var(--step-tight) - 5px);}
/* A textarea starts its value after its own 5px padding, less the label's descent. */
.tpl-start .tpl-crit-tag:has(+ textarea){margin-bottom:calc(var(--step-tight) - 4px);}
/* The section prompt runs a larger line, so its value sits lower in the same box.
   [HARD] 6.4px IS DERIVED FROM A TYPE SIZE x A LINE-HEIGHT, so P6d moving the line-height
   tiers (ac03431e, 108 sites) put it at risk, and P7 re-measured it before touching
   anything else in this file. RE-MEASURED 2026-09-19, /templates/blank_dm/start at 1280,
   comparing this junction against the ordinary `.tpl-crit-tag:has(+ input)` junction on
   the same page under one consistent model (canvas font metrics; label ink bottom to the
   field value's ink top): ordinary 16.50, this one 16.59 — 0.09px apart. THAT AGREEMENT IS
   THE WHOLE POINT OF THE ARM, and it survives P6d. Left at 6.4. The absolute figures are
   model-dependent and are NOT the scheme's own ink convention; what is comparable is the
   two readings against each other, taken the same way in the same run. */
.tpl-start .tpl-crit-part--q > .tpl-crit-tag:has(+ input){margin-bottom:calc(var(--step-tight) - 6.4px);}
/* A pill's glyph overhangs its own box top by 1, so this junction needs one MORE. */
.tpl-start .tpl-end-toggle{row-gap:calc(var(--step-tight) + 1px);}

/* ══════════════════════════════════════════════════════════════════════════
   RENDER-EVEN — 16px INK TO INK, EVERYWHERE INSIDE A CARD
   ══════════════════════════════════════════════════════════════════════════
   Each value is written as the TERMS that make it, not as one literal, so it follows if
   a padding or a border moves. Rule 3 in the header is why these are negative margins on
   the sibling rather than the inset being removed. */

/* Wells inside an ordinary card — 12px padding-top + a 1px transparent border. */
.tpl-start .tpl-form-card > .tpl-flat-subcard{
    margin-top:calc(-1 * (12px + 1px));
}
/* The flat OVERALL QUESTION well carries a deeper inset (20px + 1px). */
.tpl-start #tpl-flat-question-card > #tpl-flat-compare-fields{
    margin-top:calc(-1 * (20px + 1px));
}
/* The MS section body panel — 24px + 1px, the card's own inset on that shape.
   SCOPED TO THE BAND, not to `.tpl-section-block > .tpl-flat-subcard`: the DM criterion
   card is also a .tpl-section-block and also holds a well, and the wider selector pulled
   that well above its own card's top edge. */
.tpl-start .tpl-section-band + .tpl-flat-subcard{
    margin-top:calc(-1 * (24px + 1px));
}
/* The MS description pair to the comparison question — the rule's own weight + 1px.
   RE-EXPRESSED 2026-09-19 (P7) from `calc(-1 * 2px)`: the first term IS --tpl-rule-weight
   (declared on .tpl-start, an ancestor of this selector, so it resolves here), and stating
   it as the token means this arm follows the rule if the rule ever changes weight instead
   of quietly compensating for the old one. Computed value is unchanged at -2px. */
.tpl-start .tpl-flat-subcard > .tpl-crit-pair.tpl-section-desc + .tpl-section-prompt-wrap{
    margin-top:calc(-1 * (var(--tpl-rule-weight) + 1px));
}


/* The three GROUP-inside-ROW junctions: flex gap and margin ADD, so a child that opens a
   new group inside a list-step container spends only --step-lift, the difference. */
.tpl-start .tpl-flat-subcard > .tpl-end-toggle{margin-top:var(--step-lift);}
.tpl-start #tpl-flat-items-subcard > .tpl-end-toggle{margin-top:var(--step-lift);}
/* DM parks the end toggle in .tpl-crit-ctrls, which runs at NO step, so the child states
   the whole group distance rather than the lift.
   [HARD] THIS ARM WAS PROPOSED FOR DELETION AND MEASURED FIRST, AND THE MEASUREMENT
   REFUSED IT (2026-09-19). docs/spacing-scale-proposal-2026-09-19.md §4 names this the one
   arm it would remove — "give .tpl-crit-ctrls a real row gap and delete the child margin".
   Its source half is right: templates.css really does declare `gap:0 20px` there. Its
   consequence half is wrong. .tpl-crit-ctrls has TWO children and one of them,
   .tpl-weight-row, computes display:none on EVERY render — setup-sidebar.css
   `.tpl-start.setup-sidebar .tpl-weight-row`, and $sidebarLayout is set unconditionally in
   start.blade.php. Measured on all four instances in the 61-cell dump (create-dm and
   manage-dm, 1280 and 390): the container lays out ONE flex line at row-gap 0px and this
   margin is the whole of the distance. A row-gap on a single-line flex container applies
   between nothing, so the swap would delete 16px from the end-of-section row on every DM
   criterion card. Recorded at docs/reality-register.md RR-072 instance 3. Do not re-propose
   it without re-running that read. */
.tpl-start .tpl-crit-ctrls > .tpl-end-toggle{margin-top:var(--step-group);}
/* THE LABEL->CONTROL JUNCTION, BOTH ITS CONTAINERS. .tpl-modes-row was retargeted and
   #tpl-workshop-toggle-row — same label, same pill, different id — was missed. These two
   are the only containers holding the relationship; named together so the next edit
   cannot move one without the other. */
.tpl-start #tpl-workshop-toggle-row{row-gap:var(--step-tight);}

/* The sign-in caption is a label FOR the buttons above it, so the cluster runs tight. */
.tpl-start #tpl-ws-auth-individual{row-gap:var(--step-tight);}

/* ── THE RAIL RUNS THE STEPS TOO ─────────────────────────────────────────────────────
   .tpl-sidebar-inner is a card, its rows' held padding is already gone, and until these
   containers state a step there is nothing in its place. Segment and weighting panels are
   lists of peers. `.tpl-segment-card` is NOT on this list and must not be added — see the
   decision record. */
.tpl-start #tpl-segment-fields,
.tpl-start #tpl-sidebar-weight-panel,
.tpl-start #tpl-sidebar-weight-rows{
    display:flex;
    flex-direction:column;
    row-gap:var(--step-row);
}
.tpl-start .tpl-sidebar-inner > [id^="tpl-sidebar-slot-"] > #tpl-sidebar-weight-panel{margin-top:var(--step-lift);}
