/* ============================================================
   ATiQ — STAGE CARD V2   [074000]
   --atiq-v2-build:'080000';

   ⚠ ROLLBACK: every rule is scoped to `body.atiq-stage-v2`, set from ATIQ_STAGE_V2 in core.js.
   Flip that to false and the card is exactly what it was. Nothing in app.css or quote-print.css
   was edited for V2 — deliberately, so a revert cannot depend on me having un-edited correctly.
   Deleting this file and its <link> is the permanent undo.

   ⚠ EVERY SELECTOR BELOW WAS GREPPED AGAINST THE DOM BEFORE IT WAS WRITTEN.
   The 073500 build shipped four selectors that matched nothing — .panel-title, .qv-panel-title,
   .mat-table, .mat-total-row — all invented from reading mockups instead of the markup. The real
   names are noted beside each block. If you add a rule here, grep the class first.

   THE SYSTEM
     ONE ACCENT.  Blue = a figure measured off a drawing. Nothing else is coloured.
     MONEY HAS NO COLOUR.  The stage total carries weight in size and a rule, the way a title block
       does hierarchy — ink, not hue. Lime is gone from this card entirely.
     THREE HEADINGS.  Panel > section > group, visibly different.
     ONE ROW RULE.  Same hairline, padding and size everywhere; figures right and tabular.
     ONE CONCLUSION.  Subtotals read as subtotals; only the stage total is loud.
   ============================================================ */

body.atiq-stage-v2{ --atiq-v2-build:'080000'; }

body.atiq-stage-v2 .quote-view{
  /* [091000] THE STRUCTURAL RULE, as one token. It is drawn in six places now — under both
     header rows, down the middle, between materials and labour, above the footer, and around the
     card — so its brightness has to be changeable in one move rather than six. */
  /* [091500] 0.42 on James's call. At .72 the rule rendered at 9.6:1 against the card — brighter
     than every piece of text on the page bar the stage total, which is what made a divider
     out-shout the content either side of it. .42 is 4.1:1: clearly structural, and it keeps the
     order between the card's three line weights (rule .42 > card edge .22 > row hairline .07). */
  --v2-rule:rgba(255,255,255,.42);
  /* [135500] ONE DEFINITION. These five roles are owned by design/tokens.css now; the names stay
     so the 2,500 lines below keep working, but they hold no colour of their own. Light mode needs
     no second copy here: body.light re-values the tokens and these follow. */
  --v2-measured:var(--q-measured);
  --v2-ink:var(--q-text); --v2-ink2:var(--q-sub); --v2-ink3:var(--q-quiet); --v2-ink4:var(--q-ghost);
  --v2-line:var(--q-rule); --v2-line2:rgba(255,255,255,.15); --v2-line3:rgba(255,255,255,.3);
  --v2-wash:#202123; --v2-bg2:#17181a;
  --v2-font:var(--q-font);
  --v2-narrow:var(--q-narrow);

  /* ⚠ THE FONT ONLY LANDS BY REDEFINING THESE.
     110 rules in quote-print.css declare their own font-family — 30 via var(--font), 17 via
     var(--font-mono). Setting font-family on .page-card did nothing, because an element whose own
     rule names a font ignores what it inherits. Redefining the variables converts those 47 rules
     for free; the blanket rule further down catches the 31 that hardcode 'Inter'.
     --font-mono points at Archivo too: it has proper tabular figures, and one typeface was the
     point. */
  --font:'Archivo','Inter',-apple-system,sans-serif;
  --font-mono:'Archivo','Inter',-apple-system,sans-serif;

  /* LIME, NEUTRALISED. --accent drives ~104 rules in quote-print.css — borders, text and
     backgrounds. Rather than chase each one, the variable itself becomes a neutral, so every
     lime border and tint on this card goes quiet in one move. Blue stays the only accent. */
  --accent:rgba(255,255,255,.3);
}
body.light.atiq-stage-v2 .quote-view{
  /* .51 black on white measures 4.1:1 — the same contrast .42 white gives on the dark card.
     Matching the ALPHA across themes would not have matched the look: .70 black on white is far
     heavier than .42 white on #17181a. Measured, not mirrored. */
  --v2-rule:rgba(0,0,0,.51);
  /* [135500] measured / ink / line come from the tokens' light values now (see above) */
  --v2-line2:rgba(0,0,0,.14); --v2-line3:rgba(0,0,0,.35);
  --v2-wash:#f4f4f1; --v2-bg2:#fff;
  --accent:rgba(0,0,0,.35);
}

/* the 31 rules that hardcode 'Inter'. One typeface was the point, so this is deliberate. */
body.atiq-stage-v2 .quote-view .page-card,
body.atiq-stage-v2 .quote-view .page-card *{ font-family:var(--v2-font)!important; }

/* ── OLD HEADER STEPS ASIDE (hidden, not deleted — the flag brings it back) ─────────── */
body.atiq-stage-v2 .quote-view .page-card-header,
body.atiq-stage-v2 .quote-view .page-card-stage-banner{ display:none!important; }

/* ── HEADER, TWO ROWS ──────────────────────────────────────────────────────────────── */
body.atiq-stage-v2 .quote-view .sv2-hd{ flex-shrink:0; }
/* row 1 — reference line: things you already know */
body.atiq-stage-v2 .quote-view .sv2-r1{
  display:flex; align-items:baseline; gap:14px; padding:6px 16px;
  background:var(--v2-bg2); border-bottom:1px solid var(--v2-line);
}
body.atiq-stage-v2 .quote-view .sv2-sp{ flex:1; }
body.atiq-stage-v2 .quote-view .sv2-lb{
  font-family:var(--v2-narrow)!important; font-size:9px; font-weight:600; color:var(--v2-ink3);
  letter-spacing:.14em; text-transform:uppercase; white-space:nowrap;
}
body.atiq-stage-v2 .quote-view .sv2-r1 .sv2-v{
  font-size:12px; font-weight:500; color:var(--v2-ink2); margin-left:-6px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* row 2 — the working line */
body.atiq-stage-v2 .quote-view .sv2-r2{
  display:flex; align-items:stretch; background:var(--v2-bg2);
  border-bottom:1px solid var(--v2-line2);
}
body.atiq-stage-v2 .quote-view .sv2-stg{ flex:1; min-width:0; padding:8px 16px; }
body.atiq-stage-v2 .quote-view .sv2-stg .sv2-lb{ color:var(--v2-measured); display:block; margin-bottom:4px; }
body.atiq-stage-v2 .quote-view .sv2-nm{
  font-size:15.5px; font-weight:700; color:var(--v2-ink); letter-spacing:-.018em; line-height:1.15;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body.atiq-stage-v2 .quote-view .sv2-unnamed{ color:var(--v2-ink4); font-style:italic; font-weight:400; }
body.atiq-stage-v2 .quote-view .sv2-q{
  padding:8px 15px; border-left:1px solid var(--v2-line2); text-align:right; min-width:92px;
}
body.atiq-stage-v2 .quote-view .sv2-q .sv2-lb{ display:block; margin-bottom:5px; }
body.atiq-stage-v2 .quote-view .sv2-n{
  font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1;
  letter-spacing:-.022em; color:var(--v2-measured);
}
body.atiq-stage-v2 .quote-view .sv2-n u{
  font-size:10.5px; font-weight:600; text-decoration:none; color:var(--v2-ink3); margin-left:2px;
  letter-spacing:0;
}
body.atiq-stage-v2 .quote-view .sv2-n.nil{ color:var(--v2-ink4); font-weight:500; }

/* ── PANEL HEADINGS ────────────────────────────────────────────────────────────────────
   REAL CLASSES: .col-breakdown-title (Take-off) and .col-section-title (Material Schedule,
   Labour & Site Prelims). 073500 targeted .panel-title / .qv-panel-title, which do not exist,
   so these kept their original 8px --text-dim and the ladder stayed two rungs. */
body.atiq-stage-v2 .quote-view .col-breakdown-title,
body.atiq-stage-v2 .quote-view .col-section-title{
  font-size:14.135px!important; font-weight:700!important; color:var(--v2-ink)!important;
  letter-spacing:.11em!important; padding-bottom:8.995px!important; margin-bottom:5.14px!important;
  border-bottom:1.285px solid var(--v2-line2)!important;
}

/* ── SECTION HEADINGS — blue, because a section is structure ───────────────────────── */
body.atiq-stage-v2 .quote-view .section-card-header{
  background:none!important; border-bottom:1.285px solid var(--v2-line)!important; padding:11.565px 2.57px 3.855px!important;
}
body.atiq-stage-v2 .quote-view .section-header-title{
  font-size:12.2075px!important; font-weight:700!important; letter-spacing:.09em!important;
  color:var(--v2-measured)!important;
}

/* ── GROUP ROWS — a heading that carries a measure ─────────────────────────────────── */
body.atiq-stage-v2 .quote-view .tbl-part-row td{
  background:var(--v2-wash)!important; color:var(--v2-ink)!important;
  border-top:1.285px solid var(--v2-line2)!important;
  font-size:10.9225px!important; font-weight:700!important; letter-spacing:.06em!important;
  padding:5.14px 7.71px!important;
}
/* the measure is an input you drive; everything under it is derived, so only this is blue */
body.atiq-stage-v2 .quote-view .sec-measure-pill{
  color:var(--v2-measured)!important; border-color:transparent!important;
  font-size:14.7775px!important; font-weight:700!important; padding:0!important;
}
/* [097500] THE RING IS GONE. Two reasons beyond the look: its padding:1px 7px pushed the figure
   off the numeric column, so an edited measure was the one number on the card that did not line
   up with the measures above it; and a ring reads as an input you can type into, which outside
   group-edit mode it is not. Amber alone now carries it — the card's own word for "a human
   changed this" — and the reset link beside it stays as the way back. */
body.atiq-stage-v2 .quote-view .sec-measure-pill.measure-moved{
  color:#e8a33d!important; border:none!important; padding:0!important;
}

/* ── ONE ROW RULE ──────────────────────────────────────────────────────────────────── */
body.atiq-stage-v2 .quote-view .page-card .tbl td{
  font-variant-numeric:tabular-nums; border-bottom:1.285px solid var(--v2-line);
}
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td{
  color:var(--v2-ink2)!important; border-bottom:1.285px solid var(--v2-line)!important;
}
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row td.part-unit-cell,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td:last-child{
  color:var(--v2-ink3)!important;
}
/* NO WASH ON DATA ROWS.
   REAL CLASS: .lab-row-has-value td, which sets a lime tint with !important at quote-print:1227.
   That tint under white numbers was most of the clash, and it striped the panel used/unused. */
body.atiq-stage-v2 .quote-view .lab-row-has-value td{ background:none!important; }

/* ── COLUMN ALIGNMENT ──────────────────────────────────────────────────────────────────
   Both right-hand tables are plain .tbl — 073500 targeted .mat-table, which does not exist.
   They are told apart by their WRAPPERS: .mat-schedule-wrap and .lab-section-wrap. The two sit
   stacked in one column, so their grids disagreeing by a few pixels read as untidiness. */
body.atiq-stage-v2 .quote-view .mat-schedule-wrap .tbl td:nth-child(2){ width:59.11px; text-align:right; }
body.atiq-stage-v2 .quote-view .mat-schedule-wrap .tbl td:nth-child(3){ width:43.69px; }
body.atiq-stage-v2 .quote-view .mat-schedule-wrap .tbl td:nth-child(4){ width:74.53px; text-align:right; }
body.atiq-stage-v2 .quote-view .mat-schedule-wrap .tbl td:nth-child(5){ width:82.24px; text-align:right; }
body.atiq-stage-v2 .quote-view .lab-section-wrap .tbl td:nth-child(2){ width:59.11px; }
body.atiq-stage-v2 .quote-view .lab-section-wrap .tbl td:nth-child(3){ width:74.53px; }
body.atiq-stage-v2 .quote-view .lab-section-wrap .tbl td:nth-child(4){ width:82.24px; }

/* labour group headings sit at SECTION level, not panel level */
body.atiq-stage-v2 .quote-view .lab-group-b3 td{
  color:var(--v2-measured)!important; font-size:11.565px!important; letter-spacing:.09em!important;
  border-bottom:1.285px solid var(--v2-line)!important; padding:11.565px 7.71px 3.855px!important;
}
body.atiq-stage-v2 .quote-view .tbl tr.lab-child-row td:first-child::before,
body.atiq-stage-v2 .quote-view .tbl tr.lab-child-row td:first-child::after{
  background:var(--v2-measured); opacity:.5;
}

/* ── ONE CONCLUSION ────────────────────────────────────────────────────────────────────
   REAL CLASS for the materials bar: .markup-total-row / -label / -value. 073500 targeted
   .mat-total-row, which does not exist — which is why Labour Total went quiet and Materials
   Total did not. The original sets background AND border-top with !important, so this must too. */
body.atiq-stage-v2 .quote-view .markup-total-row,
body.atiq-stage-v2 .quote-view .lab-total-row{
  background:none!important; border-top:1.285px solid var(--v2-line2)!important;
}
body.atiq-stage-v2 .quote-view .markup-total-label,
body.atiq-stage-v2 .quote-view .lab-total-row span.labour-total-label{
  color:var(--v2-ink2)!important; font-size:11.565px!important; font-weight:600!important;
}
body.atiq-stage-v2 .quote-view .markup-total-value,
body.atiq-stage-v2 .quote-view .lab-total-row span.labour-total-value{
  color:var(--v2-ink)!important; font-size:14.135px!important; font-weight:700!important;
}
/* [075000] .labour-total-days is gone from the markup — the count moved onto the Labour group
   heading (see §9). Rule removed rather than left dangling. */
/* the one loud thing on the card — size and a rule, no colour */
/* [091000] The total bar's own border is GONE. .page-card-footer now carries the white rule, and
   the bar sits directly inside it — so the footer was drawing two lines a few pixels apart, the
   white one and this grey --v2-line3 one. This was the right call when the footer had no rule of
   its own; it is a duplicate now. */
body.atiq-stage-v2 .quote-view .stage-total-bar{
  border-top:none!important;
}
body.atiq-stage-v2 .quote-view .stage-total-value{
  color:#fff!important; font-size:32.125px!important; font-weight:800!important; letter-spacing:-.028em;
}
body.light.atiq-stage-v2 .quote-view .stage-total-value{ color:#111!important; }

/* ── PRINT — structure survives, colour does not ───────────────────────────────────── */
@media print{
  body.atiq-stage-v2 .quote-view .sv2-r1,
  body.atiq-stage-v2 .quote-view .sv2-r2{ background:none!important; }
  body.atiq-stage-v2 .quote-view .sv2-r1{ border-bottom-color:#e4e4e0!important; }
  body.atiq-stage-v2 .quote-view .sv2-r2{ border-bottom-color:#d4d4d0!important; }
  body.atiq-stage-v2 .quote-view .sv2-q{ border-left-color:#d4d4d0!important; }
  body.atiq-stage-v2 .quote-view .sv2-lb{ color:#71716c!important; }
  body.atiq-stage-v2 .quote-view .sv2-stg .sv2-lb{ color:#3d3d3a!important; }
  body.atiq-stage-v2 .quote-view .sv2-r1 .sv2-v{ color:#333!important; }
  body.atiq-stage-v2 .quote-view .sv2-nm{ color:#111!important; }
  body.atiq-stage-v2 .quote-view .sv2-n{ color:#111!important; }
  body.atiq-stage-v2 .quote-view .sv2-n.nil{ color:#b0b0ac!important; }
  body.atiq-stage-v2 .quote-view .sv2-n u{ color:#71716c!important; }
}

/* ============================================================
   [074500] FINISHING PASS
   ============================================================ */

/* 1 · A HARD RULE UNDER THE HEADER.
   The card is two things — identity above, work below — and a hairline was not saying so. */
body.atiq-stage-v2 .quote-view .sv2-r2{
  border-bottom:2px solid var(--v2-rule)!important;
}
body.light.atiq-stage-v2 .quote-view .sv2-r2{ border-bottom-color:rgba(0,0,0,.7)!important; }
@media print{ body.atiq-stage-v2 .quote-view .sv2-r2{ border-bottom-color:#111!important; } }

/* 2 · PANEL HEADINGS DOWN A STEP.
   11px was overcorrecting from the original 8px — it out-shouted the stage name. 9.5px still
   clears the 9.5px blue section headings because it is heavier, lighter in colour and ruled. */
body.atiq-stage-v2 .quote-view .col-breakdown-title,
body.atiq-stage-v2 .quote-view .col-section-title{
  font-size:12.2075px!important; letter-spacing:.1em!important;
}

/* 3 · THE LAST OF THE LIME.
   Neutralising --accent missed these because they hardcode the hex and never read the variable:
     quote-print:1118  .hdr-addbtn i      — every + and the compact toggles
     quote-print:2132  .sim-panel         — Find similar declares its OWN --accent
     quote-print:1735  .pricing-ac-*      — the pricing autocomplete, and it PORTALS to <body>,
                                            so it sits outside .quote-view and the redefine above
                                            could never have reached it. */
body.atiq-stage-v2 .quote-view .hdr-addbtn i{ color:var(--v2-ink3)!important; }
body.atiq-stage-v2 .quote-view .hdr-addbtn:hover i{ color:var(--v2-ink)!important; }
body.atiq-stage-v2 .quote-view .hdr-addbtn.on i,
body.atiq-stage-v2 .quote-view .tk-compact-btn.on i,
body.atiq-stage-v2 .quote-view .lab-compact-btn.on i{ color:var(--v2-measured)!important; }
body.atiq-stage-v2 .sim-panel{ --accent:#5aa9f0; }
body.atiq-stage-v2 .pricing-ac-menu-portal .pac-desc b,
body.atiq-stage-v2 .pricing-ac-menu-portal .pac-none .pac-plus{ color:#5aa9f0!important; }

/* 4 · SUBTOTAL VALUES IN BLUE.
   They are the two figures you compare against each other all day. Blue is the card's "look here"
   and the stage total stays white, so the hierarchy still reads: two blue inputs, one white answer. */
body.atiq-stage-v2 .quote-view .markup-total-value,
body.atiq-stage-v2 .quote-view .lab-total-row span.labour-total-value{
  color:var(--v2-measured)!important;
}

/* 5 · MATERIALS TOTAL ALIGNS WITH THE COLUMN ABOVE IT.
   The row is a flex div with padding 5px 6px; the table cells above use 2px 5px. One pixel of
   right padding was enough to push the money off the column it is totalling. */
body.atiq-stage-v2 .quote-view .markup-total-row{ padding:6.425px 6.425px!important; }
body.atiq-stage-v2 .quote-view .markup-section .markup-row{ padding-left:6.425px!important; padding-right:6.425px!important; }

/* 6 · THE TWO ACTIONS BECOME PILLS.
   Ghost buttons on a dark card read as disabled text. These are the two things you reach for, so
   they get an edge. Find similar carries the blue since it is the one that does something new. */
body.atiq-stage-v2 .quote-view .sv2-pill{
  border:1px solid var(--v2-line2)!important; border-radius:20px!important;
  padding:3px 11px!important; font-size:8.5px!important; font-weight:600!important;
  color:var(--v2-ink2)!important; background:none!important; letter-spacing:.02em;
  transition:border-color .12s, color .12s;
}
body.atiq-stage-v2 .quote-view .sv2-pill:hover{
  border-color:var(--v2-ink3)!important; color:var(--v2-ink)!important;
}
body.atiq-stage-v2 .quote-view .sv2-pill-hi{
  border-color:rgba(90,169,240,.55)!important; color:var(--v2-measured)!important;
}
body.atiq-stage-v2 .quote-view .sv2-pill-hi:hover{
  border-color:var(--v2-measured)!important; background:rgba(90,169,240,.09)!important;
}
/* "Reset to template" stays plain text — it is the one you should have to mean. */
body.atiq-stage-v2 .quote-view .lab-btnrow{ gap:7px!important; align-items:center; }

/* 7 · SUMMARY FIGURES DOWN A SIZE.
   At 20px they competed with the stage name beside them; the rounding took the width out, so the
   drop costs nothing in legibility. */
body.atiq-stage-v2 .quote-view .sv2-n{ font-size:18px!important; }
body.atiq-stage-v2 .quote-view .sv2-n u{ font-size:10px!important; }

/* ============================================================================================
   [075000]  FINISHING PASS 2
   ============================================================================================ */

/* 8 · THE LAST OF THE LIME.
   --accent was neutralised above, which took ~104 rules with it. These are the ones that bypass
   the variable and hardcode rgba(212,252,0,...) or #d4fc00, so they survived. Checked against the
   stage card only — the lime in quote-frame.css (.btn-lime, .csv-addbtn, .qv-back) is dead CSS,
   no JS renders those classes, so it is left alone.
   quote-print:1111 / 1120  .hdr-addbtn border + hover  — the green button borders */
body.atiq-stage-v2 .quote-view .hdr-addbtn{
  border:1.285px solid var(--v2-line2)!important;
}
body.atiq-stage-v2 .quote-view .hdr-addbtn:hover{
  border-color:rgba(90,169,240,.55)!important;
  background:rgba(90,169,240,.07)!important;
}
/* 1472 sets the light-mode icon olive with !important at the same specificity as the v2 rule
   further up, so this needs the extra class to win outright rather than relying on file order. */
body.light.atiq-stage-v2 .quote-view .hdr-addbtn i{ color:var(--v2-ink3)!important; }
body.light.atiq-stage-v2 .quote-view .hdr-addbtn:hover i{ color:var(--v2-measured)!important; }

/* the lime ROW TINTS — a value present, a row being edited, a group just added. All of these were
   a faint yellow wash across the table; they become a neutral lift instead, which still reads as
   "this row is different" without the colour. */
/* NOT .lab-row-has-value — §"NO ROW WASH" above deliberately sets that to none, and a rule here
   would win on file order and quietly re-stripe the table. The lime it was overriding is gone
   either way, since that rule already kills the background outright. */
body.atiq-stage-v2 .quote-view .tbl-item-row.item-added td,
body.atiq-stage-v2 .quote-view .tbl-part-row.group-added td,
body.atiq-stage-v2 .quote-view .tbl-part-row.group-editing td{ background:rgba(90,169,240,.07)!important; }
body.atiq-stage-v2 .quote-view .tbl-item-row.row-editing{ background:rgba(90,169,240,.07)!important; }
body.atiq-stage-v2 .quote-view .lab-group-title-editable:hover{
  background:rgba(90,169,240,.1)!important; color:var(--v2-measured)!important;
}
body.atiq-stage-v2 .quote-view .page-card .tbl .qty-stepper input:focus,
body.atiq-stage-v2 .quote-view .page-card .tbl .edit-mode-cell input:focus{
  background:rgba(90,169,240,.1)!important;
}
body.light.atiq-stage-v2 .quote-view .lab-row-has-value td{ background:none!important; }

/* .lab-undo-btn is the one rule that paints from --value rather than --accent (app.css:1934), so
   neutralising --accent never touched it. Scoped override rather than redefining --value, which
   is shared with the job cards and the logic view. */
body.atiq-stage-v2 .quote-view .lab-undo-btn{ color:var(--v2-measured)!important; }

/* 9 · THE DAY COUNT MOVES ONTO THE GROUP IT COUNTS.
   It used to sit in the Labour Total bar, next to a dollar figure, which made it look like part of
   the money. On the heading it reads as a property of those rows. Right-aligned to the far edge so
   it does not crowd the group name or the delete ×. */
body.atiq-stage-v2 .quote-view .lab-group-days{
  margin-left:10.28px;
  font-size:9.6375px!important; font-weight:600!important;
  letter-spacing:.04em; text-transform:uppercase;
  color:var(--v2-measured)!important;
  font-variant-numeric:tabular-nums;
}
body.atiq-stage-v2 .quote-view .lab-group-days:empty{ display:none; }
@media print{ body.atiq-stage-v2 .quote-view .lab-group-days{ color:#1a1a18!important; } }

/* 10 · CLIENT, RIGHT-ALIGNED, SECONDARY.
   Row 1 lost its "PROJECT" / "CLIENT" labels, so the two values need to be told apart by weight
   and colour instead of by a caption. */
body.atiq-stage-v2 .quote-view .sv2-client{
  color:var(--v2-ink3)!important; font-weight:500!important;
}

/* ============================================================================================
   [080000]  HEADER — "F + 5".  Mocked in headers3/headers4, picked out of eight variants.

   WHAT CHANGED, AND WHY EACH ONE
     1 · A BLUE EDGE BAR on the stage block, 5px, replacing nothing.  The header is one thing
         (which job) sitting above another (which stage, how big) and the hairline between them was
         not load-bearing enough to say so.  A bar in the margin is the title-block convention and
         it costs no vertical space, which a second rule would have.
     2 · ROW 1 BECOMES A BAND.  Project and builder read quiet not because of contrast — #b4b7bb on
         this header measures 8.83:1 and clears AA twice over — but because they are grey at 500
         under a white 700 stage name.  The fix is a surface plus weight, not more brightness:
         they get their own lifted band and go to --v2-ink at 600.  Overrides §10 below it, which
         pushed the client the other way; both values are now equal and told apart by position.
     3 · THE CELL DIVIDERS GO.  Three right-aligned figures under three labels are already three
         things.  The lines were drawing a table that isn't one.
   The 2px white split under row 2 (§1 of the 074500 pass) is untouched — it is the one rule that
   separates identity from work and every variant kept it.
   ============================================================================================ */

body.atiq-stage-v2 .quote-view{ --v2-lift:#1d1f22; }
body.light.atiq-stage-v2 .quote-view{ --v2-lift:#f4f4f1; }

/* 1 · ROW 1 — ITS OWN BAND */
body.atiq-stage-v2 .quote-view .sv2-r1{
  background:var(--v2-lift)!important;
  padding:8px 16px!important;
  border-bottom:1px solid var(--v2-line2)!important;
}
/* margin-left:-6px was pulling the project name to 10px while the stage name below sits at 19px.
   Harmless against a flat background; on a band it is a visible wobble. */
body.atiq-stage-v2 .quote-view .sv2-r1 .sv2-v{
  margin-left:0!important; color:var(--v2-ink)!important; font-weight:600!important;
}
body.atiq-stage-v2 .quote-view .sv2-client{
  color:var(--v2-ink)!important; font-weight:600!important;   /* beats §10, same specificity, later */
}

/* 2 · THE BLUE EDGE */
body.atiq-stage-v2 .quote-view .sv2-stg{
  border-left:5px solid var(--v2-measured);
  padding:9px 16px 9px 14px!important;
}

/* 3 · NO CELL DIVIDERS */
body.atiq-stage-v2 .quote-view .sv2-q{
  border-left:none!important; padding:9px 15px!important; min-width:88px!important;
}

/* PRINT — the bar survives as structure, in grey.  5px of near-black reads as a blot at A4;
   mid-grey still does the job of marking where the stage block starts.
   ⚠ THE BAND FILL HAS TO BE KILLED AGAIN HERE. The 074000 print block already says
   `.sv2-r1{background:none!important}` — but a media query adds no specificity, so that rule and
   the `background:var(--v2-lift)!important` above it are a dead heat on (0,3,1) decided by file
   order, and mine is 200 lines later. Without this line the band would have printed as a grey
   wash. Same trap for anything else added above a pre-existing @media print block. */
@media print{
  body.atiq-stage-v2 .quote-view .sv2-r1{ background:none!important; }
  body.atiq-stage-v2 .quote-view .sv2-stg{ border-left-color:#8a8a85!important; }
  body.atiq-stage-v2 .quote-view .sv2-r1 .sv2-v,
  body.atiq-stage-v2 .quote-view .sv2-client{ color:#1a1a18!important; font-weight:600!important; }
  body.atiq-stage-v2 .quote-view .sv2-r1{ border-bottom-color:#d4d4d0!important; }
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   [080000]  THE SUMMARY PAGE JOINS THE SYSTEM.  Mocks H2 + R3.

   The summary page builds its header from the sv2-* atoms, so everything above this line styles
   it too and the two headers cannot drift apart. Only three things are page-specific:
     a · the old title banner steps aside (the blue-edged title now does its job, page number and
         all).  Scoped to #spanel-summary so the BOQs page, which shares .summary-title-block and
         has NOT been reworked, is untouched.
     b · the font.  §"the 31 rules that hardcode Inter" targets .page-card; this page is
         .summary-page-card and declares Inter itself at quote-print:803, so the header needs
         telling directly.
     c · the quantity run that replaced the Notes column.
   ──────────────────────────────────────────────────────────────────────────────────────────── */

/* a · OLD BANNER ASIDE (hidden, not deleted — the flag brings it back).
   The ID is there to beat quote-print:917/918, which reach these with (1,2,0). */
body.atiq-stage-v2 .quote-view #spanel-summary .summary-title-block{ display:none!important; }

/* b · FONT */
body.atiq-stage-v2 .quote-view .sum-hd,
body.atiq-stage-v2 .quote-view .sum-hd *{ font-family:var(--v2-font)!important; }
body.atiq-stage-v2 .quote-view .sum-hd .sv2-lb{ font-family:var(--v2-narrow)!important; }

/* c · THE QUANTITY RUN.
   Same column the notes used, same 13px drop as the price stack beside it so the three columns
   start on one line. */
body.atiq-stage-v2 .quote-view .summary-qty-band{ padding:13px 10px 0 0; }
/* [088500] .sum-run / .sum-v / .sum-d were deleted here — they styled the dot-separated run
   ("186m² · 94m · 12 piers") that mock A replaced with the labelled three-cell band. The markup
   has been .sum-q3 / .sum-q / .sum-ql / .sum-qv since 082000; these rules have matched nothing
   for six builds. Found by _deadclass.js, not by eye. */

/* notes, when there are any, below a rule — so they read as an addition to the figures rather
   than a second column competing with them */
body.atiq-stage-v2 .quote-view .sum-keep{
  margin-top:9px; padding-top:8px; border-top:1px solid var(--v2-line);
}
/* [111000] ON THE SUMMARY the notes are a fourth child of the row grid rather than a child of
   the middle column, so they span every track and start at the row's own left edge — under the
   stage name, not under the figures. Scoped to #spanel-summary: the BoQs page shares .sum-keep
   and is left exactly as it was. */
body.atiq-stage-v2 .quote-view #spanel-summary .sum-keep{
  grid-column:1 / -1; margin-top:10px; padding-top:8px; text-align:left;
}
body.atiq-stage-v2 .quote-view #spanel-summary .sum-keep .summary-stage-notestext{
  max-width:72ch;   /* a note should not run the full 1021px — that is a hard line to read */
}
body.atiq-stage-v2 .quote-view .sum-keep .summary-stage-subhead{ margin-bottom:3px!important; }

@media print{
  body.atiq-stage-v2 .quote-view .sum-keep{ border-top-color:#e4e4e0!important; }
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   [082500]  SUMMARY ROWS — THE THREE FIGURES GET THEIR LABELS BACK.  Mock A.

   The 080000 pass shipped an unlabelled inline run, and it was confusing for two reasons rather
   than one: only two of the three figures carry a unit, and dropping a zero moved the remaining
   figures left, so there was no stable position to read. Label above figure, em-dash for nil, in
   the same order as the stage header — so the three positions are learned once and used twice.
   Labels sit at 7px/700 to match .summary-stage-subhead, which is the page's existing caption size.
   ──────────────────────────────────────────────────────────────────────────────────────────── */
body.atiq-stage-v2 .quote-view .sum-q3{ display:flex; gap:33.41px; font-family:var(--v2-font); }
body.atiq-stage-v2 .quote-view .sum-ql{
  font-size:8.995px; font-weight:700; color:var(--v2-ink3);
  text-transform:uppercase; letter-spacing:.1em; margin-bottom:3.855px; white-space:nowrap;
}
body.atiq-stage-v2 .quote-view .sum-qv{
  font-size:16.705px; font-weight:700; color:var(--v2-measured);
  font-variant-numeric:tabular-nums; letter-spacing:-.02em; line-height:1;
}
body.atiq-stage-v2 .quote-view .sum-qv u{
  font-size:10.9225px; font-weight:600; text-decoration:none; color:var(--v2-ink3);
  margin-left:2.57px; letter-spacing:0;
}
/* a nil has to read as "none here", not as a figure — hence ink4 and no accent */
body.atiq-stage-v2 .quote-view .sum-qv.nil{ color:var(--v2-ink4); font-weight:500; }

@media print{
  body.atiq-stage-v2 .quote-view .sum-qv{ color:#1a1a18!important; }
  body.atiq-stage-v2 .quote-view .sum-qv u{ color:#71716c!important; }
  body.atiq-stage-v2 .quote-view .sum-qv.nil{ color:#b0b0ac!important; }
  body.atiq-stage-v2 .quote-view .sum-ql{ color:#71716c!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [083000]  FIND SIMILAR — THE PANEL, REBUILT.   Mocks F1 + C1 + C2 + D3.

   Written here rather than in quote-print.css because the panel MOUNTS ON document.body — it is
   outside .quote-view, so nothing scoped there reaches it (the same trap that left the number
   spinner in the labour popup). .sim-panel declares its own token set, so these rules name colours
   directly instead of reaching for --v2-* , which would resolve to nothing.

   WHAT CHANGED AND WHY
     · LIST + DETAIL.  Three self-contained cards meant the four row labels appeared three times,
       your own figures appeared three times, and the job name was being used as a table heading —
       which is why it set vertically. One list, one table, one labour list.
     · THE LABOUR IS THE BODY, not a "see labour" toggle. It is what Use actually copies, so it is
       what the panel should be mostly made of.
     · COLOUR MEANS CONFIDENCE.  Green ≥90, blue 78–89, amber below — one meaning, and blue keeps
       its existing job of "a measured figure". Green is #5ac98a (8.59:1 here) and amber #e8a33d
       (8.24:1); both clear AA. The money total is green too: it is the figure the decision turns on.
     · THE DIFFERENCE IS AN AMOUNT, NOT A PERCENT, in a tinted chip rather than coloured numerals.
       Green and red on bare figures read as pass/fail, and bigger-or-smaller is not pass/fail — a
       precedent whose slab is 6.7m² under yours has not failed anything. The tint keeps the
       direction and drops the verdict.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

.sim-panel{ width:660px!important; max-width:calc(100vw - 20px); }
.sim-panel .sim-body{ padding:0; }
/* ⚠ .sim-2col, NOT .sim-split — quote-print.css:2165 ALREADY DEFINES .sim-split as
   `display:flex; gap:14px; margin:8px 0 6px 65px` for the old work/size pair. Reusing the name put
   a 65px left margin on this grid that no rule here mentioned, and the list sat in from the panel
   edge by exactly that. `display:grid` won on file order so the layout looked right and only the
   margin survived, which is the worst kind of collision: the thing you can see is correct.
   The note at the top of this file says to grep a class name before using it. I did not. */
.sim-2col{ display:grid; grid-template-columns:190px minmax(0,1fr); align-items:stretch; }

/* ── the list ─────────────────────────────────────────────────────────────────────────────── */
.sim-panel .sim-list{
  border-right:1px solid var(--border-md); padding:8px;
  display:flex; flex-direction:column; gap:4px; align-content:start;
}
.sim-panel .sim-li{
  display:flex; align-items:flex-start; gap:9px; width:100%; text-align:left; cursor:pointer;
  background:none; border:1px solid transparent; border-radius:7px; padding:8px 9px;
  font-family:inherit; color:var(--text-muted);
}
.sim-panel .sim-li:hover{ background:rgba(255,255,255,.04); }
body.light .sim-panel .sim-li:hover{ background:rgba(0,0,0,.035); }
.sim-panel .sim-li.on{ background:rgba(90,169,240,.12); border-color:rgba(90,169,240,.45); }
.sim-panel .sim-lpc{
  font-size:12.5px; font-weight:800; line-height:1.3; flex:0 0 auto;
  font-variant-numeric:tabular-nums; color:#5aa9f0;
}
.sim-panel .sim-lpc.hi{ color:#5ac98a; }
.sim-panel .sim-lpc.lo{ color:#e8a33d; }
.sim-panel .sim-lnm{ display:flex; flex-direction:column; min-width:0; flex:1; }
.sim-panel .sim-lnm b{
  font-size:11px; font-weight:700; color:var(--text); letter-spacing:-.01em; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* the date reads as a filter, not as part of the address — so it is a pill, and a FILLED one:
   outlined at 7px it was invisible against the panel. */
.sim-panel .sim-date{
  align-self:flex-start; margin-top:5px; white-space:nowrap;
  font-size:8px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted); background:rgba(255,255,255,.075);
  border:1px solid var(--border-md); border-radius:20px; padding:3px 8px;
}
body.light .sim-panel .sim-date{ background:rgba(0,0,0,.05); }

/* ── the detail ───────────────────────────────────────────────────────────────────────────── */
.sim-panel .sim-detail{ padding:12px 14px 14px; min-width:0; }
.sim-panel .sim-dh{
  display:flex; align-items:flex-start; gap:8px;
  padding-bottom:11px; margin-bottom:11px; border-bottom:1px solid var(--border-md);
}
.sim-panel .sim-dt{ flex:1; min-width:0; }
.sim-panel .sim-dt b{
  display:block; font-size:14px; font-weight:800; letter-spacing:-.018em; line-height:1.25;
  color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.sim-panel .sim-dt em{
  display:block; font-style:normal; font-size:11.5px; font-weight:600; line-height:1.35;
  margin-top:1px; color:var(--text-muted);
}
/* the builder was 9px at the dimmest grey on the scale, which is why it vanished. The caption is
   what stops three stacked lines of similar type needing to be decoded by position. */
.sim-panel .sim-dt i{
  display:block; font-style:normal; font-size:10.5px; font-weight:600; margin-top:4px;
  color:var(--text-muted);
}
.sim-panel .sim-ck{
  font-size:7.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-dim); margin-right:7px;
}

/* ── the measures ─────────────────────────────────────────────────────────────────────────── */
.sim-panel .sim-fg{ width:100%; border-collapse:collapse; margin-bottom:13px; }
.sim-panel .sim-fg th{
  font-size:7.5px; font-weight:600; color:var(--text-muted); letter-spacing:.15em;
  text-transform:uppercase; text-align:right; padding:0 9px 5px;
  border-bottom:1px solid var(--border-md); white-space:nowrap;
}
.sim-panel .sim-fg th.l{ text-align:left; }
.sim-panel .sim-fg th:nth-child(2){ color:#5aa9f0; }
.sim-panel .sim-fg td{
  padding:5px 9px; font-size:11px; text-align:right; white-space:nowrap;
  border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums; color:var(--text);
}
.sim-panel .sim-fg td.l{
  text-align:left; font-size:7.5px; font-weight:700; color:var(--text-muted);
  text-transform:uppercase; letter-spacing:.1em;
}
.sim-panel .sim-fg td.mine{ color:#5aa9f0; background:rgba(90,169,240,.07); }
.sim-panel .sim-fg td.d{ width:88px; padding-left:4px; }
.sim-panel .sim-fg tr:last-child td{ border-bottom:none; }
.sim-panel .sim-nil, .sim-panel .sim-dz{ color:var(--text-dim); }
.sim-panel .sim-df{
  font-weight:700; font-variant-numeric:tabular-nums; font-size:10px;
  border-radius:5px; padding:2px 6px; color:var(--text);
}
.sim-panel .sim-df.up{ background:rgba(143,220,174,.16); }
.sim-panel .sim-df.dn{ background:rgba(240,167,154,.16); }
body.light .sim-panel .sim-df.up{ background:rgba(45,122,58,.14); }
body.light .sim-panel .sim-df.dn{ background:rgba(184,32,32,.11); }
.sim-panel .sim-df u, .sim-panel .sim-fg u{
  text-decoration:none; font-size:8px; font-weight:600; color:var(--text-muted); margin-left:1.5px;
}

/* ── the labour ───────────────────────────────────────────────────────────────────────────── */
.sim-panel .sim-lbh{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:6px; }
.sim-panel .sim-lbh span{
  font-size:7.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--text-muted);
}
.sim-panel .sim-lbh em{ font-style:normal; font-size:10px; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.sim-panel .sim-lbh em i{ font-style:normal; color:var(--text-dim); margin:0 2px; }
.sim-panel .sim-lbh em b{ font-size:11.5px; font-weight:800; margin-left:2px; color:#5ac98a; }
body.light .sim-panel .sim-lbh em b{ color:#2d7a3a; }
.sim-panel .sim-lb{ width:100%; border-collapse:collapse; }
/* [083500] LIGHTER. Every description and every total was --text at 600, so eighteen rows of
   near-white bold ran down the panel with nothing to tell a task from a total from a subtotal.
   Weight now carries the hierarchy and colour stays out of it: descriptions 500, money 600, and
   the hairline between rows drops to a third of its strength because at this row height a full
   border reads as a grid. */
.sim-panel .sim-lb td{
  padding:4px 0; font-size:10px; text-align:right; white-space:nowrap;
  border-bottom:1px solid rgba(255,255,255,.035); font-variant-numeric:tabular-nums;
  color:var(--text-muted); font-weight:500;
}
body.light .sim-panel .sim-lb td{ border-bottom-color:rgba(0,0,0,.05); }
.sim-panel .sim-lb td.l{
  text-align:left; color:var(--text-muted); font-weight:500; max-width:210px;
  overflow:hidden; text-overflow:ellipsis;
}
.sim-panel .sim-lb td.q{ width:32px; }
.sim-panel .sim-lb td.rt{ width:66px; }
.sim-panel .sim-lb td.r{ width:100.23px; color:var(--text); font-weight:600; }
/* a task row is the one that names real work, so it is the only full-ink line in the list */
.sim-panel .sim-lb tr.p td.l{ color:var(--text); font-weight:600; }
/* its day rows sit under it, indented and quiet — the same "X 4" shorthand as the stage card */
.sim-panel .sim-lb tr.d td{ border-bottom:none; padding-top:1px; padding-bottom:1px; }
.sim-panel .sim-lb tr.d td.l{
  padding-left:13px; font-size:9px; font-weight:600; color:var(--text-dim); letter-spacing:.02em;
}
.sim-panel .sim-lb tr.d td.r{ font-size:11.565px; font-weight:500; color:var(--text-dim); }
.sim-panel .sim-lb tr.g td{
  font-size:7.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#5aa9f0; padding-top:9px; border-bottom:1px solid var(--border-md);
}
.sim-panel .sim-lb tr.g td.r{ color:var(--text-muted); font-size:11.565px; letter-spacing:0; }
.sim-panel .sim-lb tr:last-child td{ border-bottom:none; }

/* ── footer note ──────────────────────────────────────────────────────────────────────────── */

@media (max-width:900px){
  .sim-panel{ width:calc(100vw - 20px)!important; }
  .sim-2col{ grid-template-columns:1fr; }
  .sim-panel .sim-list{ border-right:none; border-bottom:1px solid var(--border-md); flex-direction:row; flex-wrap:wrap; }
  .sim-panel .sim-li{ width:auto; flex:1 1 150px; }
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   [083000]  THE SUMMARY GRAND TOTAL, PINNED.  —  DELETED AT [100500].
   The bar it pinned no longer exists: the grand total moved into the header band and the footer
   went with it. _deadclass.js caught .summary-grand-pinned still being styled after nothing
   rendered it, which is exactly the job that guard exists to do.
   The rules were:
       .summary-grand-pinned{ margin-top:0!important; flex-shrink:0;
                              border-top:1px solid var(--v2-line2); }
       @media print{ .summary-grand-pinned{ border-top-color:#ddd!important; } }
   ──────────────────────────────────────────────────────────────────────────────────────────── */

/* THE DEAD PRINT RULES from before the header was replaced. quote-print.css:912-923 still colours
   #spanel-summary .page-card-header and .summary-title-eyebrow/.summary-title-main, all three of
   which are display:none since 080000/082500. Left in place — they cost nothing and deleting rules
   from the shared print sheet is how a revert stops being a revert — but noted here so the next
   person reading that block knows it is addressing elements that are no longer rendered. */

/* ────────────────────────────────────────────────────────────────────────────────────────────
   [084000]  SUMMARY HEADER — MONEY IN THE TITLE BLOCK.  Mock N1.

   The sv2 header is shared with the stage cards, so everything here is scoped to #spanel-summary.
   A stage card's blue-edged block still carries "Stage 1 / Courtyard Slab"; only the summary's
   carries figures.
   ──────────────────────────────────────────────────────────────────────────────────────────── */
/* [101000] THE WHOLE MONEY BLOCK WAS DELETED HERE — .sum-mon (at 100500), then .sum-mcell,
   .sum-ml and .sum-mv. The header's money is now one figure in .sv2-nm inside .sv2-stg, which is
   the stage card's own block, and $/m² is an .sv2-rc cell like every other figure in the run.
   Nothing rendered these any more; _deadclass.js is what said so.
   They were:
       .sum-mcell{ display:flex; flex-direction:column; min-width:0; }
       .sum-ml   { narrow 9px/600 ink3, .14em, uppercase, margin-bottom:5px }
       .sum-mv   { 17px/800, -.025em, tabular, --v2-ink }  .sum-mv.green{ #5ac98a / #2d7a3a } */
/* the page number, which the old title used to carry */
body.atiq-stage-v2 .quote-view #spanel-summary .sum-pg{
  font-family:var(--v2-narrow)!important; font-size:8px; font-weight:700; letter-spacing:.11em;
  text-transform:uppercase; color:var(--v2-ink3);
  border:1px solid var(--v2-line2); border-radius:20px; padding:2px 8px; white-space:nowrap;
}
@media print{
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-pg{ color:#71716c!important; border-color:#d4d4d0!important; }
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   [084000]  THE LABOUR POPUP'S NAME BOX sizes to its own text (width is set by lab2FitName).
   flex:0 0 auto so flex does not stretch it back, and the gap after it is what you grab to drag
   a card onto another.
   ──────────────────────────────────────────────────────────────────────────────────────────── */
.l2-nmin{ flex:0 0 auto!important; max-width:100%; }
.l2-gap{ flex:1 1 auto; min-width:10px; align-self:stretch; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [084500]  THE TAKE-OFF — WHAT COUNTS, AND WHAT DOESN'T.   Mocks T3 / R2 / C2 / D3 / V2.

   The problem this fixes is not decoration. EVERY measure in the take-off was blue, including the
   four groups per stage that feed nothing — so a group that sets the header figure looked exactly
   like one that does not, and blue, which means "a figure measured off a drawing" on the stage
   header, the summary and Find similar, meant nothing at all here.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* 1 · COUNTED GROUPS: THE FILL AND A WHITE NAME, AND NOTHING ELSE.
   [085000] The blue left edge is gone on James's call. It was doing work the fill, the white name,
   the blue measure and the chip were already doing between them — four signals for one fact. */
body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-counted .part-title-txt{
  color:#fff!important;                     /* was --v2-ink, one rung down — hence the off-white */
}

/* 2 · SUB ITEMS STEP BACK — HEADING ONLY.
   The material rows underneath are deliberately NOT touched: they are priced, they print, and
   shrinking data to signal importance is how a wrong quantity gets missed. */
body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-sub > td{
  background:none!important;
  border-top:none!important;
  border-bottom:1.285px solid var(--v2-line)!important;
}
body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-sub .part-title-txt{
  font-size:10.28px!important; font-weight:600!important; color:var(--v2-ink3)!important;
}
/* [086000] the measure matches ITS OWN ROW, not the rows beneath it. White was tried (085000)
   because the child totals below are white — but those belong to the materials, and a sub-item
   heading reading brighter than its own name was the wrong comparison. Name and measure now agree
   at --v2-ink3, so the row reads as one thing. */
body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-sub .sec-measure-pill{
  font-size:12.2075px!important; font-weight:600!important; color:var(--v2-ink3)!important;
}

/* 3 · THE DIMENSIONS IN BRACKETS, AT 86%.
   (300W X 300D) is what was drawn and [450W X 350D] is what is being built — that second one is
   exactly what you check when a measure looks wrong, so it is reduced, never hidden. em, so it
   tracks whichever tier the row is in. */
body.atiq-stage-v2 .quote-view .tk-brk{ font-size:.86em; color:var(--v2-ink2); }
body.atiq-stage-v2 .quote-view tr.tk-sub .tk-brk{ color:var(--v2-ink4); }

/* 4 · THE BUCKET CHIP — which of the three figures this group feeds */
body.atiq-stage-v2 .quote-view .tk-tag{
  /* [085000] margin-left:auto pins it to the right edge of the name column, next to the measure,
     instead of trailing the name and pushing the title into an ellipsis it did not need. */
  flex:0 0 auto; margin-left:auto;
  font-family:var(--v2-narrow)!important; font-size:8.995px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; white-space:nowrap;
  color:var(--v2-measured); background:rgba(90,169,240,.13);
  border-radius:25.7px; padding:2.57px 8.995px; line-height:1.4;
}
body.light.atiq-stage-v2 .quote-view .tk-tag{ background:rgba(26,95,191,.1); }

/* 5 · THE "SUB ITEMS" BREAK — inner level: line, words, line, inset */
body.atiq-stage-v2 .quote-view tr.tk-subdiv td{
  background:none!important; border:none!important; padding:11.565px 7.71px 8.995px!important;
}
body.atiq-stage-v2 .quote-view tr.tk-subdiv td{ position:relative; }
body.atiq-stage-v2 .quote-view tr.tk-subdiv span{
  display:flex; align-items:center; gap:10.28px;
  font-family:var(--v2-narrow)!important; font-size:8.995px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--v2-ink4); white-space:nowrap;
}
body.atiq-stage-v2 .quote-view tr.tk-subdiv span::before,
body.atiq-stage-v2 .quote-view tr.tk-subdiv span::after{
  content:''; height:1.285px; background:var(--v2-line2); flex:1;
}

/* 6 · THE SECTION BREAK — outer level, V2: inset rule, heading carries the weight.
   Both rules are the same width, so the SIZE and COLOUR of the heading beneath is what ranks
   them — which is why the section name goes white and its sub-name drops back. */
/* ⚠ !important IS LOAD-BEARING HERE. quote-print.css:1279 says `.section-card{border:none!important}`
   — a shorthand, so it kills border-top too, and !important beats specificity no matter how many
   classes this selector carries. Without it this rule is correct, higher-specificity and silently
   does nothing, which is exactly what happened in 084500. */
body.atiq-stage-v2 .quote-view .section-card + .section-card{
  border-top:1.285px solid var(--v2-rule)!important;
  margin-top:19.275px; padding-top:16.705px;
}
body.light.atiq-stage-v2 .quote-view .section-card + .section-card{ border-top-color:rgba(0,0,0,.7)!important; }
@media print{
  body.atiq-stage-v2 .quote-view .section-card + .section-card{ border-top-color:#111!important; }
  body.atiq-stage-v2 .quote-view tr.tk-subdiv span::before,
  body.atiq-stage-v2 .quote-view tr.tk-subdiv span::after{ background:#d4d4d0!important; }
  body.atiq-stage-v2 .quote-view tr.tk-subdiv span{ color:#71716c!important; }
  /* [137000] the grey 3px bar that stood in for the tag on paper is gone: the outlined tag prints
     now (design/stage.html), and the bar was the old take-off style the design dropped */
  body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-counted .part-title-txt{ color:#111!important; }
}

/* 7 · THE MEASURE MATCHES THE OTHER BLUE TOTALS.
   11px is Materials Total and Labour Total; this was 11.5px, which made the three figures you
   compare all day very slightly disagree about their own importance. */
body.atiq-stage-v2 .quote-view .sec-measure-pill{ font-size:14.135px!important; }


/* [085000] THE RIGHT-HAND TRIO, TIGHT.
   With real columns behind them (24 / 56 / 38px) the cells can finally be pulled together: the
   divide button right-aligns against the measure instead of floating at the left edge of a cell
   that used to be 20% of the table. */
body.atiq-stage-v2 .quote-view .section-card .tbl td.part-div-cell{
  text-align:right!important; padding-right:0!important; padding-left:0!important;
}
body.atiq-stage-v2 .quote-view .section-card .tbl td.part-unit-cell{
  padding-left:3.855px!important;
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [085500]  TWO FIXES THAT NEEDED THE CASCADE, NOT MORE CSS.

   1 · THE HAIRLINE ABOVE A DIVIDER.  Setting td.style.borderBottom='none' from JS did nothing,
       because §"ONE ROW RULE" above declares it !important on .tbl-item-row td — and !important
       beats an inline style. A class at higher specificity, with !important, is the only thing
       that wins.
   2 · THE COLUMN WIDTHS.  The colgroup is now 100% / 18 / 46 / 30, which is the shape the rest of
       this sheet already assumed. These rules restate the same numbers on the CELLS so the two
       mechanisms cannot disagree — table-layout:fixed reads <col> first, but a dozen nth-child
       width rules in quote-print.css aim at the same columns and have fooled me twice.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tk-noline td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-noline td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-noline td{
  border-bottom:none!important;
}

/* the right-hand three, stated on the cells as well as the columns */
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-part-row td.part-div-cell,
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-item-row td:nth-child(2){
  width:23.13px!important; padding-left:0!important; padding-right:0!important; text-align:right!important;
}
/* [086000] 46 → 32px. The figure is right-aligned, so the gap between ÷ and the number is
   whatever the cell has left over — at 46px a two-digit quantity like "15" left ~30px of air.
   Quantities round now, so four digits is the realistic worst case and 32px holds it at 11px
   tabular. The item rows beneath show 2dp ("12.65") at 8px, which also fits. */
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-part-row td.part-val-cell,
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-item-row td:nth-child(3){
  width:41.12px!important; padding-left:2.57px!important; padding-right:2.57px!important; text-align:right!important;
}
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-part-row td.part-unit-cell,
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-item-row td:nth-child(4){
  width:38.55px!important; padding-left:5.14px!important; padding-right:6.425px!important; text-align:left!important;
}
/* and column 1 keeps every pixel the other three do not take */
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-part-row td:first-child,
body.atiq-stage-v2 .quote-view .section-card .tbl tbody tr.tbl-item-row td:first-child{
  width:100%!important;
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [086500]  LIGHT MODE — the colours added since 080000 that only ever worked on dark.

   Audited rather than eyeballed: every declaration in this file setting a LITERAL colour was
   listed and checked for a body.light rule naming the same terminal class. Thirteen of the hits
   turned out to be inside @media print, which is already light by definition. The rest are below,
   and every one of them failed WCAG AA on white:
       #5aa9f0 blue   2.51:1      -> #1a5fbf  6.12:1
       #5ac98a green  2.07:1      -> #2d7a3a  5.31:1
       #e8a33d amber  2.16:1      -> #b85c00  4.60:1
       #ffffff name   1.00:1      -> #111111 17.4:1   (white on a white card — invisible)
   The take-off group name is the serious one: in light mode the groups that DRIVE the three
   figures were the only rows you could not read.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* the counted group name — #fff is invisible on a white card */
body.light.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-counted .part-title-txt{
  color:#111!important;
}

/* FIND SIMILAR — the panel declares its own tokens, so these name colours directly */
body.light .sim-panel .sim-lpc{ color:#1a5fbf; }
body.light .sim-panel .sim-lpc.hi{ color:#2d7a3a; }
body.light .sim-panel .sim-lpc.lo{ color:#b85c00; }
body.light .sim-panel .sim-fg th:nth-child(2){ color:#1a5fbf; }
body.light .sim-panel .sim-fg td.mine{ color:#1a5fbf; background:rgba(26,95,191,.07); }
body.light .sim-panel .sim-lb tr.g td{ color:#1a5fbf; }
body.light .sim-panel .sim-li.on{ background:rgba(26,95,191,.09); border-color:rgba(26,95,191,.4); }
/* the diff chips: the dark tints are near-invisible on white, and the near-white figure vanishes */
body.light .sim-panel .sim-df{ color:#1a1a18; }
body.light .sim-panel .sim-df.up{ background:rgba(45,122,58,.15); }
body.light .sim-panel .sim-df.dn{ background:rgba(184,32,32,.12); }

/* ── Second pass, same build. The first pass was done by eye over the file and missed these two,
   because the eye matches on "is there a body.light rule nearby" and both of them HAVE one for
   the base class — it is the MODIFIER that was never given a light value. _lightmode.js now
   matches on the TERMINAL class of the selector instead and catches exactly this.

   Both are text, so both actually fail to be readable rather than merely looking off:
     .sec-measure-pill.measure-moved   amber #e8a33d on white  2.16:1  -> #b85c00  4.60:1
     .pricing-ac-menu-portal .pac-desc b  blue #5aa9f0 on white 2.51:1 -> #1a5fbf  6.12:1
   Same two substitutions already used above, so light mode has one amber and one blue, not four.

   The five remaining hits the guard lists are rgba backgrounds at .07-.10 alpha (.item-added,
   .row-editing, .lab-group-title-editable, .qty-stepper:focus, .sv2-pill-hi). A 7-10% blue over
   white is a pale blue wash that reads correctly on either theme, and none of them sets a text
   colour, so there is nothing to fail. The guard exempts low-alpha backgrounds for that reason. */

/* the "moved" measurement — amber is the one colour that means "this was moved by hand".
   [097500] border-color dropped with the ring itself; only the text colour is left to set. */
body.light.atiq-stage-v2 .quote-view .sec-measure-pill.measure-moved{
  color:#b85c00!important;
}
/* the matched substring in the pricing autocomplete, and the "add new" plus */
body.light.atiq-stage-v2 .pricing-ac-menu-portal .pac-desc b,
body.light.atiq-stage-v2 .pricing-ac-menu-portal .pac-none .pac-plus{ color:#1a5fbf!important; }

/* ── Third hit: the Find similar pill's border. Its TEXT is var(--v2-measured), which light mode
   already redefines at :50, so only the border literal was stranded.
   rgba(90,169,240,.55) composites to 3.00:1 on the dark card — soft on purpose, a hint not a
   button — but to 1.62:1 on white, which is a border you cannot see. .7 of the light blue is
   3.3:1: back over the 3:1 line for a UI boundary while staying a hint. Measured, not guessed. */
body.light.atiq-stage-v2 .quote-view .sv2-pill-hi{
  border-color:rgba(26,95,191,.7)!important;
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [087000]  SECTION CARDS

   Every section on the stage page sits in its own card: each take-off section, the material
   schedule, and the labour block. The COLUMN TITLES stay outside — Take-off, Material Schedule
   and Labour & Site Prelims all sit on the page, so the three columns start on the same line and
   the cards beneath them line up across the width of the sheet.

   Take-off needed no markup change: a section is already a .section-card with the "Take-off"
   title as its sibling. The two right-hand panels got one wrapper div each from
   sv2WrapPanelCard() in stagecard.js — that helper MOVES nodes rather than rebuilding them, so
   the listeners bound through renderCard() survive; _panelwrap.js in the scratchpad fails if that
   ever changes.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* THE CARD HAIRLINE IS ITS OWN TOKEN, not --v2-line2.
   --v2-line2 draws row rules, cell dividers and the header underlines all over this sheet;
   brightening it to suit the cards would have lifted every one of those with it. A card-only
   token moves the cards and nothing else.
   Measured against the fill it encloses (--v2-lift), not picked by eye:
       dark   rgba(255,255,255,.15) 1.61:1  ->  .22  2.05:1
       light  rgba(0,0,0,.14)       1.38:1  ->  .20  1.60:1
   Brightness rather than thickness, deliberately. The page is zoomed 1.285 on screen, so 1.5px
   renders as ~1.9px and goes soft rather than crisper; and at A4 1.5px is 0.38mm of ink against
   0.25mm for 1px, which is a heavy line on a printed quote. Brightness costs nothing either way. */
body.atiq-stage-v2 .quote-view{ --v2-cardline:rgba(255,255,255,.22); }
body.light.atiq-stage-v2 .quote-view{ --v2-cardline:rgba(0,0,0,.2); }

/* ⚠ !important IS LOAD-BEARING ON THE BORDER. quote-print.css:1279 says
   `.section-card{border:none!important}` — the same rule that silently ate the white section
   separator two builds ago. Without !important here the cards simply have no border and the
   fill is the only thing left. */
body.atiq-stage-v2 .quote-view .section-card,
body.atiq-stage-v2 .quote-view .panel-card{
  background:var(--v2-lift)!important;
  border:1.285px solid var(--v2-cardline)!important;
  border-radius:5.14px;
  padding:7.71px 8.995px;
  margin-bottom:10.28px;
}

/* the section title now sits inside its own card, so it no longer needs to hold space off the
   one above it */
body.atiq-stage-v2 .quote-view .section-card .section-card-header{
  padding:1.285px 1.285px 5.14px!important;
}

/* THE WHITE SPLITTER IS WHAT THE CARD REPLACES.
   It is not an element — :840 above draws it as `.section-card + .section-card{border-top}` in
   near-white. Left as it was, every section after the first gets a bright rule sitting directly
   on its own card edge: two separators doing one job, which reads as a mistake rather than as
   emphasis. Dropped to the card hairline so the card edge is the separator. */
body.atiq-stage-v2 .quote-view .section-card + .section-card{
  border-top:1.285px solid var(--v2-cardline)!important;
}

/* NO RULE UNDER THE COLUMN TITLES.
   quote-print.css:485 and :565 give both titles a border-bottom. With the content now in a card
   a few pixels below, that rule is a second horizontal line doing the same job as the card's top
   edge. The padding stays — only the line goes. */
body.atiq-stage-v2 .quote-view .col-breakdown-title,
body.atiq-stage-v2 .quote-view .col-section-title{
  border-bottom:none!important;
  /* [090000] 4+6 was 12.85px of air between a title and the card it names — wider than the gap
     BETWEEN cards (10.28px), so each title read as belonging to nothing. 1+3 puts it at 5.14px, half
     the gap between cards, which is what makes it read as attached to the one below it. */
  padding-bottom:1.285px!important;
  margin-bottom:3.855px!important;
}

/* LABOUR IS ONLY AS TALL AS ITS CONTENT.
   .col-labour is flex:1 so the column fills the page down to the footer. Without this the labour
   CARD inherits that stretch and draws its hairline all the way down with empty space inside it. */
body.atiq-stage-v2 .quote-view .col-labour{ display:flex; flex-direction:column; }
body.atiq-stage-v2 .quote-view .col-labour .panel-card{ flex:0 0 auto; }

/* PRINT. The fill is a screen affordance; on paper it is a grey wash behind every figure on the
   page and it costs toner on every quote. The hairline survives, because the grouping is the
   point and it is what the reader uses to tell one section from the next. */
@media print{
  body.atiq-stage-v2 .quote-view .section-card,
  body.atiq-stage-v2 .quote-view .panel-card{
    background:none!important;
    border-color:#c8c8c4!important;
  }
  body.atiq-stage-v2 .quote-view .section-card + .section-card{ border-top-color:#c8c8c4!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [087500]  ONE HEADING SIZE, AND THE MATERIAL SCHEDULE BROUGHT INTO LINE

   James's call, and it is the right reading: FOOTINGS · HOUSE, CONCRETE and LABOUR all do the
   same job for a reader — they name a block of line items. That one is a card title and the other
   two are rows inside a card is an implementation detail nobody looking at the page can see.
   So all three sit at 8.5px, and the take-off's inner tiers step down to keep their order.

   THE LADDER, after this block:
       8.5px   names a block   section title / labour group / materials group
       8px     counted group   EB1 - EDGE BEAM
       8px     sub-item head   FOOTINGS BARS            (colour and weight separate these three,
       8px     data rows       3TM11, Concrete           not size — see below)
   Nothing on a printed row goes under 8px. The earlier draft took the sub-item heading to 7.5px
   to keep a strictly descending ladder; that was dropped because these rows carry quantities and
   print, and we already settled on the take-off that shrinking a priced row is how a wrong number
   gets missed. Below 8.5px the tiers are carried by colour, weight and fill — which is already how
   a counted group tells itself apart from the data rows beneath it, so it is not a new idea.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* 1 · THE THREE HEADINGS, ONE SIZE.
   Tracking stays at .09em: it was set for 9.5px and at 8.5px it reads a touch tighter, which is
   the right direction — a smaller heading wants proportionally more air, not less, and .09em at
   8.5px is still more open than the .06em on the counted group below it. */
body.atiq-stage-v2 .quote-view .section-header-title,
body.atiq-stage-v2 .quote-view .lab-group-b3 td{
  font-size:10.9225px!important; letter-spacing:.09em!important;
}

/* 2 · THE TAKE-OFF'S INNER TIERS STEP DOWN WITH IT, so the section title keeps its lead instead
   of landing on top of the counted group row it sits above. */
body.atiq-stage-v2 .quote-view tr.tbl-part-row td{ font-size:10.28px!important; }
body.atiq-stage-v2 .quote-view tr.tbl-part-row.tk-sub .part-title-txt{ font-size:10.28px!important; }

/* ── MATERIAL SCHEDULE ──────────────────────────────────────────────────────────────────────
   Grouped by material type, the way the labour card groups. The heading row reuses
   .lab-group-b3 so the two panels cannot drift apart; only the name and the group total below
   are new.
   ──────────────────────────────────────────────────────────────────────────────────────────── */

/* the group name. .lab-group-title-editable is deliberately NOT used — it carries a rename
   handler and a pointer cursor, and a material group is derived from the description, not typed. */
body.atiq-stage-v2 .quote-view .mat-group-name{ display:inline-block; padding:0 3.855px; }

/* QTY AND ITS UNIT, AS ONE PAIR.
   They stay two <td>s — edit mode builds its own five cells and changing the column count would
   break it — so the pairing is done with COLUMN WIDTHS, exactly as the take-off does it with
   .part-val-cell / .part-unit-cell. The qty column right-aligns, the unit column left-aligns hard
   against it with almost no padding, and "18.47 m³" reads as one fact instead of two.
   ⚠ The widths live in buildQtyTbl's colgroup (38/14/10/14/16). Under table-layout:fixed the
   <col> wins and a td rule is decoration — the same trap that cost three builds on the take-off.
   These rules only set ALIGNMENT and PADDING, never width. */
body.atiq-stage-v2 .quote-view .mat-auto-row td:nth-child(2),
body.atiq-stage-v2 .quote-view .tbl-manual-row td:nth-child(2){
  text-align:right!important; padding-right:3.855px!important;
}
body.atiq-stage-v2 .quote-view .mat-auto-row td:nth-child(3),
body.atiq-stage-v2 .quote-view .tbl-manual-row td:nth-child(3){
  text-align:left!important; padding-left:0!important;
  font-size:10.28px!important; color:var(--v2-ink3)!important; font-weight:600!important;
}

/* THE TOTALS END THE WAY LABOUR'S DO.
   Subtotal and markup step back to supporting figures; Materials Total is the one conclusion, at
   the same size and weight as Labour Total so the two cards finish on the same note.
   The elements are the shipped ones — .subtotal-row-padded, .markup-row, .markup-total-row — so
   the markup input and every listener on it are untouched. */
body.atiq-stage-v2 .quote-view .subtotal-row-padded{
  font-size:10.9225px!important; color:var(--v2-ink2)!important;
  border-top:1.285px solid var(--v2-line2)!important; padding:5.14px 5.14px 3.855px!important;
}
body.atiq-stage-v2 .quote-view .markup-section{ border-top:none!important; padding-top:0!important; }
body.atiq-stage-v2 .quote-view .markup-row{
  font-size:10.9225px!important; color:var(--v2-ink2)!important; padding:2.57px 5.14px 5.14px!important;
}
body.atiq-stage-v2 .quote-view .markup-total-row{
  border-top:1.285px solid var(--v2-line2)!important; padding:6.425px 5.14px 2.57px!important;
}
body.atiq-stage-v2 .quote-view .markup-total-label{
  font-size:12.85px!important; font-weight:700!important; color:var(--v2-ink)!important;
  text-transform:none!important; letter-spacing:0!important;
}
body.atiq-stage-v2 .quote-view .markup-total-value{
  font-size:15.42px!important; font-weight:700!important; color:var(--v2-measured)!important;
}

/* PRINT. The group heading survives — it is the structure a reader uses to find a line on paper.
   Blue goes to near-black, as every other blue on this sheet does when it prints. */
@media print{
  body.atiq-stage-v2 .quote-view .markup-total-value{ color:#1a1a18!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [088000]  THE CARD GROWS · SUB ITEMS QUIETEN · THE TWO PANELS END THE SAME WAY
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE STAGE CARD IS NO LONGER A FIXED BOX ────────────────────────────────────────────
   quote-print.css:462 pins it to height:1123px with overflow:hidden, so a busy stage was simply
   cut off at the bottom edge. min-height keeps every stage that already fits exactly where it is
   — .page-card-body is flex:1, so a short stage still pushes its footer to the bottom — and lets
   a long one grow instead of losing rows. */
body.atiq-stage-v2 .quote-view .page-card{
  height:auto!important; min-height:1443.055px!important;
  /* [090500] overflow is BACK to hidden. 088000 set it visible so a busy stage could grow —
     which it never needed: height:auto already does that, and overflow only ever clips what
     exceeds the box. What overflow:hidden actually does here is clip content to the card's
     border-radius, so turning it off left square content poking out of the rounded corners.
     Safe to restore: the two things that must escape the card both portal to <body> — the
     pricing autocomplete (.pricing-ac-menu-portal) and the copy-from-stage menu. */
  overflow:hidden!important;
}

/* ── 2 · SUB ITEMS ──────────────────────────────────────────────────────────────────────────
   ⚠ SPECIFICITY IS THE POINT OF THESE SELECTORS, NOT DECORATION.
   The first attempt at this was written at (0,4,2) and lost to the row rules at :147 and :783,
   which sit at (0,5,4) and (0,4,3). Both carried !important, so specificity decided it and the
   borders simply stayed — the third time on this project a rule has been written, watched to do
   nothing, and had its VALUE adjusted when it had never won in the first place.
   These are (0,6,4). _specificity.js in the scratchpad resolves every rival for each of these
   properties and fails if any of them ever outranks these again. */
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-subkid td{
  border-top:none!important; border-bottom:none!important;
  padding-top:1.285px!important; padding-bottom:1.285px!important;
}
/* the SUB ITEMS label keeps a little air above it. Its own hairlines are ::before/::after on the
   span rather than borders, so they survive the rule above — and they should: with every row
   border gone, that label is the only thing left marking where the block starts. */
body.atiq-stage-v2 .quote-view tr.tk-subdiv td{
  padding-top:6.425px!important; padding-bottom:2.57px!important;
}

/* COLOUR — scheme B, "the counted pattern, one step down".
   What was wrong: tr.tbl-item-row td colours EVERY material row on the take-off at ink2, and
   until .tk-subkid existed there was no way to tell a row under a counted group from a row under
   a sub item. So the children of a sub item were brighter than the sub-item heading above them
   and the hierarchy read upside down. Four tiers were in play across eight elements.
   Now: the sub block copies the counted block's pattern and shifts every part one tier dimmer.
       heading name   ink3 -> ink2      (above its children, as a heading should be)
       heading figure ink3 -> ink2      (agrees with its own name, as it has since 086000)
       heading unit   ink3 -> ink4      (a tier under its figure, matching the counted rows)
       child name/qty ink2 -> ink3      (below their heading — this is the fault being fixed)
       child unit     ink3 -> ink4
   Three tiers, one pattern, and the whole block recedes from the counted rows as a unit. */
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub .part-title-txt,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub .sec-measure-pill{
  color:var(--v2-ink2)!important;
}
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub td.part-unit-cell{
  color:var(--v2-ink4)!important;
}
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-subkid td{
  color:var(--v2-ink3)!important;
}
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-subkid td:last-child{
  color:var(--v2-ink4)!important;
}

/* ── 3 · MATERIALS DATA ROWS LINE UP WITH LABOUR'S ──────────────────────────────────────────
   Labour puts its group heading at 9px and its rows at 16px. Materials had the heading at ~9px
   and the rows at 7px, inherited from the generic .tbl td{padding:3px 7px} — so the data sat two
   pixels LEFT of its own heading and the heading was what looked indented. Same 16px labour uses. */
body.atiq-stage-v2 .quote-view .mat-auto-row td:first-child,
body.atiq-stage-v2 .quote-view .tbl-manual-row td:first-child{ padding-left:20.56px!important; }

/* ── 4 · TOTALS — T3, AND BOTH PANELS END THE SAME WAY ──────────────────────────────────────
   Three structural faults were making this block look arbitrary:
     a) .markup-section carries its own padding:0 5px, so the markup row sat 5px right of the
        subtotal and total rows it is a sibling of;
     b) .markup-row is a three-child flex with space-between, parking the % control in the dead
        centre of the row, aligned to nothing above it;
     c) the three rows carried three different vertical paddings.
   T3 answers all three by demoting subtotal and markup to one quiet supporting line and leaving
   Materials Total as the only full row — which is exactly how the labour card ends. */
body.atiq-stage-v2 .quote-view .markup-section{ padding:0!important; }
body.atiq-stage-v2 .quote-view .subtotal-row-padded{
  border-top:1.285px solid var(--v2-line2)!important; padding:5.14px 8.995px 1.285px!important;
  font-size:10.28px!important; color:var(--v2-ink3)!important;
}
body.atiq-stage-v2 .quote-view .markup-row{
  border-top:none!important; padding:0 8.995px 5.14px!important;
}
body.atiq-stage-v2 .quote-view .markup-row .markup-label,
body.atiq-stage-v2 .quote-view .markup-row .markup-value{
  font-size:10.28px!important; color:var(--v2-ink3)!important; font-weight:500!important;
}
body.atiq-stage-v2 .quote-view .markup-total-row{ padding:6.425px 8.995px!important; margin:0!important; }
body.atiq-stage-v2 .quote-view .lab-total-row{ padding:6.425px 8.995px!important; }

/* the markup field was the only boxed input on the page. An underline instead — still editable,
   every listener untouched, this is CSS over the shipped element. */
body.atiq-stage-v2 .quote-view .markup-pct-input{
  width:25.7px!important; background:none!important; border:none!important;
  border-bottom:1.285px solid var(--v2-line2)!important; border-radius:0!important;
  color:var(--v2-ink)!important; font-weight:700!important; text-align:center!important;
  padding:0!important; height:auto!important; box-shadow:none!important;
}
body.atiq-stage-v2 .quote-view .markup-pct-input:focus{
  outline:none!important; border-bottom-color:var(--v2-measured)!important;
}
/* [098500] Firefox draws spinner arrows on a number input and ignores the ::-webkit- rules that
   strip them everywhere else (quote-print.css:319). On a 20px field they sit on the digits. The
   print rule at :901 already sets this; it was simply never set for the screen. */
body.atiq-stage-v2 .quote-view .markup-pct-input{ -moz-appearance:textfield!important; }

/* LABOUR TOTAL TAKES THE SAME SPECS AS MATERIALS TOTAL. One pair of rules serving both panels, so
   they cannot drift apart later — which is how they ended up different in the first place. */
/* ⚠ `span.` AND `.page-card` ARE BOTH LOad-BEARING in these two selectors.
   The 075000 rules at :190 and :194 are written `.lab-total-row span.labour-total-label` — the
   element qualifier puts them at (0,4,2). Written the obvious way, without `span` and without
   `.page-card`, these land at (0,4,1) and LOSE, and the labour total would have quietly kept its
   old 9px grey while the materials total moved — precisely the mismatch this is meant to fix.
   Caught by _specificity.js before it shipped, not by eye. (0,5,2) wins outright; a bare tie
   decided by file order would have been one reshuffle away from breaking again. */
body.atiq-stage-v2 .quote-view .page-card .markup-total-label,
body.atiq-stage-v2 .quote-view .page-card .lab-total-row span.labour-total-label{
  font-size:12.85px!important; font-weight:700!important; color:var(--v2-ink)!important;
  text-transform:none!important; letter-spacing:0!important;
}
body.atiq-stage-v2 .quote-view .page-card .markup-total-value,
body.atiq-stage-v2 .quote-view .page-card .lab-total-row span.labour-total-value{
  font-size:15.42px!important; font-weight:700!important; color:var(--v2-measured)!important;
}

/* ── 5 · PRINT ──────────────────────────────────────────────────────────────────────────────
   NOTHING IS CLIPPED ANY MORE. The old rule was height:287mm with overflow:hidden; 287mm is about
   1085px against a 1123px card, so every stage was already losing ~38px off the bottom on paper
   with nothing on screen to say so. The card now takes its natural height and --pz zooms it so
   the whole stage lands on one sheet. core.js sets --pz on beforeprint; absent it, var() falls
   back to 1 and the card simply prints at full size, so a failure to run the hook cannot produce
   a blank or mangled page — only the behaviour we had before, minus the clipping.
   ⚠ PRINT CANNOT BE VERIFIED FROM HERE. Needs a real print preview on James's machine. */
@media print{
  body.atiq-stage-v2 .quote-view .page-card{
    zoom:var(--pz,.778210117)!important;
    height:auto!important; min-height:0!important; overflow:visible!important;
    page-break-inside:avoid!important;
  }
  /* if a card ever does break across sheets (the --pz floor in core.js allows it rather than
     shrinking to illegibility), break between rows and never through one */
  body.atiq-stage-v2 .quote-view .page-card tr,
  body.atiq-stage-v2 .quote-view .page-card .section-card,
  body.atiq-stage-v2 .quote-view .page-card .panel-card{ break-inside:avoid!important; }
  body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub td,
  body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-subkid td{
    color:#1a1a18!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [088500]  SEVEN SMALL FIXES
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE MARKUP ROW LINES UP WITH ITS SIBLINGS ──────────────────────────────────────────
   ⚠ THE EXTRA .markup-section IS THE WHOLE POINT OF THIS SELECTOR.
   :272 says `.markup-section .markup-row{padding-left:5px!important}` at (0,4,1). The 088000 rule
   that put the subtotal and total rows on 7px was written `.quote-view .markup-row` at (0,3,1) and
   lost, so one row of three sat 2px left of the others. Matching the rival's shape and adding
   .page-card puts this at (0,5,2) — it wins outright rather than by a file-order tie.
   Fourth time this exact trap has cost a build; _specificity.js now claims the whole totals block,
   not just the parts I happened to think of. */
body.atiq-stage-v2 .quote-view .page-card .markup-section .markup-row{
  padding-left:8.995px!important; padding-right:8.995px!important;
}

/* ── 2 · COMPACT BUTTON — B2, the tint the page already uses for "on" ───────────────────────
   Was a solid #1a3a5c navy that appears nowhere else in the app. The Find similar pill already
   says "active" with a 9% blue wash and a blue hairline, so this now says it the same way. */
body.atiq-stage-v2 .quote-view .tk-compact-btn.on,
body.atiq-stage-v2 .quote-view .lab-compact-btn.on{
  background:rgba(90,169,240,.14)!important;
  border:1.285px solid rgba(90,169,240,.5)!important;
  color:var(--v2-measured)!important;
}
body.atiq-stage-v2 .quote-view .tk-compact-btn,
body.atiq-stage-v2 .quote-view .lab-compact-btn{
  border:1.285px solid transparent!important; border-radius:6.425px!important;
  transition:background .12s, border-color .12s, color .12s;
}
body.atiq-stage-v2 .quote-view .tk-compact-btn:hover,
body.atiq-stage-v2 .quote-view .lab-compact-btn:hover{
  border-color:var(--v2-line2)!important; color:var(--v2-ink)!important;
}
body.light.atiq-stage-v2 .quote-view .tk-compact-btn.on,
body.light.atiq-stage-v2 .quote-view .lab-compact-btn.on{
  background:rgba(26,95,191,.12)!important; border-color:rgba(26,95,191,.55)!important;
}

/* ── 3 · COPY FROM STAGE, ON BRAND ──────────────────────────────────────────────────────────
   This menu had never been styled for v2 at all — it was still running app.css's #1b1b1b /
   #333 / #262626 with a hover of rgba(43,127,255,.10), a different blue from the #5aa9f0 used
   everywhere else on the card. It is a portal on <body>, so these selectors cannot be scoped
   under .quote-view and are deliberately written flat. */
/* [137500] gone: the menu is design/popups.css's .q-panel now (design 13), tokens only, so its
   dark and light boxes — fourteen hand-picked colours — are not needed. */

/* ── 4 · FIND SIMILAR — ONTO THE CARD'S OWN GREY RAMP ───────────────────────────────────────
   The panel was on the APP tokens (--text #f0f0f0 / --text-muted #999 / --text-dim #555) while
   the card beside it runs the v2 ramp (#eceded / #b4b7bb / #7e8287 / #4e5257). Same information,
   different shade, depending on which surface it landed on. The day rows at #555 were the real
   casualty — darker than anything the stage card uses for live text.
   Mapped tier for tier, so a task in the panel is the same weight of ink as a task on the card. */
.sim-panel .sim-lb td{ color:var(--v2-ink2,#b4b7bb)!important; }
.sim-panel .sim-lb td.l{ color:var(--v2-ink2,#b4b7bb)!important; }
.sim-panel .sim-lb td.r{ color:var(--v2-ink,#eceded)!important; }
.sim-panel .sim-lb td.q,
.sim-panel .sim-lb td.rt{ color:var(--v2-ink3,#7e8287)!important; }
.sim-panel .sim-lb tr.p td.l{ color:var(--v2-ink,#eceded)!important; }
.sim-panel .sim-lb tr.d td.l,
.sim-panel .sim-lb tr.d td.r{ color:var(--v2-ink3,#7e8287)!important; }
.sim-panel .sim-lb tr.g td.r{ color:var(--v2-ink2,#b4b7bb)!important; }
body.light .sim-panel .sim-lb td,
body.light .sim-panel .sim-lb td.l{ color:#4a4845!important; }
body.light .sim-panel .sim-lb td.r,
body.light .sim-panel .sim-lb tr.p td.l{ color:#1a1a18!important; }
body.light .sim-panel .sim-lb td.q,
body.light .sim-panel .sim-lb td.rt,
body.light .sim-panel .sim-lb tr.d td.l,
body.light .sim-panel .sim-lb tr.d td.r{ color:#6f6f6a!important; }

/* ── 5 · P1 — BLUE ON EVERY FIGURE THAT IS A TOTAL ──────────────────────────────────────────
   The summary page's money column, its stage totals and its grand total all go blue, so a total
   is the same colour wherever it appears in the document. The $/m² stays GREEN on James's call:
   it is the only figure on the page that is not money-in-this-quote but a rate to compare between
   jobs, and the green is what says so. */
/* ⚠ CLASS NAMES VERIFIED AGAINST stages.js, NOT GUESSED. The first draft of this block aimed at
   .sum-perm2 / .summary-perm2, neither of which exists anywhere in the app. Rules against a class
   that is never rendered do nothing and look like they worked, which is how a "fix" ships without
   fixing.
   [101000] .sum-mv dropped from this list — the class no longer exists. The job total is now
   .sv2-nm.sum-tot and is deliberately WHITE, not blue, so it reads as the twin of the stage name
   on the stage card; that is the one place in the document where a total does not take this
   colour, and it is stated at the rule itself. $/m² is .sv2-rc.green and keeps its green there. */
body.atiq-stage-v2 .quote-view #spanel-summary .sps-tot-val,
body.atiq-stage-v2 .quote-view #spanel-summary .stage-total-value{
  color:var(--v2-measured)!important;
}

/* ── 6 · THE STAGE FOOTER TOTAL MATCHES THE SUMMARY ─────────────────────────────────────────
   It was #fff at 25px — the loudest thing on the page, and the only grand total in the document
   that was not blue. Now it agrees with the summary's. */
body.atiq-stage-v2 .quote-view .page-card .stage-total-value{
  color:var(--v2-measured)!important;
}
body.light.atiq-stage-v2 .quote-view .page-card .stage-total-value{ color:#1a5fbf!important; }
@media print{
  body.atiq-stage-v2 .quote-view .page-card .stage-total-value{ color:#1a1a18!important; }
}

/* ── 7 · THE ADD-LABOUR RATE FIELD — gone at 137500: the editor's fields are design/popups.css
   (.q-money, .q-step) now, the same as every modal's. ─────────────────────────────────────── */

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [089000]  FIND SIMILAR — EVERYTHING BELOW THE DETAIL HEADER

   The detail header and its two buttons are deliberately untouched on James's call: he did not
   want any of the proposed headers and did not want the buttons moved or restyled. Nothing in
   this block touches .sim-dh, .sim-dt or .sim-btn.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE FIGURES TABLE CARRIES THE COMPARISON, SO IT GETS THE WEIGHT ────────────────────
   It was 11px — set SMALLER than the labour list beneath it, when it is the one thing the panel
   exists to show. The column heads move with it so the table does not become a figure under a
   whisper. */
.sim-panel .sim-fg td{ font-size:14px!important; padding:7px 9px!important; }
.sim-panel .sim-fg td.l{ font-size:8.5px!important; }
.sim-panel .sim-fg th{ font-size:8.5px!important; padding-bottom:6px!important; }

/* VALUE AND UNIT IN FIXED SLOTS.
   Piers has unit:'' in SIM_DIMS. With the unit inline its number ran to the cell edge while
   m²/m/m³ stopped one unit short, so the four figures never shared a right edge. Fixed widths
   mean an empty unit still holds its place — the same split the take-off uses for
   .part-val-cell / .part-unit-cell. */
.sim-panel .sim-fg .sim-fv{ display:inline-block; min-width:42px; text-align:right; }
.sim-panel .sim-fg .sim-fu{
  display:inline-block; min-width:20px; text-align:left; padding-left:3px;
  font-size:9px; font-weight:600; color:var(--v2-ink3,#7e8287);
}

/* THE DIFF CHIPS LINE UP.
   They were one run of text, right-aligned in an 88px cell. Because "+14m²" and "−3m" are
   different widths, every chip began at a different left edge and the signs zig-zagged down the
   column. Three fixed slots — sign, magnitude, unit — so signs align, digits share a right edge,
   and units align. */
.sim-panel .sim-df{
  display:inline-grid!important; grid-template-columns:9px 1fr 18px; align-items:baseline;
  min-width:62px; text-align:left; padding:2px 6px!important; font-size:11px!important;
}
.sim-panel .sim-df .sg{ text-align:left; }
.sim-panel .sim-df .nm{ text-align:right; font-variant-numeric:tabular-nums; }
.sim-panel .sim-df .un{ text-align:left; padding-left:3px; font-size:.78em; font-weight:600; opacity:.75; }
.sim-panel .sim-fg td.d{ text-align:right; }

/* ── 2 · THE MAN-DAYS CHIP MATCHES THE STAGE CARD'S OWN ─────────────────────────────────────
   Same 7.5px uppercase blue as .lab-group-days, so the same fact looks the same in both places. */
.sim-panel .sim-lbh em{
  font-size:7.5px!important; font-weight:600!important; letter-spacing:.04em;
  text-transform:uppercase; color:var(--v2-measured,#5aa9f0)!important;
  font-variant-numeric:tabular-nums;
}

/* ── 3 · THE LABOUR LIST, IN THE STAGE PAGE'S OWN ROW VOCABULARY ────────────────────────────
   Text styling only — NO card, on James's call. The panel is already a card; a second frame
   inside it would be the third nested box on screen. */
.sim-panel .sim-lb tr.g td{
  font-size:8.5px!important; letter-spacing:.09em!important; font-weight:700!important;
  color:var(--v2-measured,#5aa9f0)!important;
  padding:9px 5px 3px!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
}
.sim-panel .sim-lb tr.g td.r{
  font-size:10.9225px!important; letter-spacing:0!important; font-weight:700!important;
  color:var(--v2-measured,#5aa9f0)!important;
}
.sim-panel .sim-lb td{ font-size:8px!important; padding:3px 5px!important; border-bottom:none!important; }
.sim-panel .sim-lb td.l{ padding-left:16px!important; }
.sim-panel .sim-lb tr.g td.l{ padding-left:4px!important; }
.sim-panel .sim-lb tr.d td.l{ padding-left:28px!important; }

/* EVERY TASK ROW IS THE SAME COLOUR, parent or not.
   tr.p is set by simSectionGroups ONLY on a row that has day rows nested under it. So
   "Subgrade / Form / Steel Fixings" (which carries an X 2) took the bright rule while
   "Strip & Clean Up", "Pump" and "Delivery" — identical in every way a reader cares about —
   fell through to the dimmer base and looked like a lesser kind of row. Having day rows is a
   property of how the work was entered, not of what the line is. The only distinction that
   earns a colour change is task vs sub-row, and that is tr.d. */
.sim-panel .sim-lb td.l{ color:var(--v2-ink,#eceded)!important; }
.sim-panel .sim-lb td.q,
.sim-panel .sim-lb td.rt,
.sim-panel .sim-lb td.r{ color:var(--v2-ink,#eceded)!important; }
.sim-panel .sim-lb tr.p td.l{ font-weight:600!important; }
  /* ⚠ colour deliberately NOT set on tr.p — it takes it from the rule above, so a parent and a
     non-parent cannot drift apart again */
.sim-panel .sim-lb tr.d td.l,
.sim-panel .sim-lb tr.d td.r,
.sim-panel .sim-lb tr.d td{ color:var(--v2-ink3,#7e8287)!important; }

/* the total at the foot, in the stage card's own 10px/12px pairing */
.sim-panel .sim-lbtot{
  display:flex; align-items:baseline; justify-content:space-between;
  border-top:1px solid rgba(255,255,255,.14); margin-top:5px; padding:5px 5px 1px;
}
.sim-panel .sim-lbtot span{ font-size:10px; font-weight:700; color:var(--v2-ink,#eceded); }
.sim-panel .sim-lbtot b{
  font-size:12px; font-weight:700; color:var(--v2-measured,#5aa9f0);
  font-variant-numeric:tabular-nums;
}

/* ── LIGHT MODE ─────────────────────────────────────────────────────────────────────────────
   The panel declares its own tokens and does not inherit the v2 ones, so every colour above
   needs its light counterpart naming. */
body.light .sim-panel .sim-fg .sim-fu{ color:#6f6f6a!important; }
body.light .sim-panel .sim-lbh em{ color:#1a5fbf!important; }
body.light .sim-panel .sim-lb tr.g td,
body.light .sim-panel .sim-lb tr.g td.r{ color:#1a5fbf!important; border-bottom-color:rgba(0,0,0,.07)!important; }
body.light .sim-panel .sim-lb td.l,
body.light .sim-panel .sim-lb td.q,
body.light .sim-panel .sim-lb td.rt,
body.light .sim-panel .sim-lb td.r{ color:#1a1a18!important; }
body.light .sim-panel .sim-lb tr.d td.l,
body.light .sim-panel .sim-lb tr.d td.r,
body.light .sim-panel .sim-lb tr.d td{ color:#6f6f6a!important; }
body.light .sim-panel .sim-lbtot{ border-top-color:rgba(0,0,0,.14); }
body.light .sim-panel .sim-lbtot span{ color:#1a1a18; }
body.light .sim-panel .sim-lbtot b{ color:#1a5fbf; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [089500]  THE PANEL IS NOT ZOOMED — SIZES HAVE TO BE SCALED, NOT COPIED

   089000 set this panel's type by copying the stage card's numbers: 8px rows, 8.5px group
   headings, 10/12px on the total. That was wrong, and quote-print.css:2122 says why in its own
   comment — "This panel is appended to document.body so it can escape the stage card's zoom."

       .page-card   zoom:1.285   an 8px row is painted at  10.28px
       .sim-panel   zoom:1       an 8px row is painted at   8.00px

   So matching the DECLARED size makes the panel about 22% smaller than the thing it is matching.
   The labour rows went from a shipped 10px to 8px — not matched to the stage card, just shrunk.

   Every size below is the stage card's own value multiplied by 1.285 and rounded to the nearest
   half pixel, so the two surfaces LOOK the same rather than reading the same in a stylesheet.
   _simtype.js in the scratchpad recomputes that relationship and fails if any of these drift.

   The figures table keeps its 14px: that number was chosen for this panel directly, to make the
   comparison the loudest thing in it, and was never derived from the stage card.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* labour list — 8.5px on the card → 11px here */
.sim-panel .sim-lb tr.g td,
.sim-panel .sim-lb tr.g td.r{ font-size:14.135px!important; }
/* task and sub rows — 8px on the card → 10.5px here (the shipped value was 10px) */
.sim-panel .sim-lb td{ font-size:10.5px!important; }
/* the total — 10/12px on the card → 13/15.5px here */
.sim-panel .sim-lbtot span{ font-size:13px; }
.sim-panel .sim-lbtot b{ font-size:15.5px; }
/* the man-days chip — 7.5px on the card → 9.5px here */
.sim-panel .sim-lbh em{ font-size:9.5px!important; }
/* figures table labels and units — 8.5px / 8px on the card → 11px / 10.5px here.
   The column heads stay a touch under the row labels so the heading does not outweigh the row
   it titles; on the card that separation comes from colour, which this table does not have. */
.sim-panel .sim-fg td.l{ font-size:11px!important; }
.sim-panel .sim-fg th{ font-size:10px!important; }
.sim-panel .sim-fg .sim-fu{ font-size:10.5px; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [090000]  THE COLUMN DIVIDER MATCHES THE WHITE LINE UNDER THE HEADER

   The line James means is :231 — `.sv2-r2{border-bottom:2px solid var(--v2-rule)}`, the
   hard rule that splits identity from work at the top of the card. Not --v2-line2: my first
   attempt at this matched that instead, because reading the FIRST .sv2-r2 rule (:82, a hairline
   at --v2-line2) gives the wrong answer — :231 overrides it later in the same sheet. Resolving
   the cascade rather than grepping the first hit is the only way to get this right.

   quote-print.css:484 draws the divider with var(--border) — rgba(255,255,255,.08), roughly a
   tenth the strength. So the page carried two structural rules an order of magnitude apart, and
   the fainter one was the longer line separating the two halves of the card.

   ⚠ Specificity: beating .quote-view .col-breakdown (0,2,1) and its light counterpart
   body.light .quote-view .col-breakdown (0,3,1). These are (0,3,1) and (0,4,1), so neither
   depends on file order. Checked by _specificity.js, not assumed.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
body.atiq-stage-v2 .quote-view .col-breakdown{
  border-right:2.57px solid var(--v2-rule)!important;
}
body.light.atiq-stage-v2 .quote-view .col-breakdown{
  border-right-color:rgba(0,0,0,.7)!important;
}
@media print{
  body.atiq-stage-v2 .quote-view .col-breakdown{ border-right-color:#111!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [090500]  THE WHITE RULE BECOMES THE PAGE'S STRUCTURAL LINE

   One line, used everywhere the card divides into parts: 2px rgba(255,255,255,.72), already
   drawn under the header (:231) and down the middle (:1604). It now also splits materials from
   labour, caps the footer, and outlines the card itself.
   The weight is deliberately NOT applied to the card's own border — a 2px near-white frame
   around a whole A4 page reads as a box rather than a sheet, so the card takes the colour at
   its existing 1px. One value if that turns out to be too quiet.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* 1 · MATERIALS | LABOUR. The two right-hand panels had nothing between them — the labour
   title was the only clue a new section had started. */
body.atiq-stage-v2 .quote-view .col-quantities{
  border-bottom:2.57px solid var(--v2-rule)!important;
  padding-bottom:12.85px!important; margin-bottom:12.85px!important;
}
body.light.atiq-stage-v2 .quote-view .col-quantities{ border-bottom-color:rgba(0,0,0,.7)!important; }

/* 2 · THE FOOTER. quote-print.css:654 explicitly sets border-top:none, so this needs !important
   and the full shorthand rather than just a colour. */
body.atiq-stage-v2 .quote-view .page-card-footer{
  border-top:2.57px solid var(--v2-rule)!important;
}
body.light.atiq-stage-v2 .quote-view .page-card-footer{ border-top-color:rgba(0,0,0,.7)!important; }

/* 3 · THE CARD'S OWN EDGE — the colour, at its existing weight. */
body.atiq-stage-v2 .quote-view .page-card{
  border-color:var(--v2-rule)!important;
}
body.light.atiq-stage-v2 .quote-view .page-card{ border-color:rgba(0,0,0,.7)!important; }

@media print{
  body.atiq-stage-v2 .quote-view .col-quantities,
  body.atiq-stage-v2 .quote-view .page-card-footer{ border-color:#111!important; }
  body.atiq-stage-v2 .quote-view .page-card{ border-color:transparent!important; }
}

/* ── 4 · THE MARKUP ROW LINES UP WITH THE TABLE ─────────────────────────────────────────────
   It is a flex with three children and knows nothing about the table above it, so the % control
   sat wherever the free space put it. Now it is a grid on the table's own column widths
   (38/14/10/14/16), so "Markup" takes the description column at the data rows' 16px indent, the
   % input sits in the QTY column, and the amount lands in the totals column.
   ⚠ The widths must match buildQtyTbl's colgroup. If that changes, this has to change with it —
   there is no way for a sibling div to read a table's columns. */
body.atiq-stage-v2 .quote-view .page-card .markup-section .markup-row{
  display:grid!important; grid-template-columns:38% 14% 10% 14% 16%;
  align-items:center; column-gap:0;
  padding:0 8.995px 5.14px!important;
}
body.atiq-stage-v2 .quote-view .markup-row .markup-label{
  grid-column:1; padding-left:11.565px;      /* 20.56px of the data-row indent, less the row's own 8.995px */
}
body.atiq-stage-v2 .quote-view .markup-row .markup-input-wrap{
  grid-column:2; justify-content:flex-end; gap:2.57px;
}
body.atiq-stage-v2 .quote-view .markup-row .markup-value{
  grid-column:5; text-align:right;
}
/* the subtotal's label takes the same indent so the three rows start on one line */
body.atiq-stage-v2 .quote-view .subtotal-row-padded{ padding-left:20.56px!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [091000]  THE HEADER'S FIRST ROW GETS THE RULE TOO, AND THE GAPS AGREE

   .sv2-r1 is the project address and the builder — "who and where". .sv2-r2 below it is the
   stage and its three figures — "what". They were one block with a rule only underneath the
   pair, so the identity line and the stage line read as the same thing. A rule between them
   makes the header two facts instead of one run-on.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
body.atiq-stage-v2 .quote-view .sv2-r1{
  border-bottom:2px solid var(--v2-rule)!important;
}
@media print{ body.atiq-stage-v2 .quote-view .sv2-r1{ border-bottom-color:#111!important; } }

/* ── ONE GAP UNDER EVERY RULE ───────────────────────────────────────────────────────────────
   The header's rule sits 9px above the first column title, because .col-breakdown and
   .col-quantities both carry padding:9px. The materials rule was at 10px and then the labour
   title was pushed a further 20px down by a hardcoded spacer in stagecard.js — 30px against the
   header's 9px, which is why that one looked adrift. The spacer is gone and this is 9px, so
   every title on the card sits the same distance below the line above it. */
body.atiq-stage-v2 .quote-view .col-quantities{
  padding-bottom:11.565px!important; margin-bottom:11.565px!important;
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [091500]  ONE SHAPE FOR THE SECTION CONTROLS

   The three panels each offered their actions differently: take-off had a compact icon and a
   plus icon in a group at the far right, materials had a lone plus icon, and labour had its
   compact icon plus a blue "+ Add" pill. Labour's is the one that reads, so the other two copy it.
     title text · compact icon ·········· + Add
   .sv2-add is deliberately styled to match .l2-add (labour2.css:82) rather than sharing a class
   with it — labour2.css is gated on body.atiq-labour-v2 and this sheet on body.atiq-stage-v2, so
   one class could not be styled in one place for both. The values are kept identical here on
   purpose; _addbtn.js in the scratchpad fails if they drift apart.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
body.atiq-stage-v2 .quote-view .col-section-title .sv2-add,
body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add{
  margin-left:auto; background:none; border:1.285px solid rgba(90,169,240,.45); border-radius:17.99px;
  color:var(--v2-measured); font-family:inherit; font-size:10.9225px; font-weight:700; padding:3.855px 14.135px;
  cursor:pointer; letter-spacing:.02em; transition:all .12s; flex:0 0 auto; line-height:1.2;
}
body.atiq-stage-v2 .quote-view .col-section-title .sv2-add:hover,
body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add:hover{
  background:rgba(90,169,240,.15); border-color:var(--v2-measured);
}
/* the border is a literal blue, so light mode needs it named. (labour's .l2-add gets this free
   because it uses var(--l2-blue); ours is an rgba at .45 alpha, which a token cannot express.) */
body.light.atiq-stage-v2 .quote-view .col-section-title .sv2-add,
body.light.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add{
  border-color:rgba(26,95,191,.45);
}
body.light.atiq-stage-v2 .quote-view .col-section-title .sv2-add:hover,
body.light.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add:hover{
  background:rgba(26,95,191,.12); border-color:var(--v2-measured);
}

/* the title row packs from the left so the compact icon sits against the title text; the pill
   takes the right edge on its own margin-left:auto. justify-content:space-between — which these
   rows carry from quote-print.css:565 — would strand the compact icon in the middle. */
body.atiq-stage-v2 .quote-view .col-section-title,
body.atiq-stage-v2 .quote-view .col-breakdown-title{
  justify-content:flex-start!important; gap:8.995px;
}

/* the group heading now spans the row, so its name needs the cell's own left padding back */
body.atiq-stage-v2 .quote-view .mat-group-row td{ padding-left:5.14px!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [092500]  WHERE THE LISTS END, AND WHERE THE COMPACT TOGGLE SITS
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE COMPACT TOGGLE SITS AGAINST THE TITLE ──────────────────────────────────────────
   NOT A PADDING BUG. The title row is a flex row and TWO of its children claim the free space
   with margin-left:auto — the control group holding the toggle (quote-print:1748 for take-off,
   app:1506 for labour) and the + Add pill (:1740 above). Flexbox distributes free space EQUALLY
   among every auto margin, so the toggle was parked exactly halfway along the row.
   ⚠ `justify-content:flex-start` was already set above by 091500 trying to fix this, and could
   never have worked: justify-content only distributes space the auto margins have not already
   taken. The auto margins take all of it first. Removing one is the whole fix.
   Take-off showed it worst only because "Take-off" is short, so there was more gap to halve;
   "Labour & Site Prelims" had the identical bug and looked merely a little adrift.
   The two original rules live in sheets that are not gated on body.atiq-stage-v2, so they are
   overridden here rather than edited — an era-1 stage keeps exactly the layout it has now. */
body.atiq-stage-v2 .quote-view .tk-ctrl-group,
body.atiq-stage-v2 .quote-view .lab-ctrl-group{ margin-left:0!important; }

/* ── 2 · THE LISTS GET AIR BEFORE THEY CLOSE ────────────────────────────────────────────────
   The last line item and the summary under it were about 4px apart, and there were TWO lines in
   that 4px: the last data row's own bottom hairline and the subtotal's top rule. So the summary
   read as one more row.
   Fixed in two parts — real space above the break, and only one line in it.
   The 16px indent the summary shares with the line items is DELIBERATE (088500, James asked for
   the markup row to line up with the table above it) and is left alone; the separation here is
   vertical, not horizontal. */

/* 2a · the last row of a card's table stops drawing its own hairline, so the only line above a
        summary is the summary's own rule.
   ⚠ SPECIFICITY. The rule being beaten is
     body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td   (0,5,4) !important
   The first selector below is (0,5,4) — a bare tie decided by file order, which is one reshuffle
   from breaking. The second and third add a class and win outright at (0,6,4); the first is kept
   only to catch a last row that is neither kind. */
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr:last-child td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row:last-child td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row:last-child td{
  border-bottom:none!important;
}
/* 2b · with labour compact ON the structural last row is usually HIDDEN — unused rows sit at the
        end of their group and a wholly unused group hides its header too — so :last-child lands
        on something invisible and the row you can actually see keeps its hairline. CSS cannot ask
        "the last one that is not display:none", so applyLabCompact tags it: .lab-last-vis. */
/*   The labour table's rows are .lab-display-row, never .tbl-item-row, so the hairline they are
     fighting comes from the generic .page-card .tbl td at (0,4,3) with no !important — which
     (0,5,4) !important already beats. The qualified second selector is cheap insurance: at
     (0,6,4) it also outranks the item-row rule, so this keeps working if the labour table is
     ever rebuilt out of .tbl-item-rows. */
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.lab-last-vis td,
body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.lab-display-row.lab-last-vis td{
  border-bottom:none!important;
}

/* 2c · the air. 7px above the break, and the 4px that was already below it, so the rule reads as
        belonging to the block under it rather than floating between the two.
   Both of these beat their originals on specificity, not file order:
     .subtotal-row-padded  — stage-v2:1247 (0,3,1)  this (0,3,1) and later
     .lab-total-row        — quote-print:1290 margin-top:0!important at (0,2,0) */
body.atiq-stage-v2 .quote-view .subtotal-row-padded{ margin-top:8.995px!important; }
body.atiq-stage-v2 .quote-view .lab-total-row{ margin-top:8.995px!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [096000]  THE FINISH PILL  —  Concrete [Exposed] -> Concrete · EXPOSED

   ⚠ TEAL, AND ORANGE WAS MEASURED AND REJECTED.
   James asked for orange. #e8a33d amber is already the colour of "a human changed this" on this
   card — the ▲ on an overridden quantity, .sec-measure-pill.measure-moved, the inherited-edit
   badge. An orange pill sits 6.7 ΔE from it and anything under 15 is hard to tell apart WITH FULL
   COLOUR VISION, so two unrelated meanings would have shared one colour on the same row. Teal is
   20.6 ΔE from the amber and 13.6 under protanopia. Measured, not eyeballed.
   Text on its own tint: 6.05:1 dark, 4.45:1 light.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
body.atiq-stage-v2 .quote-view{ --v2-finish:#45c7b0; }
body.light.atiq-stage-v2 .quote-view{ --v2-finish:#0f6f60; }

/* [097500] THE PILL IS GONE; THE COLOUR STAYS.
   Border + tint + caps was three signals for one word, sitting on the quietest rows of the
   card. Teal on its own tint measured 6.60:1; teal straight on the card measures 8.50:1 — so
   dropping the pill makes the finish EASIER to read, not harder, which is the opposite of what
   you would guess from taking a box away. Light mode goes 6.06:1 the same way.
   6.5 → 7px and .11 → .13em tracking: with no border holding it, the old size read as a smudge.
   The whole color-mix block and its @supports fallback went with the pill — nothing is mixed
   any more, so there is nothing left to fall back from. */
body.atiq-stage-v2 .quote-view .sv2-fin{
  display:inline-block; font-family:var(--v2-narrow); font-size:8.995px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; line-height:1.5; white-space:nowrap;
  padding:0; border:none; border-radius:0; margin-left:7.71px; vertical-align:0.6425px;
  background:none; color:var(--v2-finish);
}
/* IT STEPS BACK IN A SUB ITEM. Those rows are dimmed on purpose; a pill at full strength there
   would be the brightest thing in a row the card is deliberately playing down, which would undo
   the whole point of the Sub items break. */
body.atiq-stage-v2 .quote-view tr.tk-subkid .sv2-fin{ opacity:.68; }
/* a deleted row's pill goes with it rather than surviving the strike-through */
body.atiq-stage-v2 .quote-view tr.deleted .sv2-fin{ opacity:.45; }

/* PRINT. The finish is the most expensive thing about a pour, so it stays on paper — but as ink,
   not as colour, the way every other chip on this card prints. */
@media print{
  body.atiq-stage-v2 .quote-view .sv2-fin{
    color:#111!important; background:none!important; border:none!important;
    opacity:1!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [097500]  ONE MARK FOR "A HUMAN CHANGED THIS", AND THE ÷ BUTTON STATES ITS VERDICT
   ════════════════════════════════════════════════════════════════════════════════════════════

   1 · THE SEVEN TRIANGLES BECOME ONE DOT.
   There were seven ▲ marks wearing two colours, and the colours encoded WHERE the edit lived
   (here, or down in the take-off) while the thing you need standing at the card is WHETHER YOU
   CAN UNDO IT — which split clean across both. Two of the reds did nothing when tapped; one of
   the ambers reverted. The hue was telling you something true and useless.
   Red also means broken, and nothing marked here is broken: every one of them is a deliberate
   act. A correct quote was coming out covered in warning triangles.
   So: ONE hue — the card's existing amber — and FILL carries the action.
       ● solid   you did this here, tap to undo
       ○ hollow  inherited, or a consequence — the undo lives somewhere else
   Fill rather than hue, so it survives greyscale on the printout and colour-blindness stops
   mattering entirely. (For the record the old pair was never hard to tell apart — red #e05252
   against amber #e8a838 measures 20.6 ΔE, and 24.9 under protanopia. They were perfectly
   distinguishable and perfectly wrong.)

   ⚠ THE CLASS NAMES ARE DELIBERATELY UNCHANGED. .value-modified-icon is what the delegated
   revert handler selects on and what two click-guards test with classList.contains(). Renaming
   it to something dot-shaped would have been tidier and would have silently unbound every
   revert on the card. The shape modifier is additive for exactly that reason. */
body.atiq-stage-v2 .quote-view{ --v2-edit:#e8a33d; }
body.light.atiq-stage-v2 .quote-view{ --v2-edit:#b85c00; }

body.atiq-stage-v2 .quote-view .value-modified-icon,
body.atiq-stage-v2 .quote-view .section-modified-icon{
  display:inline-block!important; width:6.425px!important; height:6.425px!important;
  border-radius:50%!important; box-sizing:border-box!important;
  vertical-align:1.9275px!important; margin-right:6.425px!important;
  /* font-size:0 is load-bearing, not belt-and-braces: these spans are emptied in JS, but an
     inherited line-height on a zero-content inline-block still reserves a text box and pushed
     the dot a pixel off its row. */
  font-size:0!important; line-height:0!important; color:transparent!important;
  background:var(--v2-edit)!important; border:none!important; opacity:1!important;
}
body.atiq-stage-v2 .quote-view .value-modified-icon.vmod-hollow,
body.atiq-stage-v2 .quote-view .section-modified-icon.vmod-hollow{
  background:none!important; border:1.60625px solid var(--v2-edit)!important;
  cursor:default!important;
}
body.atiq-stage-v2 .quote-view .value-modified-icon.vmod-solid{ cursor:pointer!important; }
/* the section summary sits AFTER a title, so its margin belongs on the other side */
body.atiq-stage-v2 .quote-view .section-modified-icon{ margin-right:0!important; margin-left:6.425px!important; }
/* .value-modified is an inline-flex with its own gap — doubling it with a margin put 8px
   between a 5px dot and its number */
body.atiq-stage-v2 .quote-view .value-modified{ gap:6.425px!important; }
body.atiq-stage-v2 .quote-view .value-modified .value-modified-icon{ margin-right:0!important; }

/* PRINT. Fill still reads with no colour at all, which is the whole reason it carries the
   meaning. quote-print.css:898 forces these to #c62828 at (0,1,1); these land at (0,3,1) and
   win on specificity, not on file order — so a future reshuffle cannot quietly undo it. */
@media print{
  body.atiq-stage-v2 .quote-view .value-modified-icon,
  body.atiq-stage-v2 .quote-view .section-modified-icon{
    background:#111!important; border:none!important; color:transparent!important;
  }
  body.atiq-stage-v2 .quote-view .value-modified-icon.vmod-hollow,
  body.atiq-stage-v2 .quote-view .section-modified-icon.vmod-hollow{
    background:none!important; border:1.60625px solid #111!important;
  }
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   2 · THE PER-1 FIGURE IS READABLE AGAIN.
   .per1 is coloured var(--accent) in quote-print.css. This sheet neutralises --accent to
   rgba(255,255,255,.3) to kill the lime everywhere at once — which, two builds later, left the
   one number the ÷ mode exists to show rendering at 2.70:1 while the total beside it sat at
   8.83:1. The hierarchy was exactly backwards, as a side effect of a change aimed at something
   else. It is now the row's own ink, and the only figure in the cell. */
body.atiq-stage-v2 .quote-view .per1{
  color:var(--v2-ink)!important; font-weight:700!important; margin-right:0!important;
  font-family:inherit!important;
}
/* the concrete row when the check disagrees — so the verdict and the figure it is about point
   at the same number. #e0736f is 5.80:1 on the dark card but only 3.07:1 on white, which
   _lightmode caught before this shipped; #b82020 is the sheet's existing light danger at
   6.43:1. */
body.atiq-stage-v2 .quote-view .per1.bad{ color:#e0736f!important; }
body.light.atiq-stage-v2 .quote-view .per1.bad{ color:#b82020!important; }

/* the caption over the swapped column, so a lone figure cannot be read as a total */
body.atiq-stage-v2 .quote-view tr.sec-per1-cap td{
  border-bottom:1px solid var(--v2-line)!important; padding:4px 2px 2px!important;
}
body.atiq-stage-v2 .quote-view tr.sec-per1-cap td span{
  font-family:var(--v2-narrow); font-size:7px; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:var(--v2-ink4); white-space:nowrap;
}

/* ────────────────────────────────────────────────────────────────────────────────────────────
   3 · THE DIVIDE BUTTON'S TWO FACES.
   ✓ and ▲ are glyphs and want the glyph size; "per" is a word and wants the narrow face at a
   word's size. Both still have to live inside an 18px column, which is what ruled out putting
   the percentage on the button itself — "▲13%" measures about 26px and there is nowhere to put
   it. The number lives in the title instead, where there is room for a sentence. */
body.atiq-stage-v2 .quote-view .sec-divide-btn.dv-mark{ font-size:11.565px!important; }
body.atiq-stage-v2 .quote-view .sec-divide-btn.dv-word{
  font-family:var(--v2-narrow)!important; font-size:9.6375px!important; font-weight:700!important;
  letter-spacing:.04em!important; text-transform:lowercase!important;
  width:auto!important; min-width:20.56px!important; padding:1.285px 2.57px!important;
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [100000]  THE PROJECT SUMMARY, TIDIED

   Four changes, all of them already proved on the stage card — this page was the one left behind.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE WHITE RULE ────────────────────────────────────────────────────────────────────────
   Every structural line on this page sat at roughly .08 alpha, which is 1.4:1 against the card:
   present in the DOM, absent to the eye. The whole page read as one grey mass with no divisions.
   --v2-rule is the .42 the stage card settled on at 091500 — 4.1:1, measured — and it keeps the
   same order the stage card uses: rule .42 > card edge .22 > row hairline .07. */
body.atiq-stage-v2 .quote-view .summary-page-card{ border-color:var(--v2-rule)!important; }
body.atiq-stage-v2 .quote-view .summary-stage-row{
  border-bottom:1.285px solid var(--v2-rule)!important;
}
/* [100500] :last-of-type was replaced by .sum-row-last — see the 100500 block at the foot of this
   file. It matched NOTHING: :last-of-type is by element type, not class, and the footer div sat
   after the rows, so the last row was never the last div and two white rules drew 27px apart. */
body.atiq-stage-v2 .quote-view .summary-stage-row.sum-row-last{ border-bottom:none!important; }
/* [115000] ⚠ THIS BLOCK IS LOAD-BEARING, NOT A DUPLICATE OF quote-print.css. The rule above sets
   the row's border with !important at this specificity, so the plain .sum-named-above rule in
   quote-print.css loses even carrying its own !important — the mock proved it by rendering the
   "no dividers" variant with every divider still in place. The change has to be stated twice. */
body.atiq-stage-v2 .quote-view .summary-stage-row.sum-named-above{ border-bottom:none!important; }
body.atiq-stage-v2 .quote-view .summary-stage-row.sum-named-above + .summary-stage-row.sum-named-above{
  border-top:1.285px solid var(--v2-rule)!important;
}
body.atiq-stage-v2 .quote-view .page-card-footer.summary-grand-inline{
  border-top:1.285px solid var(--v2-rule)!important;
}
body.light.atiq-stage-v2 .quote-view .summary-page-card,
body.light.atiq-stage-v2 .quote-view .summary-stage-row,
body.light.atiq-stage-v2 .quote-view .page-card-footer.summary-grand-inline{
  border-color:rgba(0,0,0,.51)!important;   /* .51 black = the same 4.1:1 on white; see [091500] */
}
body.light.atiq-stage-v2 .quote-view .summary-stage-row.sum-named-above + .summary-stage-row.sum-named-above{
  border-top-color:rgba(0,0,0,.51)!important;
}

/* ── 2 · SHORTER ON SCREEN, A4 ON PAPER ────────────────────────────────────────────────────────
   quote-print.css:803 fixes the card at 794x1123 and it has always stayed that height, so a job
   with three stages rendered a third of a page of content followed by a field of nothing.

   ⚠ THE PAGINATION IS NOT TOUCHED. stages.js measures against a hidden probe card at the FIXED
   size — `usable = body.clientHeight - padding - 40` — and decides the page breaks from that. The
   40px reserve exists because print re-sizes the card to 200mm x 287mm, about 38px shorter, and
   anything packed into the difference is guillotined (see the [083000] note). Shrinking the card
   everywhere would break both. Only the rendered box moves: auto on screen, untouched for print.
   Same breaks, same printed pages, no trailing white on the monitor. */
@media screen{
  body.atiq-stage-v2 .quote-view .summary-page-card{
    height:auto!important; min-height:0!important;
  }
  /* the body no longer needs to stretch, and the footer stops being pushed to a far bottom */
  body.atiq-stage-v2 .quote-view .summary-page-card .summary-page-body{ flex:0 0 auto!important; }
}

/* ── 3 · PROJECT NOTES ─────────────────────────────────────────────────────────────────────────
   The node is no longer built (see the note in stages.js). This rule stays as a belt-and-braces
   for any job whose cached render still holds one, and as the single line to delete if the field
   is ever wanted back. currentJob.summaryNotes is untouched on every job that has one. */
body.atiq-stage-v2 .quote-view .summary-notes-section{ display:none!important; }

/* ── 4 · DAYS AND MAN-DAYS ─────────────────────────────────────────────────────────────────────
   Its own line under the Slab / Beams / Piers run, not two more cells in it. Those three are
   MEASURED off the drawing and hold the same three positions on the stage header and on every row
   of this page; days and man-days are what the crew spends rather than what the job contains.
   Extending the run to five would have muddled a shape already learned.
   Amber is the card's existing colour for effort rather than measurement — the same #e8a33d that
   marks a human-set figure, at 8.24:1 on the card. */
body.atiq-stage-v2 .quote-view .sum-eff{
  display:flex; gap:33.41px; font-family:var(--v2-font);
  margin-top:8.995px; padding-top:7.71px; border-top:1.285px solid var(--v2-line2);
}
body.atiq-stage-v2 .quote-view .sum-eff .sum-qv{ color:#e8a33d; }
body.light.atiq-stage-v2 .quote-view .sum-eff .sum-qv{ color:#b85c00; }  /* 4.60:1 on white */
/* on paper it is ink, like every other colour on this card */
@media print{
  body.atiq-stage-v2 .quote-view .sum-eff .sum-qv{ color:#1a1a18!important; }
  body.atiq-stage-v2 .quote-view .sum-eff{ border-top-color:#ccc!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [100500]  THE RUNNING LINE, THE C1 HEADER, AND SIX FIXES TO THE SUMMARY ROWS.

   Settled over mocks: the five-cell quantity run became one line of running text; the summary
   header absorbed the footer and gained a materials/labour proportion bar; the grand-total
   footer was deleted outright.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE QUANTITY CELLS ────────────────────────────────────────────────────────────────────
   "SLAB / 78m²" — caption on top, figure under it. One component (sv2Run), both headers.

   [101000] 100500 made this a line of running text and James preferred the caption above. What
   was actually wrong before 100500 was the SIZE, not the arrangement: the old cells were
   .sv2-q / .sv2-lb / .sv2-n, which carry `padding:9px 15px!important; min-width:88px!important`
   (:433) and `font-size:18px!important` (:319) — sized for the stage card, and !important, so
   every attempt to tighten them from a lower specificity lost SILENTLY. (!important beats a plain
   declaration whatever the specificity; only !important at a HIGHER specificity wins.) These are
   new classes rather than restyled ones, so they are not in that fight at all, and .sv2-q is left
   untouched for whatever else uses it. Five cells cost about 350px here against 565px before. */
body.atiq-stage-v2 .quote-view .sv2-run{ display:flex; align-items:stretch; }
body.atiq-stage-v2 .quote-view .sv2-rc{
  display:flex; flex-direction:column; justify-content:center; gap:4px;
  padding:0 11px; min-width:0; font-family:var(--v2-font);
}
body.atiq-stage-v2 .quote-view .sv2-rcl{
  font-family:var(--v2-narrow)!important; font-size:8px; font-weight:600; color:var(--v2-ink3);
  letter-spacing:.13em; text-transform:uppercase; white-space:nowrap;
}
body.atiq-stage-v2 .quote-view .sv2-rcv{
  font-size:13px; font-weight:700; line-height:1; color:var(--v2-measured);
  font-variant-numeric:tabular-nums; letter-spacing:-.02em; white-space:nowrap;
}
body.atiq-stage-v2 .quote-view .sv2-rcv u{
  text-decoration:none; font-size:8.5px; font-weight:600; color:var(--v2-ink3); margin-left:2px;
}
/* a nil reads as "none here", never as a figure */
body.atiq-stage-v2 .quote-view .sv2-rcv.nil{ color:var(--v2-ink4); font-weight:500; }
/* effort is amber — the card's colour for what the crew spends, not what the job contains */
body.atiq-stage-v2 .quote-view .sv2-rc.eff .sv2-rcv{ color:#e8a33d; }
body.light.atiq-stage-v2 .quote-view .sv2-rc.eff .sv2-rcv{ color:#b85c00; }   /* 4.60:1 on white */
/* $/m² is green: the one figure on the page that is a rate to compare between jobs, not money in
   this quote. Screen-only, so it never reaches the client — see [084000]. */
body.atiq-stage-v2 .quote-view .sv2-rc.green .sv2-rcv{ color:#5ac98a; }
body.light.atiq-stage-v2 .quote-view .sv2-rc.green .sv2-rcv{ color:#2d7a3a; }
/* the run sits right on both headers, exactly where the old boxed cells did */
body.atiq-stage-v2 .quote-view .sv2-r2 .sv2-run{ margin-left:auto; }

/* THE GROUP DIVIDER. Short on purpose — it marks a boundary between kinds of fact, it is not
   structure, so it stops well short of the cell's full height.
   WEIGHT IS MEASURED. --v2-line2 is 1.61:1 against the card and --v2-line3 is 2.73:1, both under
   the 3:1 floor for a graphic that carries meaning; .34 white is 3.13:1 and .42 black is 3.03:1.
   Both sit below --v2-rule, so the page keeps its order of line weights:
       rule .42  >  divider .34  >  card edge .22  >  row hairline .07
   A literal rgba rather than a token because no existing token lands in this band, and inventing
   one for a single use would put a fifth weight in a scale that already has four. */
body.atiq-stage-v2 .quote-view .sv2-rdiv{
  flex:0 0 1px; width:1px; height:20px; align-self:center; margin:0 7px;
  background:rgba(255,255,255,.34);
}
body.light.atiq-stage-v2 .quote-view .sv2-rdiv{ background:rgba(0,0,0,.42); }

@media print{
  body.atiq-stage-v2 .quote-view .sv2-rcv{ color:#1a1a18!important; }
  body.atiq-stage-v2 .quote-view .sv2-rcv u,
  body.atiq-stage-v2 .quote-view .sv2-rcl{ color:#71716c!important; }
  body.atiq-stage-v2 .quote-view .sv2-rcv.nil{ color:#b0b0ac!important; }
}

/* ── 2 · THE SUMMARY HEADER IS THE STAGE HEADER ────────────────────────────────────────────────
   [101000] The money block, the proportion bar and the Materials / Labour legend are all gone —
   James's call; the data was not needed up here and the rows below still carry both figures.
   What is left is the stage card's own two-part row: .sv2-stg on the left, the quantity run on
   the right. Because the left block is literally .sv2-stg holding .sv2-lb + .sv2-nm, it needs no
   sizing rules here at all; it inherits the blue edge, the padding and the 15.5px, and the two
   headers come out the same height without either being measured against the other. */
body.atiq-stage-v2 .quote-view #spanel-summary .sv2-r2.sum-c1 .sv2-stg{ flex:0 0 auto; }
body.atiq-stage-v2 .quote-view #spanel-summary .sum-hcells{ display:flex; margin-left:auto; align-items:stretch; }

/* THE TOTAL IS WHITE. A deliberate departure: :1434 says a total is the same colour wherever it
   appears, and the per-stage totals below are blue. White is what makes this read as the twin of
   the stage name on the other page. .sv2-nm already is --v2-ink, so this rule only has to say
   that nothing should override it — and it is the single line to delete if blue should win. */
body.atiq-stage-v2 .quote-view #spanel-summary .sv2-nm.sum-tot{
  color:var(--v2-ink)!important; font-variant-numeric:tabular-nums;
}
@media print{
  body.atiq-stage-v2 .quote-view #spanel-summary .sv2-nm.sum-tot{ color:#111!important; }
}

/* ── 3 · THE FOOTER IS GONE ────────────────────────────────────────────────────────────────────
   Nothing emits .summary-grand-inline any more (stages.js buildFooterNodes). The 100000 rule that
   put --v2-rule on its top edge is left in place above and simply matches nothing — harmless, and
   the single line to keep if the bar is ever restored. This hides any cached render of one. */
body.atiq-stage-v2 .quote-view #spanel-summary .summary-grand-inline{ display:none!important; }

/* ── 4 · THE SECTION LINE ──────────────────────────────────────────────────────────────────────
   Not merely off-key against the stage page — unreadable. The name was --text-dim #555, which is
   2.24:1 on the #1e1e1e card at 8px; the 3:1 floor is for LARGE text and 8px uppercase is nowhere
   near it. The type beside it was #999 at 5.85:1, so the two halves of one label sat 3.6 stops
   apart and the half carrying the section's actual name was the invisible one.
   Tokens, not hex, so light mode is already handled by the :root redefinition at :61. */
body.atiq-stage-v2 .quote-view .summary-inc-item .sec-type{ color:var(--v2-measured); font-weight:800; }  /* 6.64:1 */
body.atiq-stage-v2 .quote-view .summary-inc-item .sec-nm  { color:var(--v2-ink2);     font-weight:600; }  /* 8.28:1 */
body.atiq-stage-v2 .quote-view .summary-inc-item .sec-dot {
  color:var(--v2-ink3); margin:0 7.71px; font-size:.72em; vertical-align:middle;
}

/* ── 5 · THE EFFORT RULE STOPS AT THE FIGURES ──────────────────────────────────────────────────
   .sum-eff is a block in a 1fr grid column, so its border-top ran the column's full width — about
   290px of rule under about 150px of content. The shrink-to-fit wrapper makes it exactly as wide
   as the Slab / Beams / Piers run above, so it ends just past PIERS. Notes stay outside it. */
body.atiq-stage-v2 .quote-view .sum-band-inner{ display:inline-block; }

/* ── 6 · THE LABEL VOICE ───────────────────────────────────────────────────────────────────────
   The stage card says every micro-label in Archivo Narrow at .14em (.sv2-lb) and so does this
   page's own header (now .sv2-rcl). The stage ROWS said them in Archivo at .07–.1em, so one document
   spoke in two voices. 8px narrow sits at about the apparent size of the 7px it replaces. */
body.atiq-stage-v2 .quote-view .sum-ql,
body.atiq-stage-v2 .quote-view .summary-stage-eyebrow,
body.atiq-stage-v2 .quote-view .sps-lbl,
body.atiq-stage-v2 .quote-view .summary-stage-subhead{
  font-family:var(--v2-narrow)!important; font-size:10.28px; font-weight:600; letter-spacing:.14em;
}

/* ── 7 · THE STAGE NUMBER ──────────────────────────────────────────────────────────────────────
   :99 puts the stage card's own "STAGE" eyebrow in measured blue. The identical label on this
   page was grey, so the one word saying which stage you are reading was the quietest in the
   column. */
body.atiq-stage-v2 .quote-view .summary-stage-eyebrow{ color:var(--v2-measured); }

/* ── 8 · EFFORT A STEP DOWN ────────────────────────────────────────────────────────────────────
   100000 shipped days and man-days at 13px/700 — the same size and weight as the slab area above
   them. They are a secondary fact about the same stage, so one step down subordinates them
   without hiding them. */
body.atiq-stage-v2 .quote-view .sum-eff .sum-qv{ font-size:14.135px; }
body.atiq-stage-v2 .quote-view .sum-eff{ margin-top:7.71px; padding-top:6.425px; }

/* ── [102000] · DUPLICATE MEASUREMENT RUNS ─────────────────────────────────────────────────────
   Groundplan can export one measurement name twice inside a section — the same beam drawn in two
   passes. Those runs are now split into separate groups (sv2SectionRuns), and these two marks are
   how the card says so. Amber throughout: the card's existing colour for "a human should look at
   this", as against blue for measured and teal for finish. */
body.atiq-stage-v2 .quote-view .tk-run{
  font-family:var(--v2-narrow)!important; font-size:9.6375px; font-weight:700; letter-spacing:.11em;
  text-transform:uppercase; white-space:nowrap; color:#e8a33d;             /* 7.73:1 on the card */
  border:1.285px solid rgba(232,163,61,.5); border-radius:2.57px; padding:1.285px 6.425px;
}
body.light.atiq-stage-v2 .quote-view .tk-run{
  color:#b85c00; border-color:rgba(184,92,0,.5);                           /* 4.60:1 on white */
}
body.atiq-stage-v2 .quote-view .sec-dup-chip{
  margin-left:auto; font-family:var(--v2-narrow)!important; font-size:10.28px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; color:#e8a33d;
  border:1.285px solid rgba(232,163,61,.5); border-radius:25.7px; padding:2.57px 10.28px;
}
body.light.atiq-stage-v2 .quote-view .sec-dup-chip{
  color:#b85c00; border-color:rgba(184,92,0,.5);
}
/* the header is a flex row already (justify-content:space-between); the chip needs to sit beside
   the title rather than be pushed against the edit toggle */
body.atiq-stage-v2 .quote-view .section-card-header .sec-dup-chip{ margin-right:10.28px; }

/* ── [102500] · FIND SIMILAR — THE FILTER LAYER ────────────────────────────────────────────────
   ⚠ EVERY COLOUR HERE COMES FROM THE PANEL'S OWN TOKENS, NEVER --v2-*.
   The first cut of this block reached for --v2-ink / --v2-bg2 / --v2-wash and rendered as a
   transparent mess: .sim-panel mounts on document.body, OUTSIDE .quote-view, and the --v2-* set
   is declared on `body.atiq-stage-v2 .quote-view`. Unresolved var() is not a fallback, it is
   nothing — so the input had no background and the typeahead had no fill and floated over the
   list as bare text. The note at :530 says this in as many words and I used the tokens anyway.
   quote-print.css:2128 gives .sim-panel its own --dark-2/-3, --border, --border-md, --text,
   --text-muted, --text-dim and --accent, and :2137 redefines all of them for light. Use those
   and light mode comes free. *//* [103500] UN-SCOPED FROM body.atiq-stage-v2. Every rule below used to carry that prefix, which
   was fine only by accident: core.js:34 puts the class on document.body globally when
   ATIQ_STAGE_V2 is on. But that flag is documented as the one-word revert for the STAGE CARD
   (core.js:18), and this filter bar has nothing to do with the stage card — turning the stage
   card back would have stripped every style off this bar and left the "super bugged and ugly"
   rendering of 102500 behind. These rules belong to .sim-panel, so they say so.
   --accent is still set to #5aa9f0 for .sim-panel at :277 under the flag, on purpose: that is a
   stage-v2 look, and quote-print.css:2132's lime is a perfectly good fallback without it. */
.sim-panel .sim-filter{
  padding:10px 12px 9px; border-bottom:1px solid var(--border-md);
}

/* THE SEARCH FIELD — a standard bubble: border, radius, icon inside on the left. */
.sim-panel .sim-qwrap{ position:relative; }
.sim-panel .sim-qicon{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  font-size:13px; color:var(--text-dim); pointer-events:none; line-height:1;
}
.sim-panel .sim-q{
  width:100%; box-sizing:border-box;
  background:var(--dark-3); color:var(--text);
  border:1px solid var(--border-md); border-radius:18px;
  padding:7px 30px 7px 30px; font-size:12px; font-family:inherit; line-height:1.3;
}
.sim-panel .sim-q::placeholder{ color:var(--text-dim); }
.sim-panel .sim-q:focus{
  outline:none; border-color:var(--accent); background:var(--dark-2);
}
/* the × sits inside the bubble, only once there is something to clear */
.sim-panel .sim-qx{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:none; border:0; cursor:pointer; padding:2px 4px; line-height:1;
  font-size:14px; color:var(--text-dim);
}
.sim-panel .sim-qx:hover{ color:var(--text); }

/* THE TYPEAHEAD — solid fill and its own stacking context, or it ghosts over the list. */
.sim-panel .sim-ta{
  position:absolute; left:0; right:0; top:100%; margin-top:5px; z-index:60;
  background:var(--dark-2); border:1px solid var(--border-md); border-radius:9px;
  overflow:hidden; box-shadow:0 14px 38px rgba(0,0,0,.55);
}
body.light .sim-panel .sim-ta{ box-shadow:0 14px 38px rgba(0,0,0,.16); }
.sim-panel .sim-ta button{
  display:flex; width:100%; align-items:baseline; justify-content:space-between; gap:12px;
  background:none; border:0; cursor:pointer; padding:7px 11px; text-align:left;
  font-family:inherit; font-size:11.5px; color:var(--text);
}
.sim-panel .sim-ta button + button{ border-top:1px solid var(--border); }
.sim-panel .sim-ta button:hover{ background:rgba(90,169,240,.14); }
.sim-panel .sim-tat{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.sim-panel .sim-ta em{
  font-style:normal; font-size:9.5px; color:var(--text-dim); white-space:nowrap; flex:0 0 auto;
}

/* CHIPS — the user's own pinned searches. */
.sim-panel .sim-chips{ display:flex; flex-wrap:wrap; gap:5px; margin-bottom:8px; }
.sim-panel .sim-chip{
  font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-muted); background:var(--dark-3); cursor:pointer;
  border:1px solid var(--border-md); border-radius:20px; padding:3px 9px;
  display:inline-flex; align-items:center; gap:6px; font-family:inherit; line-height:1.5;
}
.sim-panel .sim-chip:hover{ color:var(--text); border-color:var(--text-dim); }
.sim-panel .sim-chip.on{
  color:var(--accent); border-color:var(--accent); background:rgba(90,169,240,.12);
}
.sim-panel .sim-chip i{ font-style:normal; font-size:9px; color:var(--text-dim); }
.sim-panel .sim-chip.on i{ color:var(--accent); }
.sim-panel .sim-chip-x{ font-size:12px; line-height:1; color:var(--text-dim); }
.sim-panel .sim-chip-x:hover{ color:var(--danger); }
.sim-panel .sim-chip-add{ border-style:dashed; background:none; }

.sim-panel .sim-fcount{
  margin-top:8px; font-size:9.5px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--text-dim); display:flex; align-items:center; gap:8px;
}
/* .sim-fclear was deleted here: clearing moved into the × inside the search bubble
   (.sim-qx), so the separate text button stopped being rendered. _deadclass.js caught it. */

/* ── [103500] · SEED CHIPS, NAME MARKS, KEYBOARD SELECTION ─────────────────────────────────────
   Panel tokens only (--dark-2/-3, --border-md, --text, --text-dim, --accent). .sim-panel mounts
   on document.body, OUTSIDE .quote-view, so a --v2-* here resolves to nothing — the 102500 bug. */

/* the two words this stage offers. Dashed = available, solid = applied: the chip has to look
   different from a PINNED chip, which is already on when you see it. */
.sim-panel .sim-seedlb{
  font-size:7.5px; font-weight:800; letter-spacing:.11em; text-transform:uppercase;
  color:var(--text-dim); align-self:center; margin-right:1px;
}
.sim-panel .sim-chip.sim-seed{ border-style:dashed; color:var(--text-muted); }
.sim-panel .sim-chip.sim-seed:hover{ color:var(--text); border-color:var(--text-dim); }
.sim-panel .sim-chip.sim-seed.on{
  border-style:solid; border-color:var(--accent); color:var(--accent); background:transparent;
}

/* The date pill and the name mark share one line under the site name.
   MEASURED: the list column is 190px, which leaves .sim-lnm just 119px. At the date pill's own
   tracking the pair needed 135px and wrapped to a second line, taking the row from 54px to 75px
   — on a filtered list of 12 that is 250px of extra scrolling. Tighter tracking gets the pair to
   112px, but 7px of slack only holds while the word is short, and a seed word is whatever the
   section is called ("reinforcement" is 13 characters). So: NEVER WRAP, TRUNCATE INSTEAD. The
   date keeps its full width, the mark gives way, and the full word is in the title attribute. */
.sim-panel .sim-lpills{ display:flex; gap:4px; align-items:center; margin-top:5px; flex-wrap:nowrap; min-width:0; }
.sim-panel .sim-lpills .sim-date{ margin-top:0; flex:0 0 auto; }
/* NO BORDER ON THE MARK. As a bordered pill it needed 69px beside a 62px date and only 53px was
   left, so the commonest word of all — RETAINING — rendered as "RETAIN…". Dropping the border and
   padding brings the pair to 107px inside 119px, so the word reads whole. It also stops the row
   looking like two competing pills: the date is the pill, the mark is a label on it. */
.sim-panel .sim-term,
.sim-panel .sim-noterm{
  flex:0 1 auto; min-width:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-size:8px; letter-spacing:.02em; text-transform:uppercase;
  background:transparent; border:none; padding:3px 1px;
}
.sim-panel .sim-term{ font-weight:800; color:var(--accent); }
/* absence has to read as "we looked and it is not there", not as "we never looked" */
.sim-panel .sim-noterm{ font-weight:700; color:var(--text-dim); }
/* LIGHT MODE CONTRAST. :277 sets --accent:#5aa9f0 for BOTH themes. Measured on white that blue
   is 2.51:1 — passable for the 12.5px match percentage, not for 8px uppercase pill text, which
   needs 4.5. #1565c0 measures 5.75:1. Dark mode is already 6.64:1 and is left alone. */
body.light .sim-panel .sim-term{ color:#1565c0; }
body.light .sim-panel .sim-chip.sim-seed.on{ color:#1565c0; border-color:#1565c0; }

/* the highlighted suggestion under the arrow keys */
.sim-panel .sim-ta button.on{ background:rgba(90,169,240,.16); }
.sim-panel .sim-ta button.on .sim-tat{ color:var(--text); }
body.light .sim-panel .sim-ta button.on{ background:rgba(21,101,192,.10); }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [106500]  SUMMARY — GROUP BANDS, AND ONE CONTINUOUS DOCUMENT ON SCREEN
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE GROUP BAND ────────────────────────────────────────────────────────────────────────
   A band per group, carrying the name, the stage count and the group's own subtotal — the one
   figure this page never had. --v2-measured is used deliberately here (it IS declared on
   .quote-view, which contains #spanel-summary) so the band's blue is the same blue as every
   measured figure on the page and changes with the theme on its own: #5aa9f0 dark, #1a5fbf light.

   NO border-top. The stage row above already draws one (--v2-rule, .42 white) and a second line
   against it would be the 27px double rule that .sum-row-last exists to prevent.

   ⚠ THE WASH IS WRITTEN OUT PER THEME, not derived from --v2-measured with color-mix(). The
   function would read better and it is widely supported now, but a browser that does not know it
   drops the WHOLE declaration — leaving a band with no wash and no edge, invisible against the
   card, on exactly the device hardest to check. The text colours below DO use the token, because
   an unknown colour there falls back to inherited ink rather than to nothing. */
body.atiq-stage-v2 .quote-view #spanel-summary .sum-gband{
  display:flex; align-items:baseline; gap:11.565px;
  padding:8.995px 14.135px; margin:0; flex-shrink:0;
  background:rgba(90,169,240,.11);
  border-bottom:1.285px solid rgba(90,169,240,.45);
}
body.light.atiq-stage-v2 .quote-view #spanel-summary .sum-gband{
  background:rgba(26,95,191,.09);
  border-bottom-color:rgba(26,95,191,.45);
}
body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-nm{
  font-family:var(--v2-narrow); font-size:11px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--v2-measured);
}
body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-ct{
  font-family:var(--v2-narrow); font-size:8.5px; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--v2-ink3);
}
body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-sp{ flex:1 }
/* the subtotal is a subtotal: tabular and firm, but quieter than the stage totals it sits over,
   which is the [080000] rule that only the conclusion is loud */
body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-tot{
  font-size:12.5px; font-weight:800; letter-spacing:-.02em; color:var(--v2-ink);
  font-variant-numeric:tabular-nums;
}
@media print{
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-gband{
    background:rgba(26,95,191,.08)!important; border-bottom-color:rgba(26,95,191,.5)!important;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-nm{ color:#1a5fbf!important }
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-ct{ color:#6f6f6a!important }
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-gb-tot{ color:#1a1a18!important }
}

/* ── 2 · THE PAGE NUMBER IS PRINT-ONLY ─────────────────────────────────────────────────────────
   James: "don't make it page 1 of 2 (when displayed online), that can stay for when printing."
   On a monitor it describes a division the reader cannot see; on paper it is the one place it
   matters. Hidden, not un-built: the pagination is unchanged and print reads the same DOM.
   [084000]'s rule above still supplies every other property — this only moves the display. */
body.atiq-stage-v2 .quote-view #spanel-summary .sum-pg{ display:none }
@media print{
  body.atiq-stage-v2 .quote-view #spanel-summary .sum-pg{ display:inline-block }
}

/* ── 3 · ONE CONTINUOUS DOCUMENT ON SCREEN ─────────────────────────────────────────────────────
   James: "when viewed it can just keep running."

   The cards are already height:auto on screen (section 2 of the [091500] block above), so there
   is no trailing whitespace to deal with — what still said "sheets" was the 20px gap between
   them, four rounded corners and a border at every seam, a shadow cast by each card onto the
   next, and the whole header repeating on every one.

   ⚠ SCOPED TO .sum-multi, SET BY JS ONLY WHEN THERE IS MORE THAN ONE CARD, so a one-page summary
   — which is most jobs — renders byte-identical to today. And :not(.sum-probe) because the
   MEASURE PROBE is a .summary-page-card too: the class is removed before the probe is built and
   set after it is gone, and this is the third belt on the same pair of braces.

   ⚠ @media screen ONLY. Print needs every seam and every repeated header it has. */
@media screen{
  /* close the seam: no gap, no shadow between, and the corners squared off mid-stack */
  body.atiq-stage-v2 .quote-view #spanel-summary.sum-multi .summary-page-card:not(.sum-probe):not(:last-child){
    margin-bottom:0!important; box-shadow:none!important;
    border-bottom:none!important;
    border-bottom-left-radius:0!important; border-bottom-right-radius:0!important;
  }
  body.atiq-stage-v2 .quote-view #spanel-summary.sum-multi .summary-page-card:not(.sum-probe) + .summary-page-card{
    margin-top:0!important; border-top:none!important;
    border-top-left-radius:0!important; border-top-right-radius:0!important;
  }
  /* the header is page furniture. One of it, at the top, like any other document. */
  body.atiq-stage-v2 .quote-view #spanel-summary.sum-multi .summary-page-card:not(.sum-probe) + .summary-page-card .sum-hd{
    display:none!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [110000]  ROW ALIGNMENT — the three columns start on the same line.

   Nothing about the row's STYLE changes here. The layout, the type, the colours and the three
   columns are exactly what they were; what is fixed is that each column was starting at a
   different height, so the eyebrow, the SLAB label and the TOTAL label sat on three different
   lines and the row read as though it had been shaken.

   Measured on the real page before touching anything: eyebrow at 15px from the top of the row,
   SLAB at 39, TOTAL at 43 — a 28px spread across three things that are all the first line of
   their own column.

   Two of the three offsets were deliberate once and are not any more:
     · the middle and right columns each carry padding-top:13px, which existed to drop them
       clear of the section list that used to sit under the stage name. That list is gone.
     · .sps-tot-* carries padding-top:8px + margin-top:2px to separate the Total from the
       Materials / Labour lines above it. Those lines are gone too, so it is now 10px of gap
       above the only thing in the column.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
/* 1 · THE MIDDLE COLUMN starts level with the eyebrow, so SLAB / BEAMS / PIERS read as the
      same kind of line as STAGE 1, and their figures land level with the stage name.
      ⚠ .sum-band-inner was display:inline-block, which puts the run in a line box and adds
      about 7px of leading above it. That inline-block existed for one reason — to stop
      .sum-eff's border-top running the full width of a 1fr column — and .sum-eff is gone,
      so the wrapper can be a plain block and the leading goes with it. */
body.atiq-stage-v2 .quote-view #spanel-summary .summary-qty-band{ padding-top:0!important }
body.atiq-stage-v2 .quote-view #spanel-summary .sum-band-inner{ display:block!important }

/* 2 · THE RIGHT COLUMN drops clear of the eyebrow so the Total sits on the same line as the
      stage name — the content line of its column, not the label line. The base rule's 13px was
      doing that job while Materials / Labour stood above the Total; with them gone the Total
      landed 6px low (name baseline 42, total 48, measured). 9px puts the two on the same
      baseline (9px, arrived at by measuring, not guessing). It is a measured offset, not a guess: it is the difference between a 15.5px
      name and a 14px total, and it is here rather than in the base rule so the BoQs page,
      which shares .summary-price-col, is untouched. */
body.atiq-stage-v2 .quote-view #spanel-summary .summary-price-col{ padding-top:9px!important }
body.atiq-stage-v2 .quote-view #spanel-summary .sps-tot-lbl,
body.atiq-stage-v2 .quote-view #spanel-summary .sps-tot-val{
  padding-top:0!important; margin-top:0!important;
}

/* ── [111000] the email builder's "Aa" control, in v2 colours ───────────────────────────────
   WHY THIS BLOCK EXISTS. quote-print.css paints the Aa button and its segments with --accent,
   which is correct everywhere else. On this card --accent was deliberately neutralised to
   rgba(255,255,255,.3) (see the LIME, NEUTRALISED note at the top of this file), so a selected
   size or spacing rendered as a grey pill — readable, but not the selection colour the rest of
   v2 uses. Blue is the only accent here, so the control borrows the same treatment as the other
   "on" states on this card: blue border, faint blue wash, blue text — not a solid fill. */
body.atiq-stage-v2 .quote-view .email-aa:hover,
body.atiq-stage-v2 .quote-view .email-aa.changed{
  color:var(--v2-measured)!important; border-color:rgba(90,169,240,.55)!important;
}
body.atiq-stage-v2 .quote-view .email-aa.on{
  color:var(--v2-measured)!important; border-color:var(--v2-measured)!important;
  background:rgba(90,169,240,.13)!important;
}
body.atiq-stage-v2 .quote-view .efp-b:hover{ color:var(--v2-measured)!important; }
body.atiq-stage-v2 .quote-view .efp-b.on{
  color:var(--v2-measured)!important; border-color:var(--v2-measured)!important;
  background:rgba(90,169,240,.13)!important; font-weight:700;
}
/* a selected segment's blue border must not be eaten by its neighbour's -1px overlap */
body.atiq-stage-v2 .quote-view .efp-b.on{ position:relative; z-index:1; border-right-width:1px!important; }
body.atiq-stage-v2 .quote-view .efp-reset:hover{
  color:var(--v2-measured)!important; border-color:rgba(90,169,240,.55)!important;
}
body.light.atiq-stage-v2 .quote-view .email-aa.on,
body.light.atiq-stage-v2 .quote-view .efp-b.on{ background:rgba(26,95,191,.10)!important; }
body.light.atiq-stage-v2 .quote-view .email-aa:hover,
body.light.atiq-stage-v2 .quote-view .email-aa.changed,
body.light.atiq-stage-v2 .quote-view .efp-reset:hover{ border-color:rgba(26,95,191,.5)!important; }

/* [114500] same reason as the block above: the new-page tick's accent-color would resolve to the
   neutralised rgba(255,255,255,.3) and the tick would read as grey on grey. */
body.atiq-stage-v2 .quote-view .efp-cb{ accent-color:var(--v2-measured)!important; }
body.light.atiq-stage-v2 .quote-view .efp-cb{ accent-color:#1a5fbf!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136000]  THE APPROVED STAGE HEADER — design/stage.html, built from design/tokens.css.

   Every colour here is var(--q-…): the design guard's ratchet would fail this file if a raw
   colour were added. Sizes are written in the tokens' TRUE rendered px. (Until 141000 that took a
   wrapper zoom of .77821 to undo the card's ×1.285; the card has no magnification now.) So a 24px
   title is 24px on screen, exactly as the reference page measures it, and print scales with the
   rest of the card the way it always has.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
body.atiq-stage-v2 .quote-view .sv3-hd{ padding:6px 26px 30px; font-family:var(--q-font); color:var(--q-text); }
body.atiq-stage-v2 .quote-view .sv3-hd *{ font-family:var(--q-font)!important; }
body.atiq-stage-v2 .quote-view .sv3-caps{ font-family:var(--q-narrow)!important; font-size:var(--q-fs-caps); font-weight:600;
  letter-spacing:var(--q-caps-ls); text-transform:uppercase; color:var(--q-quiet); }

/* [139000] THE HEADER — "header 3" (sv3Header in stagecard.js, shared with the summary)
     HOUSE                                        14 Framont Ave │ STAGE TOTAL ex GST
     Footings                                  Test Building Co. │ $19,363.36
     ───────────────────────────────────────────────────────────────────────────────
     SLAB 42 m²  BEAMS 101 m  PIERS —  (CONC 20.4 m³)                 DAYS 4  MAN-DAYS 8
   The 136000 job line ("address | BUILDER name" above the title) is gone: with a real builder's
   name in it, three sizes on one line read as clutter. The stage leads; the job is context. */
body.atiq-stage-v2 .quote-view .sv3-htop{ display:flex; align-items:center; justify-content:space-between; gap:30px; padding:0 3px 28px; }
body.atiq-stage-v2 .quote-view .sv3-name{ min-width:0; }
body.atiq-stage-v2 .quote-view .sv3-eyebrow{ display:block; color:var(--q-head); }
body.atiq-stage-v2 .quote-view .sv3-title{ margin-top:3px; font-size:var(--q-fs-title); font-weight:700; letter-spacing:-.4px; line-height:1.1;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.atiq-stage-v2 .quote-view .sv3-hright{ display:flex; align-items:center; gap:26px; flex:none; }
body.atiq-stage-v2 .quote-view .sv3-who{ text-align:right; font-size:var(--q-fs-job); line-height:1.5; min-width:0; }
body.atiq-stage-v2 .quote-view .sv3-addr{ font-weight:600; color:var(--q-sub); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:300px; }
body.atiq-stage-v2 .quote-view .sv3-builder{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:300px; }
body.atiq-stage-v2 .quote-view .sv3-builder b{ font-weight:400; color:var(--q-quiet); }

/* the readouts line, under a hairline: label, figure, unit */
body.atiq-stage-v2 .quote-view .sv3-facts{ display:flex; align-items:center; gap:13px; padding:16px 3px 0; border-top:1px solid var(--q-rule-strong);
  font-variant-numeric:tabular-nums; }
body.atiq-stage-v2 .quote-view .sv3-pills{ display:flex; align-items:center; gap:2px; margin-left:-9px; }
body.atiq-stage-v2 .quote-view .sv3-pill{ display:inline-flex; align-items:baseline; padding:4px 9px; border-radius:var(--q-r-pill);
  border:1px solid transparent; line-height:1.2; white-space:nowrap; }
body.atiq-stage-v2 .quote-view .sv3-pill .sv3-caps{ margin-right:6px; }
body.atiq-stage-v2 .quote-view .sv3-pill b{ font-size:var(--q-fs-pill); font-weight:700; letter-spacing:.2px; color:var(--q-measured); }
body.atiq-stage-v2 .quote-view .sv3-u{ margin-left:2px; font-size:10.5px; font-weight:600; color:var(--q-quiet); }
/* [141000] the card's copy, ×1.285 — this rule is also used outside the card */
body.atiq-stage-v2 .quote-view .sv3-u:where(.page-card,.page-card *,.summary-page-card,.summary-page-card *):not(:where(.sv3-hd,.q-editstrip,.q-undo,.lab-btnrow.q-tools,.q-check,.q-inline-hint,.mat-gadd,.sv3-hd *,.q-editstrip *,.q-undo *,.lab-btnrow.q-tools *,.q-check *,.q-inline-hint *,.mat-gadd *)){ margin-left:2.57px; font-size:13.4925px}
body.atiq-stage-v2 .quote-view .sv3-pill.is-empty .sv3-caps,
body.atiq-stage-v2 .quote-view .sv3-pill.is-empty b{ color:var(--q-ghost); }
/* concrete is the one figure set apart: a faint measured-blue capsule, nothing else changes */
body.atiq-stage-v2 .quote-view .sv3-pill.is-conc{ margin-left:6px; border-color:var(--q-conc-bd); background:var(--q-conc-tint); }
body.atiq-stage-v2 .quote-view .sv3-effort{ display:flex; align-items:baseline; gap:18px; margin-left:auto; }
body.atiq-stage-v2 .quote-view .sv3-stat{ display:inline-flex; align-items:baseline; gap:6px; white-space:nowrap; }
/* [141000] the card's copy, ×1.285 — this rule is also used outside the card */
body.atiq-stage-v2 .quote-view .sv3-stat:where(.page-card,.page-card *,.summary-page-card,.summary-page-card *):not(:where(.sv3-hd,.q-editstrip,.q-undo,.lab-btnrow.q-tools,.q-check,.q-inline-hint,.mat-gadd,.sv3-hd *,.q-editstrip *,.q-undo *,.lab-btnrow.q-tools *,.q-check *,.q-inline-hint *,.mat-gadd *)){ gap:7.71px}
body.atiq-stage-v2 .quote-view .sv3-stat .sv3-caps{ order:-1; }   /* the label leads, like the measures */
body.atiq-stage-v2 .quote-view .sv3-stat b{ font-size:var(--q-fs-labour); font-weight:700; }
body.atiq-stage-v2 .quote-view .sv3-md b{ color:var(--q-labour); }
body.atiq-stage-v2 .quote-view .sv3-vsep{ width:1px; align-self:stretch; flex:none; background:var(--q-rule-strong); }
body.atiq-stage-v2 .quote-view .sv3-fsep{ align-self:center; height:12px; }
body.atiq-stage-v2 .quote-view .sv3-total{ text-align:right; }
/* [139000] the label is its own 14px line, so the total block is the same height whatever the
   surrounding line-height — the design page and the app were 4px apart on it, and a font change
   (GitHub's runner) made it 6. Mirrored in design/base.css .q-bigtotal .q-caps. */
body.atiq-stage-v2 .quote-view .sv3-total > .sv3-caps{ display:block; line-height:14px; }
body.atiq-stage-v2 .quote-view .sv3-exgst{ text-transform:none; letter-spacing:0; color:var(--q-faint); }
body.atiq-stage-v2 .quote-view .sv3-big{ display:block; margin-top:4px; font-size:var(--q-fs-bigtotal); font-weight:800; letter-spacing:-.3px;
  line-height:1.1; color:var(--q-total); white-space:nowrap; font-variant-numeric:tabular-nums; }
/* On paper the total is ink, not lime or olive (DESIGN.md: "Print is ink: black totals"). The app
   prints through @media print rather than the reference pages' body.print class, so the print
   token can't reach it from here; the rule is restated as a role (main text) instead of a colour. */
@media print{ body.atiq-stage-v2 .quote-view .sv3-big{ color:var(--q-text); } }

/* [136000] THE FOOTER IS GONE — notes box, Materials / Labour breakdown and the stage total
   (James: "as per design — removed"). The header carries the total now.
   ⚠ HIDDEN, NOT DELETED, on purpose: four code paths keep #sub-mat-display-N and #total-N up to
   date, and the header's lime total MIRRORS #total-N (sv3MirrorTotal in stagecard.js). The footer
   is that plumbing; removing the node would leave the header frozen at its first value. The
   _stagehead136000 guard edits a real markup and asserts the header still follows. */
body.atiq-stage-v2 .quote-view .page-card-footer{ display:none!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136000]  2c · SECTION TITLES, CARDS, GROUP HEADINGS, NO ROW LINES — design/stage.html

   Tokens only (the ratchet would fail this file on a raw colour). Sizes here are in the CARD's
   units: .page-card runs zoom:1.285 on screen, so a rendered 13.5px title is 10.5px here.
   `html` is prefixed to every selector so these win on specificity over the earlier stage-v2
   blocks without depending on file order — several of those carry !important, so these do too.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* ── two columns, no rule between them: the gap separates them ─────────────────────────── */
html body.atiq-stage-v2 .quote-view .col-breakdown{ border-right:none!important; }
html body.atiq-stage-v2 .quote-view .page-card-body{ gap:21.845px!important; }

/* ── section title: ── TAKE-OFF ☰ ─────────────────── [+] ─────────────────────────────────
   Done in CSS alone, by flex ORDER: the bar is ::before, the title text and the ☰ / group-add
   controls follow, the fading rule is ::after, and the add button is pushed last. No markup
   change, so the three titles (two in stagecard.js, one in labour2.js) cannot come apart. */
html body.atiq-stage-v2 .quote-view .col-breakdown-title,
html body.atiq-stage-v2 .quote-view .col-section-title{
  display:flex!important; align-items:center!important; gap:8.995px!important;
  font-size:13.4925px!important; font-weight:700!important; letter-spacing:0.9509px!important; text-transform:uppercase;
  color:var(--q-text)!important; border-bottom:none!important; padding:0 0 1.285px!important; margin-bottom:8.995px!important;
}
html body.atiq-stage-v2 .quote-view .col-breakdown-title::before,
html body.atiq-stage-v2 .quote-view .col-section-title::before{
  content:''; order:-1; flex:none; width:21.845px; height:2.9555px; border-radius:var(--q-r-pill); background:var(--q-section-bar);
}
html body.atiq-stage-v2 .quote-view .col-breakdown-title::after,
html body.atiq-stage-v2 .quote-view .col-section-title::after{
  content:''; order:2; flex:1; min-width:15.42px; height:1.285px; background:linear-gradient(90deg, var(--q-section-fade), transparent);
}
html body.atiq-stage-v2 .quote-view .tk-ctrl-group,
html body.atiq-stage-v2 .quote-view .lab-ctrl-group{ order:1; }

/* "+ Add" becomes the orange + box. The words stay in the button (font-size:0), so a screen
   reader still hears "Add" and the button's title still explains it. */
html body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add,
html body.atiq-stage-v2 .quote-view .col-section-title .sv2-add,
html body.atiq-stage-v2 .quote-view .col-section-title .l2-add{
  order:3; margin-left:0!important; display:inline-flex!important; align-items:center; justify-content:center;
  width:19.275px!important; height:19.275px!important; padding:0!important; border-radius:6.0395px!important; font-size:0!important;
  border:1.285px solid var(--q-add-bd)!important; background:var(--q-add-tint)!important; color:var(--q-add)!important;
}
html body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add::after,
html body.atiq-stage-v2 .quote-view .col-section-title .sv2-add::after,
html body.atiq-stage-v2 .quote-view .col-section-title .l2-add::after{
  content:'+'; font-size:12.85px; font-weight:700; line-height:1;
}
html body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add:hover,
html body.atiq-stage-v2 .quote-view .col-section-title .sv2-add:hover,
html body.atiq-stage-v2 .quote-view .col-section-title .l2-add:hover{ border-color:var(--q-add)!important; }
/* ☰ compact and the labour group-add sit beside the title in the same orange */
html body.atiq-stage-v2 .quote-view .col-breakdown-title .hdr-addbtn,
html body.atiq-stage-v2 .quote-view .col-section-title .hdr-addbtn{ color:var(--q-add)!important; }

/* ── cards: a diagonal fade is the edge, no border, rounded ──────────────────────────────── */
html body.atiq-stage-v2 .quote-view .section-card,
html body.atiq-stage-v2 .quote-view .panel-card{
  background:var(--q-card)!important; border:1.285px solid var(--q-card-bd)!important; border-radius:14.135px!important;
  padding:7.71px 14.135px 14.135px!important; margin-bottom:12.85px!important;
}
html body.atiq-stage-v2 .quote-view .section-card + .section-card{ border-top:1.285px solid var(--q-card-bd)!important; }

/* ── group headings: soft orange caps (FOOTINGS · HOUSE, CONCRETE, LABOUR) ───────────────── */
html body.atiq-stage-v2 .quote-view .section-card .section-card-header{ border-bottom:1.285px solid var(--q-rule)!important; }
html body.atiq-stage-v2 .quote-view .section-header-title,
html body.atiq-stage-v2 .quote-view .lab-group-b3 td{
  font-family:var(--q-narrow)!important; font-size:9.509px!important; font-weight:600!important; letter-spacing:1.285px!important;
  color:var(--q-head)!important;
}
html body.atiq-stage-v2 .quote-view .section-header-title .sec-type{ color:var(--q-head)!important; }
html body.atiq-stage-v2 .quote-view .section-header-title .sec-nm{ color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .section-header-title .sec-dot{ color:var(--q-faint)!important; }
html body.atiq-stage-v2 .quote-view .lab-group-b3 td{ border-bottom:1.285px solid var(--q-rule)!important; }

/* ── no row lines on screen: spacing separates rows. Print keeps its faint lines ─────────── */
@media screen{
  /* .page-card … tbody lifts these above the take-off's own (0,5,4) row rules */
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.l2-row td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.l2-day td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.lab-display-row td,
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.lab-edit-row td{ border-bottom-color:transparent!important; border-top-color:transparent!important; }
}
/* the white rule between the material schedule and labour: the gap does that job now */
html body.atiq-stage-v2 .quote-view .col-quantities{ border-bottom:none!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136000]  2d · TAKE-OFF ROWS — design/stage.html
     [BEAMS] SF1 - Strip Footing (300W x 400D) [450W x 450D] ……… ✓  53 m
   The tag moves to the LEFT as an outline; the name is in normal case, not capitals; the
   bracketed sizes go quiet; the run is the blue figure. Card units (÷1.285), tokens only.
   ⚠ The ✓ stays BEFORE the figure, not after the unit as on the reference page: it is its own
   table cell, and reordering cells would break the column widths the whole take-off aligns to.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-counted td{ background:var(--q-row-hi)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .part-row-inner{ display:flex!important; align-items:center; gap:8.995px; min-width:0; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .tk-tag{
  order:-1; flex:none; width:46.26px; padding:1.285px 0!important; text-align:center; margin:0!important;
  border:1.285px solid var(--q-tag-bd)!important; border-radius:var(--q-r-pill)!important; background:transparent!important;
  color:var(--q-tag)!important; font-family:var(--q-narrow)!important; font-size:8.481px!important; font-weight:700!important;
  letter-spacing:0.771px!important; text-transform:uppercase;
}
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .part-title-txt{
  text-transform:none!important; font-size:10.9225px!important; font-weight:600!important; letter-spacing:0.1028px!important;
  color:var(--q-text)!important; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .tk-brk{
  text-transform:none!important; font-size:9.509px!important; font-weight:500!important; letter-spacing:0!important; color:var(--q-quiet)!important;
}
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .sec-measure-pill{
  font-size:15.0345px!important; font-weight:800!important; color:var(--q-measured)!important; background:none!important; border:none!important; padding:0!important;
}
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row td.part-unit-cell{ font-size:9.509px!important; font-weight:700!important; color:var(--q-quiet)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .dv-mark.ok{ color:var(--q-ok)!important; }

/* sub-item rows (3TM11 · 19.71 ea): the quiet data rows */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td{ font-size:10.28px!important; color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row td:last-child{ color:var(--q-quiet)!important; }

/* "Footings Bars (2N12 Corner) - Top and Bottom" — a sub-item heading styled as a data row
   (decided 10 Nov: it was competing with the items above it) */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub td{ background:transparent!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub .part-title-txt{ font-size:10.28px!important; font-weight:400!important; color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.tk-sub .sec-measure-pill{ font-size:10.28px!important; font-weight:400!important; color:var(--q-sub)!important; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136000]  2e · CARD TOTALS — design/stage.html
     Materials Total ……………………………… $9,116.51      (lime)
     Markup [15 %] …………………… $7,927.40 + $1,189.11
     Labour Total | 4 DAYS 8 MAN-DAYS …… $10,110.00  (lime)
   ════════════════════════════════════════════════════════════════════════════════════════════ */
/* the subtotal line goes: the markup line now shows "materials + markup" itself.
   Hidden not deleted — #sub-mat-N is what updateLabSubtotals() reads the materials figure from. */
html body.atiq-stage-v2 .quote-view .subtotal-row-padded{ display:none!important; }
html body.atiq-stage-v2 .quote-view .markup-section{ display:flex!important; flex-direction:column; margin:0!important; padding:0!important; }
html body.atiq-stage-v2 .quote-view .markup-total-row{
  order:-1; display:flex!important; justify-content:space-between; align-items:baseline;
  margin-top:10.28px; padding:14.135px 7.71px 3.855px!important; border-top:1.285px solid var(--q-rule-strong)!important; border-bottom:none!important;
}
html body.atiq-stage-v2 .quote-view .markup-total-label,
html body.atiq-stage-v2 .quote-view .labour-total-label{ font-size:12.85px!important; font-weight:700!important; color:var(--q-text)!important; letter-spacing:0!important; text-transform:none!important; }
/* .page-card + the row class out-ranks the 1291 block (0,5,2), which carries !important too */
html body.atiq-stage-v2 .quote-view .page-card .markup-total-row .markup-total-value,
html body.atiq-stage-v2 .quote-view .page-card .lab-total-row span.labour-total-value{ font-size:15.42px!important; font-weight:700!important; color:var(--q-total)!important; }
html body.atiq-stage-v2 .quote-view .markup-value{ white-space:nowrap; }
html body.atiq-stage-v2 .quote-view .page-card .markup-section .markup-row{ display:flex!important; align-items:center; gap:8.995px; margin:0!important; padding:5.14px 7.71px 0!important; border:none!important; }
html body.atiq-stage-v2 .quote-view .page-card .markup-section .markup-row .markup-value{ margin-left:auto!important; width:auto!important; min-width:0!important; }
html body.atiq-stage-v2 .quote-view .markup-label,
html body.atiq-stage-v2 .quote-view .markup-value{ font-size:10.28px!important; color:var(--q-quiet)!important; }
html body.atiq-stage-v2 .quote-view .markup-input-wrap{ border:1.285px solid var(--q-pill-bd)!important; border-radius:6.0395px; padding:1.285px 6.425px; }
html body.atiq-stage-v2 .quote-view .markup-pct-input{ color:var(--q-text)!important; font-weight:700!important; }

html body.atiq-stage-v2 .quote-view .lab-total-row{
  display:flex!important; justify-content:space-between; align-items:baseline;
  margin-top:10.28px; padding:14.135px 7.71px 3.855px!important; border-top:1.285px solid var(--q-rule-strong)!important;
}
html body.atiq-stage-v2 .quote-view .labour-total-label{ display:inline-flex!important; align-items:baseline; gap:14.135px; }
html body.atiq-stage-v2 .quote-view .sv3-labstats:not(:empty){ display:inline-flex; align-items:baseline; gap:11.565px; padding-left:14.135px; border-left:1.285px solid var(--q-rule-strong); }
html body.atiq-stage-v2 .quote-view .sv3-labstats .sv3-stat b{ font-size:11.565px; font-weight:700; }
html body.atiq-stage-v2 .quote-view .sv3-labstats .sv3-caps{ font-family:var(--q-narrow)!important; font-size:9.509px; letter-spacing:0.6425px; text-transform:uppercase; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view .sv3-labstats .sv3-md b{ color:var(--q-labour); }
/* …and off the Labour group heading, where they used to sit */
html body.atiq-stage-v2 .quote-view .lab-group-days,
html body.atiq-stage-v2 .quote-view .l2-gdays{ display:none!important; }   /* v1 and v2 labour each draw their own */
@media print{
  html body.atiq-stage-v2 .quote-view .page-card .markup-total-row .markup-total-value,
  html body.atiq-stage-v2 .quote-view .page-card .lab-total-row span.labour-total-value{ color:var(--q-text)!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136000]  2f · THE PILL FILTER (logic: sv3Filter in stagecard.js)
   The pill you clicked fills blue — the "blue fill" decided on the canvas, no "Showing … only"
   banner. Hidden rows go on SCREEN only; print always shows the whole take-off.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view .sv3-pill.is-filter{ cursor:pointer; transition:background .15s, border-color .15s; }
html body.atiq-stage-v2 .quote-view .sv3-pill.is-filter:hover{ border-color:var(--q-measured); }
html body.atiq-stage-v2 .quote-view .sv3-pill.is-filter:focus-visible{ outline:2px solid var(--q-measured); outline-offset:2px; }
html body.atiq-stage-v2 .quote-view .sv3-pill.is-on{ background:var(--q-measured-tint); border-color:var(--q-measured); }
@media screen{ html body.atiq-stage-v2 .quote-view .sv3-out{ display:none!important; } }
@media print{ html body.atiq-stage-v2 .quote-view .sv3-pill.is-on{ background:none; border-color:var(--q-pill-bd); } }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [136500]  THE SUMMARY PAGE — design/summary.html (logic: renderSummary in stages.js)
     STAGES ──────────────────────────────── [All | House | External]
     ┌ HOUSE  2 stages ───────────────────────────────────────────────┐
     │ ① Footings  SLAB 42 m²  BEAMS 101 m  …  4 days 8 man-days  $19,363.36 ▾ │
     │     TAKE-OFF  [BEAMS] SF1 - Strip Footing (300W x 400D) …… 53 m │
     │ House total | 8 DAYS 21 MAN-DAYS ……………………………… $40,451.52 │
     └────────────────────────────────────────────────────────────────┘
   Tokens only. Sizes are CARD units: .summary-page-card runs zoom:1.285 on screen like the stage
   card, so every reference px from base.css is divided by 1.285 here (15px → 11.7px).

   ⚠ A GROUP IS ONE CARD DRAWN FROM SEVERAL NODES. The page packing in stages.js breaks between
   stages, so the heading, each stage and the closing total are separate flow items; each carries
   .sv3-card-first / -mid / -last and these rules draw the fill and the corners from that. Gaps
   are MARGINS and the body's own gap is 0 — stages.js counts each node's margins into its height,
   so the packing still knows exactly what every node costs the page.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body{ gap:0!important; font-family:var(--q-font); color:var(--q-text); }
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body *{ font-family:var(--q-font); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-caps{ font-family:var(--q-narrow)!important; }

/* [139000] the header: $ per m² is the last readout (Page n of N is on the eyebrow) */
html body.atiq-stage-v2 .quote-view .sum-hd .sv3-perm2{ margin-left:-6px; }
html body.atiq-stage-v2 .quote-view .sum-hd .sv3-perm2 b{ color:var(--q-sub); }

/* STAGES ── [All | House | External] */
html body.atiq-stage-v2 .quote-view .sv3-section{ display:flex; align-items:center; gap:10.023px; margin:0 0 10.023px; }
html body.atiq-stage-v2 .quote-view .sv3-section::before{ content:''; flex:none; width:21.845px; height:2.9555px; border-radius:var(--q-r-pill); background:var(--q-section-bar); }
html body.atiq-stage-v2 .quote-view .sv3-section h2{ margin:0; font-size:13.4925px; font-weight:700; letter-spacing:0.9509px; text-transform:uppercase; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .sv3-section .sv3-fade{ flex:1; height:1.285px; background:linear-gradient(90deg, var(--q-section-fade), transparent); }
html body.atiq-stage-v2 .quote-view .sv3-seg{ display:inline-flex; align-items:center; gap:1.9275px; padding:2.9555px; border-radius:var(--q-r-pill); border:1.285px solid var(--q-pill-bd); }
html body.atiq-stage-v2 .quote-view .sv3-segb{ padding:5.0115px 11.051px; border:0; border-radius:var(--q-r-pill); background:transparent; color:var(--q-quiet);
  font:700 11.4365px var(--q-font); line-height:1; cursor:pointer; }
html body.atiq-stage-v2 .quote-view .sv3-segb:hover{ color:var(--q-sub); }
html body.atiq-stage-v2 .quote-view .sv3-segb[aria-pressed="true"]{ background:var(--q-seg-on); color:var(--q-text); }

/* the card, in pieces */
/* [138500] the fill is --q-card, the stage cards' own gradient, sized to the WHOLE group card and
   offset by where this piece sits in it (--gh / --gy, set by sumCardFade in stages.js) so the
   pieces paint one gradient between them. 136500 used a flat --q-card-flat because the gradient
   restarted on every node; that is why the cards did not match the design. The token is gone. */
html body.atiq-stage-v2 .quote-view .sv3-card{ background:var(--q-card); background-size:100% var(--gh,100%); background-position:0 calc(-1 * var(--gy,0px)); background-repeat:no-repeat;
  border:1.285px solid var(--q-card-bd); border-top:0; border-bottom:0;
  padding-left:16.0625px!important; padding-right:16.0625px!important; border-radius:0; }
html body.atiq-stage-v2 .quote-view .sv3-card-first,
html body.atiq-stage-v2 .quote-view .sv3-card-only{ border-top:1.285px solid var(--q-card-bd); border-top-left-radius:16.0625px; border-top-right-radius:16.0625px; padding-top:11.9505px!important; }
html body.atiq-stage-v2 .quote-view .sv3-card-last,
html body.atiq-stage-v2 .quote-view .sv3-card-only{ border-bottom:1.285px solid var(--q-card-bd); border-bottom-left-radius:16.0625px; border-bottom-right-radius:16.0625px;
  padding-bottom:14.0065px!important; margin-bottom:14.0065px; }

/* HOUSE  2 stages — the group heading inside its card */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-ghead{ display:flex!important; align-items:center; gap:10.023px; margin:0!important;
  padding-top:15.934px!important; padding-left:22.102px!important; padding-bottom:7.967px!important; border-bottom:none!important; box-shadow:inset 0 -1.285px 0 var(--q-rule);
  background:var(--q-card)!important; background-size:100% var(--gh,100%)!important; background-position:0 calc(-1 * var(--gy,0px))!important; background-repeat:no-repeat!important; }
html body.atiq-stage-v2 .quote-view .sv3-gname{ font-size:11.051px!important; letter-spacing:1.542px!important; color:var(--q-head)!important; }
html body.atiq-stage-v2 .quote-view .sv3-gcount{ font-size:11.051px; color:var(--q-faint); }

/* a stage row: ① Footings · measures · days · total · ▾ */
html body.atiq-stage-v2 .quote-view .summary-stage-row.sv3-srow{ display:block!important; border-top:none!important; border-bottom:none!important;
  border-left:1.285px solid var(--q-card-bd)!important; border-right:1.285px solid var(--q-card-bd)!important; margin:0!important; padding-top:0!important; padding-bottom:0!important; }
html body.atiq-stage-v2 .quote-view .sv3-sline{ display:flex; align-items:center; gap:14.0065px; padding:11.9505px 6.0395px; }
html body.atiq-stage-v2 .quote-view .sv3-num{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:25.7px; height:25.7px; border-radius:50%;
  border:1.285px solid var(--q-rule-strong); font-size:12.4645px; font-weight:700; color:var(--q-sub); }
html body.atiq-stage-v2 .quote-view .sv3-sname{ flex:none; width:128.5px; font-size:15.0345px; font-weight:600; color:var(--q-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html body.atiq-stage-v2 .quote-view .sv3-meas{ display:flex; flex:1; min-width:0; font-variant-numeric:tabular-nums; }
html body.atiq-stage-v2 .quote-view .sv3-m{ display:inline-flex; align-items:center; gap:3.855px; flex:none; line-height:1; }
html body.atiq-stage-v2 .quote-view .sv3-m.slab{ width:75.815px; }
html body.atiq-stage-v2 .quote-view .sv3-m.beams{ width:79.67px; }
html body.atiq-stage-v2 .quote-view .sv3-m.piers{ width:53.97px; }
html body.atiq-stage-v2 .quote-view .sv3-m.conc{ width:79.67px; }
html body.atiq-stage-v2 .quote-view .sv3-m .sv3-caps{ font-size:7.967px; letter-spacing:1.1051px; color:var(--q-row-label); }
html body.atiq-stage-v2 .quote-view .sv3-m b{ font-size:11.051px; font-weight:600; color:var(--q-measured); }
html body.atiq-stage-v2 .quote-view .sv3-m .sv3-u{ font-size:8.995px; font-weight:600; color:var(--q-row-label); }
html body.atiq-stage-v2 .quote-view .sv3-m.is-empty .sv3-caps,
html body.atiq-stage-v2 .quote-view .sv3-m.is-empty b{ color:var(--q-row-empty); font-weight:400; }
html body.atiq-stage-v2 .quote-view .sv3-sdays{ flex:none; width:150.345px; text-align:right; white-space:nowrap; font-size:11.9505px; color:var(--q-quiet); font-variant-numeric:tabular-nums; }
html body.atiq-stage-v2 .quote-view .sv3-sdays b{ font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .sv3-sdays b.md{ color:var(--q-labour); }
html body.atiq-stage-v2 .quote-view .sv3-stot{ flex:none; width:111.795px; text-align:right; font-size:15.0345px; font-weight:700; color:var(--q-text); font-variant-numeric:tabular-nums; white-space:nowrap; }
/* [138500] the per-stage ▾ (.sv3-shut) was here; the ☰ on the STAGES heading replaced it */

/* the items under an open stage — a quiet list hanging off the row */
html body.atiq-stage-v2 .quote-view .sv3-hang{ margin:0 43.69px 7.967px 46.26px; padding:1.9275px 0 3.855px 16.0625px; border-left:1.285px solid var(--q-rule-strong); }
html body.atiq-stage-v2 .quote-view .sv3-hang-h{ display:block; padding:1.9275px 0 3.855px; font-size:8.481px!important; letter-spacing:1.028px!important; color:var(--q-head)!important; }
html body.atiq-stage-v2 .quote-view .sv3-hrow{ display:flex; align-items:center; gap:10.023px; padding:5.0115px 0; font-size:12.4645px; font-variant-numeric:tabular-nums; }
html body.atiq-stage-v2 .quote-view .sv3-hrow .sv3-tag{ flex:none; width:46.26px; text-align:center; padding:1.285px 0; border-radius:var(--q-r-pill); border:1.285px solid var(--q-tag-bd);
  color:var(--q-tag); font-family:var(--q-narrow)!important; font-size:8.995px; font-weight:700; letter-spacing:0.771px; text-transform:uppercase; }
html body.atiq-stage-v2 .quote-view .sv3-hname{ flex:1; min-width:0; color:var(--q-sub); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html body.atiq-stage-v2 .quote-view .sv3-dims{ font-size:11.051px; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view .sv3-hrow b{ font-weight:700; color:var(--q-measured); }
html body.atiq-stage-v2 .quote-view .sv3-hu{ flex:none; width:25.7px; font-size:11.4365px; color:var(--q-quiet); }
/* [138500] compact (the ☰) is a screen state: paper always lists the items, and the pages were
   measured that way. ⚠ …which means the PROBE must measure them listed — hence :not(.sum-probe).
   The pages are packed on screen from the hidden .sum-probe card, which sits inside this same
   panel; measured compact, a stage costs one line, and paper — which lists the items regardless —
   ran 175px off the foot of the page. _summary136500 [5] caught exactly that in 136500. */
/* [142000] the compact rule moved to the [142000] SUMMARY block: paper prints what the screen shows,
   and the probe measures it that way too, so the pages are packed for what is showing. */

/* House total | 8 DAYS 21 MAN-DAYS ……… $40,451.52 */
/* [138500] the design's .q-gtotal padding 20 / 6 / 4 inside the group's 16 / 14, in card px. Written
   as longhands that ADD the two, because this node is also the card's last piece and a shorthand
   here would wipe the card's own side and bottom padding (.sv3-card / .sv3-card-last above).
   The heading does the same on its left: 16 + 6. */
html body.atiq-stage-v2 .quote-view .sv3-gtotal{ display:flex; justify-content:space-between; align-items:baseline;
  padding-top:20.046px!important; padding-right:22.102px!important; padding-bottom:17.99px!important; }
html body.atiq-stage-v2 .quote-view .sv3-glbl{ display:flex; align-items:baseline; gap:17.99px; font-size:14.0065px; font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .sv3-gstats{ display:inline-flex; align-items:baseline; gap:16.0625px; padding-left:17.99px; border-left:1.285px solid var(--q-rule-strong); }
html body.atiq-stage-v2 .quote-view .sv3-gstats .sv3-stat{ display:inline-flex; align-items:baseline; gap:5.14px; }
html body.atiq-stage-v2 .quote-view .sv3-gstats b{ font-size:12.9785px; font-weight:700; }
html body.atiq-stage-v2 .quote-view .sv3-gstats .sv3-caps{ font-size:9.509px; letter-spacing:0.771px; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view .sv3-gstats .sv3-md b{ color:var(--q-labour); }
html body.atiq-stage-v2 .quote-view .sv3-gval{ font-size:16.962px; font-weight:800; color:var(--q-total); font-variant-numeric:tabular-nums; white-space:nowrap; }
@media print{
  html body.atiq-stage-v2 .quote-view .sv3-gval{ color:var(--q-text); }
  html body.atiq-stage-v2 .quote-view .sv3-card{ background:transparent; }
  html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-ghead{ background:transparent!important; }
  html body.atiq-stage-v2 .quote-view .sv3-card{ border-color:var(--q-rule-strong); }
  html body.atiq-stage-v2 .quote-view .summary-stage-row.sv3-srow{ border-left-color:var(--q-rule-strong)!important; border-right-color:var(--q-rule-strong)!important; }
  html body.atiq-stage-v2 .quote-view .sv3-card-first, html body.atiq-stage-v2 .quote-view .sv3-card-only{ border-top-color:var(--q-rule-strong); }
  html body.atiq-stage-v2 .quote-view .sv3-card-last, html body.atiq-stage-v2 .quote-view .sv3-card-only{ border-bottom-color:var(--q-rule-strong); }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [137000]  PAPER — what the 137000 print audit found the quote was NOT getting.
   Colours are not here: core.js puts the body in `light print` for every route to the printer,
   so the --q-* tokens take their print values from design/tokens.css. These are the rules a
   token cannot fix. _print137000 checks each one, on the summary and a stage, by every route.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media print{
  /* the orange + boxes printed: the 2c rule that draws them says display:inline-flex!important
     at higher specificity than .no-print{display:none!important}, so it won. Restated at the same
     specificity, inside print, so the hide wins on paper and the box stays on screen. */
  html body.atiq-stage-v2 .quote-view .col-breakdown-title .sv2-add,
  html body.atiq-stage-v2 .quote-view .col-section-title .sv2-add,
  html body.atiq-stage-v2 .quote-view .col-section-title .l2-add{ display:none!important; }

  /* Archivo on paper too. quote-print.css:819 sets `.quote-view *{Helvetica!important}` for print,
     which the stage card's own rules out-rank but the summary's rows did not — so the printed
     summary came out half Archivo (header) and half Helvetica (rows). */
  html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body *{ font-family:var(--q-font)!important; }
  html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body .sv3-caps,
  html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body .sv3-tag{ font-family:var(--q-narrow)!important; }

  /* the header row on A4. Days and man-days print now, which made the row ~15px wider than the
     printed page, and flexbox took it out of the title first: "Sum…". The title never shrinks;
     the gaps between the pieces close up a little on paper instead. */
  /* [139000] the header's readouts line on A4: the gaps close up a little rather than wrap */
  html body.atiq-stage-v2 .quote-view .sv3-facts{ gap:9px; }
  html body.atiq-stage-v2 .quote-view .sv3-effort{ gap:12px; }

  /* the take-off name wraps on paper instead of ending in "…": the printed tag takes room the
     name used to have, and the bracketed size at the end is the part a builder checks.
     The stage card is fitted to the page after this (core.js fit()), so a taller row costs scale,
     not a second sheet. */
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row .part-title-txt{ white-space:normal!important; overflow:visible!important; text-overflow:clip!important; }

  /* print is the one mode that keeps faint row lines — at the token's weight, not quote-print's #eee */
  html body.atiq-stage-v2 .quote-view .page-card .tbl tbody td{ border-bottom-color:var(--q-row-line)!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [137500]  INLINE EDITS IN THE CARD — design/popups.html 02 03 04 07 08 11 (logic: pop.js
   qField / qEditStrip / qInlineKeys).

   The ring and the strip are design/popups.css. What this block adds is only what living inside
   the stage card needs:
     · the strip's buttons and hint are the reference page's true px (until 141000 the strip was
       wrapped back to zoom .77821 to cancel the card's ×1.285; the card has no zoom now)
     · the older input styles (.edit-mode-cell input, .group-name-input, .sec-measure-input…) set
       boxes, heights and backgrounds with !important; these out-rank them so the field is the
       ring and keeps the cell's own font, size and colour — editing never changes size
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view .page-card input.q-field{
  display:inline-block!important; box-sizing:content-box!important; height:auto!important; min-height:0!important;
  padding:1.285px 3.855px!important; margin:-2.57px -5.14px!important; line-height:inherit!important;
  border:1.285px solid var(--q-input-bd)!important; border-radius:3.855px!important; background:var(--q-input-bg)!important;
  font:inherit!important; color:inherit!important; letter-spacing:inherit!important; text-transform:none!important;
  box-shadow:none!important; outline:none!important; min-width:0;
}
html body.atiq-stage-v2 .quote-view .page-card input.q-field.r{ text-align:right!important; }
html body.atiq-stage-v2 .quote-view .page-card input.q-field[type=number]{ -moz-appearance:textfield; appearance:textfield; }
html body.atiq-stage-v2 .quote-view .page-card input.q-field::-webkit-inner-spin-button,
html body.atiq-stage-v2 .quote-view .page-card input.q-field::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }
html body.atiq-stage-v2 .quote-view .page-card input.q-field:focus{ border-color:var(--q-add)!important; }
/* a name field takes its whole column; a number hugs its figure */
html body.atiq-stage-v2 .quote-view .page-card .part-title-txt > input.q-field,
html body.atiq-stage-v2 .quote-view .page-card td.edit-mode-cell > input.q-field[type=text],
html body.atiq-stage-v2 .quote-view .page-card tr.row-editing td:first-child > input.q-field{ width:calc(100% - 10.28px)!important; }
html body.atiq-stage-v2 .quote-view .page-card input.q-field[type=number]{ width:6ch!important; }
/* a field straight in a table cell fills that cell (less its ring's own overhang), so neighbouring
   fields never overlap in the narrow Qty / Unit columns */
html body.atiq-stage-v2 .quote-view .page-card .tbl td > input.q-field{ width:calc(100% - 17.99px)!important; max-width:none; }
html body.atiq-stage-v2 .quote-view .page-card .tbl td .qty-stepper > input.q-field{ width:4ch!important; }
/* the ring overhangs its text by 4px each side; an edit row's cells get the room for it, so two
   fields side by side (Qty | Unit) never touch */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.row-editing td,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.lab-edit-row td{ padding-left:8.995px!important; padding-right:8.995px!important; }
/* the group heading's own field is as wide as the name, not the row */
html body.atiq-stage-v2 .quote-view .page-card .tbl td > input.lab-group-title-input.q-field{ width:40%!important; field-sizing:content; min-width:8ch; }
html body.atiq-stage-v2 .quote-view .page-card .part-title-txt{ overflow:visible!important; flex:1 1 auto; }

/* the row being edited: its own quiet tint, as on the reference page; nothing else about it moves */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.row-editing td,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.group-editing td{ background:var(--q-row-hi)!important; }
/* the old floating × and the in-row + Row / Counts: their jobs moved to the strip */
html body.atiq-stage-v2 .quote-view .page-card tr.row-editing .row-del-float,
html body.atiq-stage-v2 .quote-view .page-card .group-controls-float{ display:none!important; }

/* the strip */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-editstrip-row td{
  padding:0!important; border:none!important; background:var(--q-row-hi)!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip{ padding:6px 8px 7px; }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .hint{ font-size:9.5px; color:var(--q-faint); }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip.has-tools{ gap:8px; }
@media print{ html body.atiq-stage-v2 .quote-view .page-card .q-editstrip-row{ display:none!important; } }
/* the card's own button rules (quote-print.css) reach these buttons too; the strip's buttons are
   the design's .q-btn and nothing else */
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .q-btn{
  display:inline-flex!important; align-items:center!important; height:22px!important; padding:0 10px!important; margin:0!important;
  border-radius:var(--q-r-btn)!important; font:600 10.3px var(--q-font)!important; letter-spacing:0!important; text-transform:none!important;
  border:1px solid var(--q-pill-bd)!important; background:transparent!important; color:var(--q-text)!important; min-width:0!important; width:auto!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .q-btn.is-primary{ background:var(--q-total-fill)!important; border-color:transparent!important; color:var(--q-total-ink)!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .q-btn.is-ghost{ border-color:transparent!important; color:var(--q-quiet)!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .q-btn.is-danger{ color:var(--q-danger)!important; }

/* [137500] 12 · COMPACT VIEW (design/popups.html 12): every item folded to its own row — just the
   items and their quantities. The sub-items block (the SUB ITEMS rule and the rows under it) went
   with them; before, compact still showed the rule and its heading rows, so it was never quite
   compact. The ☰ wears the orange add-box edge while it is on. */
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tk-subdiv,
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tbl-part-row.tk-sub{ display:none!important; }
html body.atiq-stage-v2 .quote-view .col-breakdown-title .tk-compact-btn.on{
  border:1.285px solid var(--q-add)!important; border-radius:6.0395px!important; background:var(--q-add-tint)!important; }

/* [137500] 07 · RENAME A LABOUR GROUP — the heading is the field: the heading's own caps, size and
   orange inside the ring, and the hint at the right of the heading line. */
html body.atiq-stage-v2 .quote-view .page-card tr.lab-group-b3 td{ position:relative; }
html body.atiq-stage-v2 .quote-view .page-card input.lab-group-title-input.q-field{
  width:auto!important; max-width:60%; color:var(--q-head)!important; text-transform:uppercase!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-inline-hint{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  font-family:var(--q-font)!important; font-size:9.5px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--q-faint); }

/* [137500] 02 / 03 · ADDING A LINE. A group's + shows only while you hover its heading (the
   labour groups already did this, as .l2-rowadd); the blank line it drops in is a row like any
   other, ringed. The old in-row × buttons of the labour and manual editors went to the strip. */
html body.atiq-stage-v2 .quote-view .page-card tr.mat-group-row td{ position:relative; }
html body.atiq-stage-v2 .quote-view .page-card .mat-gadd{
  position:absolute; right:4px; top:50%; transform:translateY(-50%);
  width:15px; height:15px; padding:0; font-size:11px; line-height:1; opacity:0; transition:opacity .12s; }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-group-row:hover .mat-gadd,
html body.atiq-stage-v2 .quote-view .page-card .mat-gadd:focus-visible{ opacity:1; }
html body.atiq-stage-v2 .quote-view .page-card tr.lab-edit-row td .btn-danger{ display:none!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-add-row td{ background:var(--q-row-hi)!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-add-row input.q-field::placeholder{ color:var(--q-faint); font-weight:400; }

/* the price list under a name being typed — design 02, the Panel family. Its old dark/light box
   (quote-print.css) is replaced, not layered on: tokens only, so light mode comes free. */
.pricing-ac-menu-portal.q-panel{ z-index:10040; padding:8px; width:300px; max-width:calc(100vw - 24px);
  font-family:var(--q-font); color:var(--q-text); background:var(--q-surface)!important; border:1px solid var(--q-surface-bd)!important;
  box-shadow:var(--q-shadow)!important; border-radius:var(--q-r-panel)!important; }
.pricing-ac-menu-portal.q-panel .q-panel-head{ padding:2px 6px 6px; }
.pricing-ac-menu-portal.q-panel .q-caps{ font-family:var(--q-narrow); font-size:var(--q-fs-caps); font-weight:600; letter-spacing:var(--q-caps-ls);
  text-transform:uppercase; color:var(--q-quiet); }
.pricing-ac-menu-portal.q-panel .pac-item{ display:flex!important; align-items:center; gap:10px; padding:7px 8px!important; border:0!important;
  border-radius:8px; font-size:12.5px; cursor:pointer; background:none; }
.pricing-ac-menu-portal.q-panel .pac-item.is-on, .pricing-ac-menu-portal.q-panel .pac-item:hover{ background:var(--q-hover)!important; }
.pricing-ac-menu-portal.q-panel .pac-desc{ flex:1; min-width:0; color:var(--q-text)!important; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pricing-ac-menu-portal.q-panel .pac-desc b{ color:inherit!important; font-weight:800; }
.pricing-ac-menu-portal.q-panel .pac-desc .u{ font-weight:400; color:var(--q-quiet); }
.pricing-ac-menu-portal.q-panel .pac-rate{ font-family:var(--q-font)!important; font-size:12.5px!important; font-weight:600; color:var(--q-text)!important; min-width:0!important; }
.pricing-ac-menu-portal.q-panel .pac-none{ padding:8px; font-size:12px; color:var(--q-quiet)!important; }
.pricing-ac-menu-portal.q-panel .pac-none .pac-plus{ color:var(--q-add)!important; }
.pricing-ac-menu-portal.q-panel .pac-foot{ margin-top:6px; padding:6px 8px 2px!important; background:none!important; border-top:1px solid var(--q-rule)!important;
  font-size:10.5px!important; color:var(--q-faint)!important; }
.pricing-ac-menu-portal.q-panel .pac-foot kbd{ background:var(--q-row-hi)!important; color:var(--q-quiet)!important; font-family:var(--q-font)!important; }

/* [137500] 05 / 09 · UNDO BARS IN THE CARD (logic: pop.js qUndoBar / qRemoveWithUndo). The bar is
   design/popups.css .q-undo at the reference page's true size (zoom back out of the card's 1.285);
   a removed line stays in place struck through and faintly red until its timer runs out. */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-undo-row td{ padding:0 0 2.57px!important; border:none!important; background:none!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-undo{ }
html body.atiq-stage-v2 .quote-view .page-card .q-undo .q-btn{ height:22px!important; padding:0 10px!important; font:600 10.3px var(--q-font)!important;
  border:0!important; border-radius:var(--q-r-btn)!important; background:var(--q-total-fill)!important; color:var(--q-total-ink)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-struck td{ background:var(--q-danger-tint)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-struck td,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-struck td *{ color:var(--q-faint)!important; text-decoration:line-through; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-ghost{ pointer-events:none; }
@media print{ html body.atiq-stage-v2 .quote-view .page-card tr.q-ghost, html body.atiq-stage-v2 .quote-view .page-card tr.q-undo-row{ display:none!important; } }

/* [137500] 13 · THE LABOUR TOOL ROW AND THE COPY PANEL (logic: labOpenCopyMenu).
   The row is the design's .q-tools: Copy ▾ · Find similar … Reset to template, far right and
   quiet. Flex order sets that without moving the buttons in the DOM. The row sits in the card's
   zoom, so it is zoomed back to true px like every other strip. */
html body.atiq-stage-v2 .quote-view .lab-btnrow.q-tools{ display:flex!important; gap:8px!important; margin-top:10px!important; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .lab-copybtn{ order:1; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .lab-simbtn{ order:2; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .lab-resetbtn{ order:3; margin-left:auto; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .q-btn{ height:22px!important; padding:0 10px!important; font:600 10.3px var(--q-font)!important;
  border-radius:var(--q-r-btn)!important; border:1px solid var(--q-pill-bd)!important; background:transparent!important; color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .q-btn.is-ghost{ border-color:transparent!important; color:var(--q-quiet)!important; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .q-btn.is-add{ border-color:var(--q-add-bd)!important; background:var(--q-add-tint)!important; color:var(--q-add)!important; }
/* an undo bar under the Labour Total (Copy from stage) — a block, not a table row */
html body.atiq-stage-v2 .quote-view .page-card div.q-undo-row{ padding:0 0 5.14px; }
html body.atiq-stage-v2 .quote-view .lab-btnrow .q-btn:hover{ border-color:var(--q-rule-strong)!important; }
.lab-copy-menu.q-panel{ z-index:10040; width:420px; max-width:calc(100vw - 16px); max-height:min(70vh,560px); overflow:auto; }
.lab-copy-menu.q-panel .q-prow{ cursor:pointer; }
.lab-copy-menu.q-panel .q-prow.is-off{ cursor:default; }
.lab-copy-menu.q-panel .q-prow.is-off:hover{ background:none; }
.lab-copy-menu.q-panel .q-prow .hint{ font-size:11px; color:var(--q-faint); }
.lab-copy-menu.q-panel .q-prow:focus-visible{ outline:2px solid var(--q-measured); outline-offset:-2px; }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [137500]  14 · FIND SIMILAR ON THE PANEL FAMILY — design/popups.html 14 (logic: similar.js).
   The panel keeps its private colour set (--dark-2, --text, --accent… declared in quote-print.css
   because it lives on <body>), but every one of them now POINTS AT a design token, so dark and
   light come from tokens.css. The rules after that bring the pieces the design changed: no blue
   rule under the head, the measured-blue picked row, builder above the address, a plain Open and
   an orange Use, the difference as a quiet pill, and "Their total" in lime.
   `html body:is(.light.atiq-stage-v2, *)` out-ranks the older rules — including their body.light
   copies, which carry two classes on body — without editing them: :is() counts as its heaviest
   argument, and the `*` lets it match in dark mode too.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body:is(.light.atiq-stage-v2, *) .sim-panel{
  --dark-2:var(--q-surface); --dark-3:var(--q-row-hi); --border:var(--q-rule); --border-md:var(--q-surface-bd);
  --text:var(--q-text); --text-muted:var(--q-quiet); --text-dim:var(--q-faint);
  --accent:var(--q-measured); --warn:var(--q-warn); --danger:var(--q-danger); --success:var(--q-ok);
  background:var(--q-surface)!important; border:1px solid var(--q-surface-bd)!important; border-radius:var(--q-r-panel)!important;
  box-shadow:var(--q-shadow)!important; color:var(--q-text)!important; font-family:var(--q-font)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel *{ font-family:var(--q-font)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-hd{ background:none!important; border-bottom:1px solid var(--q-rule)!important; padding:14px 18px 10px!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-t{ font-family:var(--q-narrow)!important; font-size:var(--q-fs-caps)!important; font-weight:600!important;
  letter-spacing:var(--q-caps-ls)!important; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-x{ color:var(--q-quiet)!important; }

/* the list: % pill, the address (truncating), "Builder · Mon YYYY" under it */
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-li{ border-radius:8px!important; border:0!important; background:none!important; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-li:hover, html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-li.on{ background:var(--q-hover)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lpc{ padding:3px 7px!important; border-radius:var(--q-r-pill)!important; border:1px solid var(--q-pill-bd)!important;
  background:none!important; font-size:11px!important; font-weight:700!important; color:var(--q-sub)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-li.on .sim-lpc{ border-color:var(--q-measured)!important; background:var(--q-measured-tint)!important; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lnm b{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600!important; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lsub{ display:block; margin-top:2px; font-size:11px; font-weight:400; color:var(--q-quiet); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* the detail head: BUILDER name, then the address (wraps, never truncates), then the stage */
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt{ display:flex!important; flex-direction:column; gap:2px; min-width:0; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt i{ order:0; font-style:normal!important; font-size:12.5px!important; font-weight:600!important; color:var(--q-sub)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-ck{ margin-right:6px; font-family:var(--q-narrow)!important; font-size:var(--q-fs-caps)!important; font-weight:600!important;
  letter-spacing:var(--q-caps-ls)!important; text-transform:uppercase; color:var(--q-quiet)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt b{ order:1; font-size:16px!important; font-weight:700!important; color:var(--q-text)!important;
  white-space:normal!important; overflow:visible!important; text-overflow:clip!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt em{ order:2; display:flex; align-items:center; gap:8px; font-style:normal!important; font-size:12px!important; color:var(--q-sub)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt em .q-numpill{ width:18px; height:18px; font-size:10px; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dt em .bar{ width:1px; height:12px; background:var(--q-rule-strong); }
html body:is(.light.atiq-stage-v2, *) .sim-panel .q-btn.sim-btn{ height:28px!important; padding:0 14px!important; font:600 13px var(--q-font)!important; border-radius:8px!important;
  border:1px solid var(--q-pill-bd)!important; background:transparent!important; color:var(--q-text)!important; text-transform:none!important; letter-spacing:0!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .q-btn.sim-btn.is-add{ border-color:var(--q-add-bd)!important; background:var(--q-add-tint)!important; color:var(--q-add)!important; }

/* measured, compared: the difference as a quiet pill — bigger or smaller is not pass / fail */
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-fg th{ font-family:var(--q-narrow)!important; color:var(--q-quiet)!important; background:none!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-fg td{ color:var(--q-sub)!important; background:none!important; border-color:var(--q-rule)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-fg td.l{ color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-fg td.theirs .sim-fv{ font-weight:700; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-fu{ font-size:10px!important; color:var(--q-quiet)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-df, html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-df.up, html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-df.dn{
  background:var(--q-row-hi)!important; color:var(--q-sub)!important; border:0!important; border-radius:var(--q-r-pill)!important; font-weight:700!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-nil, html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-dz{ color:var(--q-ghost)!important; }

/* their labour: group headings soft orange, day lines "× n" with the day's note, lime total */
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lbh{ color:var(--q-quiet)!important; border-color:var(--q-rule)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lbh em{ color:var(--q-labour)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lb tr.g td{ color:var(--q-head)!important; font-family:var(--q-narrow)!important; border-color:var(--q-rule)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lb tr.g td.r{ color:var(--q-sub)!important; font-family:var(--q-font)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lb td{ color:var(--q-text)!important; border-color:transparent!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lb tr.d td{ color:var(--q-quiet)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lb tr.d .note{ margin-left:8px; font-style:italic; color:var(--q-quiet); }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lbtot{ border-top:1px solid var(--q-rule-strong)!important; background:none!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lbtot > span{ display:inline-flex; align-items:baseline; gap:14px; font-weight:700; color:var(--q-text)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-lbtot b{ color:var(--q-total)!important; }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-tstats{ display:inline-flex; gap:12px; padding-left:14px; border-left:1px solid var(--q-rule-strong);
  font-family:var(--q-narrow); font-size:var(--q-fs-capsxs); font-weight:600; letter-spacing:.6px; text-transform:uppercase; color:var(--q-quiet); }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-tstats b{ font-family:var(--q-font); font-size:11.6px; color:var(--q-text); }
html body:is(.light.atiq-stage-v2, *) .sim-panel .sim-tstats .md b{ color:var(--q-labour); }

/* [137500] 10 · WHAT IS IN THIS ITEM (logic: sv3ItemCheckHtml). design/popups.css .q-check at the
   reference page's true size, hanging off the item; while it shows, the item's own sub-rows step
   aside on screen (the check lists them, read). Paper is unchanged: no check, every row. */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.q-check-row td{ padding:0 0 5.14px!important; border:none!important; background:none!important; }
html body.atiq-stage-v2 .quote-view .page-card .q-check{ margin:6px 0 12px 31px; font-family:var(--q-font); color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .page-card .q-check .q-caps{ font-family:var(--q-narrow)!important; font-size:var(--q-fs-capsxs); font-weight:600; letter-spacing:1px; text-transform:uppercase; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view .page-card .q-check .q-caps.is-head{ color:var(--q-head); }
html body.atiq-stage-v2 .quote-view .page-card .q-check hr{ margin:14px 0 12px; }
@media screen{ html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tk-in-check{ display:none!important; } }


/* ════════════════════════════════════════════════════════════════════════════════════════════
   [138500]  THE SUMMARY PAGE, BACK TO THE DESIGN — James, 10 Nov, on design/summary.html:
     "padding at the top of the page different to design. Background colour different to design.
      card background colour different to design. Toggling between different group stages feels
      very fast and jarring … General padding throughout feels different to design. instead of each
      stage group being compacted individually, use … the same style button".
   Measured against design/summary.html at the same scale (scratchpad msum.js), not by eye.
   The card fill is in the [136500] block above (one gradient per group); this is the rest.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* THE SHEET is the stage page's sheet: --q-page with the --q-sheet-bd outline. It was --dark-2
   (#1e1e1e, quote-print.css .summary-page-card) — a different grey from the stage page next to it,
   which is the "background colour different". Light and print take the tokens' own values. */
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-card{ background:var(--q-page)!important; border-color:var(--q-sheet-bd)!important; }
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-page-body{ background:transparent!important; padding:0 29.9405px 39.835px!important; }

/* THE PADDING — design/base.css's numbers, converted where they land in card px. The sheet's
   padding is 30 / 30 / 40. (Written before 141000 in card px, 30 → 23.3 and 40 → 31; the scale
   flip multiplied them back out, which is why they read 29.94 / 39.84 — what has always rendered.) The STAGES
   heading sits 114px below the top of the header's figures in the design; the app's header block
   is 4px shorter inside, so its bottom padding is 52 where the design writes 48. Checked by
   _summary138500 against design/summary.html itself, not against these numbers. */
html body.atiq-stage-v2 .quote-view #spanel-summary .sum-hd{ padding:40px 30px 60px!important; }

/* ☰ — the take-off card's compact button, in the place the take-off card puts it: right after the
   heading, orange, and wearing the orange add-box edge while it is on (stage-v2 [137500] 12). */
html body.atiq-stage-v2 .quote-view .sv3-section .sum-compact-btn{ margin-left:0!important; color:var(--q-add)!important; }
html body.atiq-stage-v2 .quote-view .sv3-section .sum-compact-btn.on{
  border:1px solid var(--q-add)!important; border-radius:4.7px!important; background:var(--q-add-tint)!important; color:var(--q-add)!important; }

/* THE FILTER'S THUMB slides, with the stage pills' own curve and time (quote-frame.css .qv-thumb).
   Until it has been placed (.is-thumbed) the pressed button keeps its own fill — so if it never
   is, nothing is lost. */
html body.atiq-stage-v2 .quote-view .sv3-seg{ position:relative; }
html body.atiq-stage-v2 .quote-view .sv3-segthumb{ position:absolute; left:0; top:0; width:0; border-radius:var(--q-r-pill); background:var(--q-seg-on); pointer-events:none; opacity:0; }
html body.atiq-stage-v2 .quote-view .sv3-seg.is-thumbed .sv3-segthumb{ opacity:1; }
html body.atiq-stage-v2 .quote-view .sv3-segthumb.is-anim{ transition:transform .42s cubic-bezier(.34,1.36,.5,1), width .42s cubic-bezier(.34,1.36,.5,1); }
html body.atiq-stage-v2 .quote-view .sv3-segb{ position:relative; z-index:1; transition:color .2s; }
html body.atiq-stage-v2 .quote-view .sv3-seg.is-thumbed .sv3-segb[aria-pressed="true"]{ background:transparent; }
/* the header's figures change in place: a fade, not a slide — they are not moving anywhere */
html body.atiq-stage-v2 .quote-view .sum-fade-in{ animation:sumFadeIn .34s ease-out; }
@keyframes sumFadeIn{ from{ opacity:.15 } to{ opacity:1 } }
@media (prefers-reduced-motion:reduce){
  html body.atiq-stage-v2 .quote-view .sv3-segthumb.is-anim{ transition:none; }
  html body.atiq-stage-v2 .quote-view .sum-fade-in{ animation:none; }
}
@media print{ html body.atiq-stage-v2 .quote-view .sum-fade-in{ animation:none; } }


/* ════════════════════════════════════════════════════════════════════════════════════════════
   [139000]  THE BRAND BAR AND ITS GLOW — top of every stage page and summary page.
   The printed quote's colour bar (quote-v2.css .qd2-band) along the sheet's top edge, and its
   colours falling down the header as a faint glow — "the bar's light" — that drifts and breathes.
   James, 10 Nov: subtle and alive, not a mouse-follow (tried, rolled back); not on paper.

   .sv3-hlight is one layer pinned to the page card, BEHIND everything on it (the card isolates,
   the layer sits at z-index −1), clipped to the card's own rounded top — so it can never paint
   over the card's border, the bug the canvas mock had twice. The glow's strength is a token
   range: dark .04–.12, light half that, print 0.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view .page-card,
html body.atiq-stage-v2 .quote-view .summary-page-card{ position:relative; isolation:isolate; }
html body.atiq-stage-v2 .quote-view .sv3-hlight{ position:absolute; left:0; right:0; top:0; height:231.3px; z-index:-1; overflow:hidden;
  border-radius:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0; pointer-events:none; }
html body.atiq-stage-v2 .quote-view .sv3-bar,
html body.atiq-stage-v2 .quote-view .sv3-halo{ display:block; background:var(--q-brand); background-size:200% 100%; background-position:0 0;
  animation:sv3Drift 12s ease-in-out infinite alternate; }
html body.atiq-stage-v2 .quote-view .sv3-bar{ height:6.00095px; -webkit-print-color-adjust:exact; print-color-adjust:exact; }   /* 6px true */
html body.atiq-stage-v2 .quote-view .sv3-halo{ height:209.455px; opacity:var(--q-halo-lo);
  -webkit-mask-image:var(--q-halo-mask);
  mask-image:var(--q-halo-mask);
  animation:sv3Drift 12s ease-in-out infinite alternate, sv3Breathe 5s ease-in-out infinite alternate; }
@keyframes sv3Drift{ from{ background-position:0 0; } to{ background-position:100% 0; } }
@keyframes sv3Breathe{ from{ opacity:var(--q-halo-lo); } to{ opacity:var(--q-halo-hi); } }
/* the summary's continuation pages carry no header on screen, so no bar either: it is one sheet */
html body.atiq-stage-v2 .quote-view #spanel-summary.sum-multi .summary-page-card:not(.sum-probe) + .summary-page-card .sv3-hlight{ display:none; }
@media (prefers-reduced-motion: reduce){
  html body.atiq-stage-v2 .quote-view .sv3-bar,
  html body.atiq-stage-v2 .quote-view .sv3-halo{ animation:none; }
}
@media print{
  html body.atiq-stage-v2 .quote-view .sv3-bar{ animation:none; background-position:0 0; }
  html body.atiq-stage-v2 .quote-view .sv3-halo{ display:none; }
}
/* the stage header's room, as on the canvas: 34px under the bar, 60px down to TAKE-OFF */
html body.atiq-stage-v2 .quote-view .page-card .sv3-hd{ padding:40px 30px 40px; }   /* the card body adds its own 20 above TAKE-OFF */


/* ════════════════════════════════════════════════════════════════════════════════════════════
   [140000]  THE STAGE PAGE ON SCREEN, AT THE DESIGN'S SIZES — print untouched.

   Why this block exists. The stage page is one A4 sheet drawn twice, on screen and on paper, and
   the design (design/stage.html, every pop-up board) says what the SCREEN looks like: rows 13px,
   sub-rows 12.5px, figures 16px. Paper was settled long before and is pinned. Where the two
   differ, this block — @media screen only — says what the screen gets. Print never sees it.

   [141000] Since the scale flip every number in the cards is a screen number, so these are written
   exactly as the design states them (13px is 13px in the inspector). Until 141000 they read
   calc(13px / var(--cz)), dividing out the card's old ×1.285 magnification. _stage140000 holds
   both halves:
     • screen — each row, heading and figure against design/stage.html and design/popups.html
     • print  — every element of a printed stage against tests/fixtures/print-stage.json (140300,
                as rendered)
   If you change print on purpose, regenerate the fixture (tests/tools/printsnap.js --write).
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media screen{
html body.atiq-stage-v2 .quote-view .stage-panel .page-card{
  background:var(--q-page)!important; border-color:var(--q-sheet-bd)!important; }

/* ── the sheet: 30px margins, 28px between the columns, columns flush to them ─────────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .page-card-body{
  padding:8px 30px 40px!important; column-gap:28px!important;
  background:transparent!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-labour,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-right{ padding-left:0!important; padding-right:0!important; background:transparent!important; }

/* the take-off, material and labour cards: 10 / 14 / 14 inside (design --q-pad-card) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-card,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .panel-card{ padding-top:10px!important; }

/* ── group headings: 9.5px Narrow 600, second word grey — as every board ─────────────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-header-title .sec-type,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-header-title .sec-nm,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .mat-group-name,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .lab-group-title-editable{
  font-family:var(--q-narrow)!important; font-size:9.5px!important; font-weight:600!important;
  letter-spacing:1.3px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-header-title .sec-nm{ color:var(--q-sub)!important; }
/* the drag grip hangs in the card's margin, so the heading starts where the rows do (design: 4px in) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-card-header{ position:relative; padding-left:4px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .section-card-header > .sec-drag-grip{ position:absolute; left:-12px; top:50%; transform:translateY(-50%); }

/* ── take-off item row: 13px, name 600, dims 11, figure 16/800, unit 12/700, tag 9 ───────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row td{
  font-size:13px!important; padding-top:8px!important; padding-bottom:8px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row td:first-child{ padding-left:6px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .part-title-txt{ font-size:13px!important; font-weight:600!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .tk-brk{ font-size:11px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-measure-pill{ font-size:16px!important; font-weight:800!important; line-height:normal!important; }   /* normal, as the board's: a fixed 1.4 made the row 2–5px taller than the design, by how much depending on the machine's font */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row td.part-unit-cell{ font-size:12px!important; font-weight:700!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .tk-tag{ font-size:9px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-divide-btn{ font-size:12px!important;
  margin-top:-4px; margin-bottom:-4px; }   /* its 20px box overhangs the row's padding instead of setting the row: the board's ✓ is bare text, so the row is the figure's line */
/* sub-rows: 12.5px grey, indented 28, unit 11.5 */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row td{
  font-size:12.5px!important; padding-top:4px!important; padding-bottom:4px!important; line-height:1.25!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row td:first-child{ padding-left:28px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row td:nth-child(4){ font-size:11.5px!important; }

/* ── take-off columns: figure 52, unit 34, ✓ 24 (wide enough for its "per") — and the ✓ at the FAR RIGHT, as designed ───
   The colgroup (stagecard.js, "THE ONLY THING THAT SETS THESE COLUMN WIDTHS") orders the columns
   name | ✓ | figure | unit, and print keeps that order. A table cannot reorder its columns in
   CSS, so on screen the cells are slid instead: the ✓ right by figure+unit, figure and unit left
   by the ✓'s width (24: the board's ✓ is 16, but the same cell carries "per"). position:relative moves the cell's paint and its click target together, and
   moves nothing else — the row's layout is computed before the slide, so no width changes. */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl > colgroup > col:nth-child(2){ width:24px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl > colgroup > col:nth-child(3){ width:52px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl > colgroup > col:nth-child(4){ width:34px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-part-row > td:nth-child(2),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-item-row > td:nth-child(2){ position:relative; left:86px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-part-row > td:nth-child(3),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-part-row > td:nth-child(4),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-item-row > td:nth-child(3),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tr.tbl-item-row > td:nth-child(4){ position:relative; left:-24px; }

/* the "Sub items" rows (tr.tk-sub) are drawn on the design as sub-rows, not items: 12.5px grey, 28 in */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td{ font-size:12.5px!important; padding-top:4px!important; padding-bottom:4px!important; color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td:first-child{ padding-left:28px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .part-title-txt,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .tk-brk,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .sec-measure-pill{ font-size:12.5px!important; font-weight:400!important; color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td.part-unit-cell{ font-size:11.5px!important; font-weight:400!important; color:var(--q-quiet)!important; }

/* ── materials: name · qty 46 · unit 34 · rate 74 · amount 86; 13px, padding 7 / 14 ──────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities .tbl > colgroup > col:nth-child(1){ width:auto!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities .tbl > colgroup > col:nth-child(2){ width:46px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities .tbl > colgroup > col:nth-child(3){ width:34px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities .tbl > colgroup > col:nth-child(4){ width:74px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-quantities .tbl > colgroup > col:nth-child(5){ width:86px!important; }
/* labour: name · ×n 80 (the materials' qty + unit, so the figures line up) · rate 74 · amount 86 */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-labour .tbl > colgroup > col:nth-child(2){ width:80px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-labour .tbl > colgroup > col:nth-child(3){ width:74px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-labour .tbl > colgroup > col:nth-child(4){ width:86px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-row td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.lab-display-row td{
  font-size:13px!important; padding-top:7px!important; padding-bottom:7px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:first-child,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-row td:first-child,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.lab-display-row td:first-child{ padding-left:14px!important; color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:nth-child(4),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-row td:nth-child(3){ color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:last-child,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-row td:last-child{ font-weight:700!important; color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:last-child strong{ font-weight:700!important; }   /* was 900 inside the 700 cell */
/* the markup box: "15 %" is one 10.3px figure on the board, bold */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .markup-row .markup-label,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .markup-row .markup-value{ font-size:10.3px!important; font-weight:400!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .markup-input-wrap .markup-pct-input,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .markup-input-wrap .markup-pct-sign{ font-size:10.3px!important; font-weight:700!important; }
/* Labour Total's days / man-days: 11.6px 800 figures, 9.6px caps (base.css .q-cardtotal .stats) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sv3-labstats .sv3-stat b{ font-size:11.6px!important; font-weight:800!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sv3-labstats .sv3-caps{ font-size:9.6px!important; }
/* an inline edit field is the row's own text, as on the board (popups.css .q-field inherits it) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card input.q-field{ font-size:13px!important; }
/* … except the item's figure, which edits AT the figure's size (16 / 800), as the board's field
   does — it is the text it replaces. At 13px the row lost 1.8px the moment it opened. */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sec-measure-pill input.q-field{ font:inherit!important; line-height:inherit!important; }   /* the figure's own font and line, so the field's box is the figure's line on any machine (CI's fonts made it 1.7px shorter) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:nth-child(3){ font-size:12px!important; font-weight:400!important; color:var(--q-quiet)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-tname,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-fig,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-tot,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-xn{ font-size:13px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-tot{ font-weight:700!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-xn{ font-weight:400!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .markup-label{ font-weight:400!important; }
/* material + labour group headings: 12 above / 5 below on a rule, and 10 more between groups */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-right tr.lab-group-b3 > td{ padding-top:12px!important; padding-bottom:5px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-right tr.lab-group-b3:not(:first-child):not(.lab-group-first) > td{ padding-top:22px!important; }
/* a crew's day lines: 13px grey, indented 38, amount quiet */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-day td{
  font-size:13px!important; padding-top:5px!important; padding-bottom:5px!important; color:var(--q-sub)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-day td:first-child{ padding-left:38px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-day td:last-child{ font-weight:400!important; color:var(--q-quiet)!important; }

/* ── the ✓ view ("What's in this item"), as its board on design/popups.html ─────────────────
   Plain true px, as every size in the card is since 141000.
   popups.css says the same, but quote-print.css's scoped resets land later and win; restated here. */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check{ padding:4px 0 2px 16px!important; border-left:1px solid var(--q-rule-strong)!important; font-size:16px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-check-title .q-caps{ font-size:9px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-cmp .q-caps,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-sundry.is-head .q-caps{ font-size:8.5px; color:var(--q-faint); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-sundry{ padding:5px 0!important; font-size:12.5px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-sundry.is-head{ padding:0 0 3px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-check-title{ padding-bottom:6px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check .q-cmp{ padding-top:2px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .q-check hr{ margin:14px 0 12px!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [142000]  THE APPROVED CANVAS BOARDS OF 10 NOV, ON SCREEN — design/base.css "[142000]".

   Every size here is the size you see (one scale since 141000). @media screen only, like the
   [140000] block above: paper is its own approved design and stays pinned. The one exception is
   what SHOWS — collapsed or expanded — which paper now follows (James: print what's on screen),
   and that lives in the [142000] PRINT block after this one.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media screen{
/* ── light mode takes its look from print: the sheet is white, the page round it stays grey ── */
html body.light.atiq-stage-v2 .quote-view .stage-panel .page-card,
html body.light.atiq-stage-v2 .quote-view #spanel-summary .summary-page-card{ background:var(--q-sheet)!important; }
/* the site address and builder brighter (both pages' headers) */
html body.atiq-stage-v2 .quote-view .page-card .sv3-who .sv3-addr{ color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .page-card .sv3-who .sv3-builder,
html body.atiq-stage-v2 .quote-view .page-card .sv3-who .sv3-builder b{ color:var(--q-sub)!important; }

/* ── spacing: a section title to its card 22 (was 10); the material + labour headings ──────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown-title,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-section-title{ margin-bottom:20.715px!important; }   /* + its 1.285 padding = 22 */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-right tr.lab-group-b3 > td{ padding-top:4px!important; }   /* the first: 14 from the card top (10 + 4) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-right tr.lab-group-b3:not(:first-child):not(.lab-group-first) > td{ padding-top:12px!important; }   /* the rest: 22 → 12 */

/* ── the item line on two rows (option A4): name 12 · sizes 10 grey · figure 14 · unit 11 ──── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted td{
  font-size:12px!important; padding-top:7px!important; padding-bottom:7px!important; vertical-align:middle; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .part-row-inner{ align-items:flex-start!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .tk-tag{ margin-top:1px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .part-title-txt{
  display:flex!important; flex-direction:column; justify-content:center; gap:2px; white-space:normal!important; overflow:visible!important;
  line-height:1.25!important; font-size:12px!important; font-weight:600!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .tk-dims{
  display:block; font-size:10px; font-weight:400; line-height:1.3; color:var(--q-quiet); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .tk-dims .tk-brk{ font-size:10px!important; font-weight:400!important; color:inherit!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .sec-measure-pill{ font-size:14px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted td.part-unit-cell{ font-size:11px!important; }
/* room after an item's last sub-row before the next item, so each item reads as a block */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row:has(+ tr.tbl-part-row.tk-counted) > td{ padding-bottom:12px!important; }

/* ── sub-rows, and the Sub items rows: 11px ──────────────────────────────────────────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-item-row td:nth-child(4),
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .part-title-txt,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .tk-brk,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .sec-measure-pill,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td.part-unit-cell{ font-size:11px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub td{ vertical-align:middle; }

/* ── material + labour lines 11px, 5px top and bottom; a crew's day lines 4 ──────────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-row td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.lab-display-row td{ font-size:11px!important; padding-top:5px!important; padding-bottom:5px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row td:nth-child(3){ font-size:11px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.l2-day td{ font-size:11px!important; padding-top:4px!important; padding-bottom:4px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-tname,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-fig,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-tot,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .l2-xn,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card input.q-field{ font-size:11px!important; }

/* ── the changed-by-hand dot hangs in the margin, level with the group heading's left edge ── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row > td:first-child{ position:relative; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.mat-auto-row > td:first-child > .value-modified-icon{
  position:absolute!important; left:4px; top:50%; margin:0!important; transform:translateY(-50%); }

/* ── the check chip: one 20px chip, three faces (design/base.css .ic-b) ────────────────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-divide-btn.ic-b{
  display:inline-flex!important; align-items:center; justify-content:center; width:20px!important; height:20px!important; padding:0!important;
  border-radius:6px!important; border:1px solid var(--q-rule-strong)!important; background:transparent!important;
  font:700 11px/1 var(--q-font)!important; color:var(--q-quiet)!important; letter-spacing:0!important; cursor:pointer; margin:-4px 0!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-divide-btn.ic-b.is-ok{ color:var(--q-ok)!important; border-color:var(--q-ok-bd)!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-divide-btn.ic-b.is-bad{
  color:var(--q-warn)!important; border-color:var(--q-warn-bd)!important; background:var(--q-warn-tint)!important; font-size:12px!important; font-weight:900!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .sec-divide-btn.ic-b.on{ background:var(--q-row-hi)!important; box-shadow:inset 0 0 0 1px currentColor; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-sub .sec-divide-btn.ic-b{ width:18px!important; height:18px!important; }

/* ── the plan-tag button: James's icon, 23 × 12, grey until tagged, pink once it is ────────── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sec-plan-eye{ width:23px!important; height:12px!important; color:var(--q-quiet); overflow:visible; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sec-plan-eye svg{ width:100%!important; height:100%!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sec-plan-eye.tagged,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .sec-plan-eye:hover{ color:var(--q-tagged)!important; }

/* ── "What's in this item" (design/popups.css .ic-panel): Concrete, then Steel & sundries ──── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-panel{ margin:12px 0 22px 28px; padding:0 0 0 14px; border-left:1px solid var(--q-rule-strong); text-align:left; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-ph{ display:flex; align-items:baseline; gap:10px; padding-bottom:8px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-ph .q-caps{ font-family:var(--q-narrow); font-size:9px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--q-faint); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-ph .q-caps.is-head{ color:var(--q-add); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp{ display:flex; gap:26px; padding:2px 0 0; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp > span{ display:inline-flex; flex-direction:column; gap:2px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp .q-caps,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid.is-head .q-caps{ font-family:var(--q-narrow); font-size:9px; font-weight:600; letter-spacing:1px; text-transform:uppercase; color:var(--q-faint); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b{ font-size:12px; font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b.says{ font-weight:500; color:var(--q-sub); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b.says.is-dash{ color:var(--q-faint); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b.is-ok{ color:var(--q-ok); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b.is-warn{ color:var(--q-warn); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-split{ height:1px; background:var(--q-rule); margin:12px 0 10px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid{ display:grid; grid-template-columns:112px 60px 72px 1fr; column-gap:12px; align-items:baseline;
  padding:6px 0; font-size:11px; color:var(--q-sub); font-variant-numeric:tabular-nums; border-top:1px solid var(--q-rule); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid.is-head{ padding:0 0 5px; border-top:0; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid b{ font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid .sz{ color:var(--q-text); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid .sp{ color:var(--q-quiet); white-space:nowrap; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-panel > .ic-grid:last-child{ padding-bottom:0; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.q-check-row > td{ padding:0!important; border:0!important; background:transparent!important; }

/* ── COLLAPSED, the default ──────────────────────────────────────────────────────────────────
   every item and every sub-item stays, each with its chip; only an item's own lines fold away.
   (quote-print.css's takeoff-compact hid the check row too; a check you open must show.) */
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tk-subdiv:not(.sv3-out){ display:table-row!important; }
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tbl-part-row.tk-sub:not(.sv3-out){ display:table-row!important; }
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.sec-check-row:not(.sv3-out){ display:table-row!important; }
/* a line you are editing, or have just added, is never hidden because the card is collapsed */
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tbl-item-row.row-editing,
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tbl-item-row.item-added,
html body.atiq-stage-v2 .quote-view .takeoff-compact tr.q-editstrip-row{ display:table-row!important; }
html body.atiq-stage-v2 .quote-view .takeoff-compact .group-add-row-btn{ display:inline-flex!important; }
}

/* ── grow-out: an opened check, a ☰ expanding — the same motion as switching stages ────────
   (cubic-bezier(.2,.8,.2,1), 340ms: qv-enter-r / -l and the filter's slide). Done in JS with the
   Web Animations API on the rows' height (sv3Grow), because a table row cannot animate its own
   height in CSS. Nothing animates for anyone who has asked for reduced motion. */
/* [145000] the CSS fade that played here is gone: sv3GrowOne (stagecard.js) grows the row itself
   now, contents fading with it, so the rows below are pushed down instead of jumping. */

/* ── [142000] PRINT: the card on paper is the card on screen — collapsed or expanded. ────────
   The item's two-line wrapper is display:contents on paper, so the printed line is the same text
   in the same flow as before (tests/fixtures/print-stage.json is untouched by it). */
@media print{
  html body.atiq-stage-v2 .quote-view .tk-dims{ display:contents!important; }
  html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tk-subdiv,
  html body.atiq-stage-v2 .quote-view .takeoff-compact tr.tbl-part-row.tk-sub{ display:table-row!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [142000]  THE SUMMARY — design/summary.html, as approved 10 Nov (logic: renderSummary, stages.js)
     HOUSE  2 stages ……………………………………………… 8 DAYS  21 MAN-DAYS        $40,451.52
     ① Footings ………………… SLAB 42 m²  BEAMS 101 m  PIERS —  CONC 20.4 m³    $19,363.36
        ┌ SF1 Strip Footing     (300W x 400D) [450W x 450D] ……………………… 53 m ┐   D2
   Screen and paper alike (paper in print's colours, via the tokens). Sizes as you see them.
   Four sizes in the card, each with one job: 15 the stage line and money · 12 figures and rows ·
   11 secondary text · 9 small caps.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-section{ margin-bottom:18px; }   /* STAGES to the first group: 10 → 18 */
/* the group header: option B */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-ghead{ gap:14px!important; padding-top:18px!important; padding-left:22px!important; padding-right:22px!important;
  padding-bottom:12px!important; box-shadow:inset 0 -1px 0 var(--q-rule-strong)!important; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gname{ font-size:13px!important; letter-spacing:1.6px!important; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gcount{ position:relative; top:-1.5px; font-size:11px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gmeas{ display:flex; flex:1; justify-content:flex-end; margin-right:26px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats{ display:inline-flex; align-items:baseline; gap:16px; padding-left:0; border-left:0; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats .sv3-stat{ display:inline-flex; align-items:baseline; gap:5px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats b{ font-size:12px; font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats .sv3-md b{ color:var(--q-labour); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats .sv3-caps{ font-size:9px; letter-spacing:.8px; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-ghead .sv3-gval{ flex:none; width:112px; text-align:right; font-size:15px; font-weight:800; color:var(--q-total); font-variant-numeric:tabular-nums; white-space:nowrap; }
/* the last stage of a group closes the card now (the total line is gone) */
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-stage-row.sv3-card-last{ padding-bottom:14px!important; }   /* the card's own 14 at its foot (design .q-sgroup) */
/* a stage line: the measures on the right, four 78px columns 10 apart, then the total */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-meas{ justify-content:flex-end; gap:10px; margin-right:26px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m.slab,
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m.beams,
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m.piers,
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m.conc{ width:78px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-num,
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m b{ font-size:12px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m .sv3-u{ font-size:11px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m .sv3-caps{ font-size:9px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-sname,
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-stot{ font-size:15px; }
/* the take-off under a stage: option D2, an inset band holding a small table with no headings */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-hang.sv3-tktbl{ margin:0 6px 10px 46px; padding:2px 12px; border:0; border-radius:8px; background:var(--q-tk-band); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow{ display:grid; grid-template-columns:200px 1fr 90px; gap:12px; align-items:baseline; padding:5px 0;
  border-top:1px solid var(--q-rule); font-size:11px; color:var(--q-sub); font-variant-numeric:tabular-nums; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow:first-child{ border-top:0; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-hname{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--q-sub); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-code{ font-weight:700; color:var(--q-text); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-dims{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:10px; color:var(--q-quiet); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-r{ text-align:right; white-space:nowrap; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-r b{ font-weight:700; color:var(--q-measured); }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-tkrow .sv3-hu{ font-size:10px; color:var(--q-row-label); }
/* collapsed (the default): stage lines only — on screen AND paper, and the pages are packed for it */
html body.atiq-stage-v2 .quote-view #spanel-summary.sum-compact .summary-page-card .sv3-hang{ display:none!important; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m{ gap:4px; }
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-m .sv3-u{ margin-left:0; }
/* the header's days / man-days read figure first (8 DAYS 21 MAN-DAYS), as option B — the page
   header's readouts lead with the label (.sv3-stat .sv3-caps order:-1); this one does not */
html body.atiq-stage-v2 .quote-view #spanel-summary .sv3-gstats .sv3-stat .sv3-caps{ order:0; }
/* the group's last stage closes its card: the rule, the corners and the gap below it, which the
   total line drew until 142000 */
html body.atiq-stage-v2 .quote-view #spanel-summary .summary-stage-row.sv3-srow.sv3-card-last{
  border-bottom:1px solid var(--q-card-bd)!important; border-bottom-left-radius:16px; border-bottom-right-radius:16px; margin-bottom:14px!important; }
@media print{ html body.atiq-stage-v2 .quote-view #spanel-summary .summary-stage-row.sv3-srow.sv3-card-last{ border-bottom-color:var(--q-rule-strong)!important; } }

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [142000]  EDIT AND DELETE, ONE STYLE EVERYWHERE — board 17 ("Edit a material line · as built"),
   James: "this style is echoed over all other sections with similar functionalities".
     · the quick × — a solid red 20px button over the END of the line (its total), shown while you
       hover the line; nothing moves. Material lines, take-off lines, labour tasks.
     · a struck line — faded and struck through, keeping its place and its total; Restore sits over
       the total while you hover it, so the rest of the time you can read the total.
     · neither ever prints (.no-print).
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media screen{
html body.atiq-stage-v2 .quote-view .page-card tr.mat-auto-row > td:last-child,
html body.atiq-stage-v2 .quote-view .page-card tr.lab-display-row.man-disp > td:last-child,
html body.atiq-stage-v2 .quote-view .page-card tr.tbl-item-row > td.item-div-cell{ position:relative; }
html body.atiq-stage-v2 .quote-view .page-card .q-qdel,
html body.atiq-labour-v2.atiq-stage-v2 .quote-view .page-card .l2-del{
  position:absolute!important; right:2px!important; top:50%!important; transform:translateY(-50%)!important; z-index:2;
  display:none!important; align-items:center; justify-content:center; width:20px!important; height:20px!important; padding:0!important;
  border:1px solid var(--q-danger)!important; border-radius:6px!important; background:var(--q-danger)!important; color:var(--q-on-danger)!important;
  font:700 13px/1 var(--q-font)!important; cursor:pointer; opacity:1!important; pointer-events:auto!important; }
html body.atiq-stage-v2 .quote-view .page-card tr:hover > td > .q-qdel,
html body.atiq-labour-v2.atiq-stage-v2 .quote-view .page-card tr.l2-row:hover .l2-del{ display:inline-flex!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.row-clickable:hover > td{ background:var(--q-row-hi); }
/* the take-off line's × sits at the line's right edge: its cell is slid there (see [140000]) */
html body.atiq-stage-v2 .quote-view .page-card td.item-div-cell > .q-qdel,
html body.atiq-stage-v2 .quote-view .page-card td.item-div-cell > .q-restore{ right:0!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .lab-qty-val{ font-size:11px!important; }
/* a struck line */
/* faded by COLOUR, not opacity: opacity on a cell would fade the Restore inside it too. The button is
   out of flow, so the cell's line-through does not reach it either. */
html body.atiq-stage-v2 .quote-view .page-card tr.deleted > td{ opacity:1!important; text-decoration:line-through!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.deleted > td,
html body.atiq-stage-v2 .quote-view .page-card tr.deleted > td *:not(.q-restore){ color:var(--q-ghost)!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-auto-row.deleted > td:last-child > strong + span{ display:none; }
html body.atiq-stage-v2 .quote-view .page-card .q-restore{
  position:absolute; right:2px; top:50%; transform:translateY(-50%); z-index:2; display:none; align-items:center;
  height:20px; padding:0 9px; border-radius:var(--q-r-pill); border:1px solid var(--q-rule-strong);
  background:var(--q-surface); color:var(--q-text); font:600 10.5px/1 var(--q-font); white-space:nowrap; cursor:pointer; }
html body.atiq-stage-v2 .quote-view .page-card tr.deleted:hover .q-restore{ display:inline-flex; }
/* the edit strip's Delete: the same red ring as the quick × (board 17) */
html body.atiq-stage-v2 .quote-view .page-card .q-editstrip .q-btn.is-danger{ color:var(--q-danger)!important; border:1px solid var(--q-danger-bd)!important; background:var(--q-danger-tint)!important; }
}
@media print{ html body.atiq-stage-v2 .quote-view tr.mat-auto-row.deleted > td:last-child > strong{ display:none; } }
/* [142000] an item open for editing, on its two lines (board 11): the name field at the name's size,
   the sizes field under it at the sizes' size and colour, the figure field at the figure's */
@media screen{
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.tbl-part-row.group-editing .part-title-txt{ gap:4px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.tbl-part-row.group-editing input.group-name-input{ font-size:12px!important; font-weight:600!important; width:100%; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.tbl-part-row.group-editing input.group-dims-input{ font-size:10px!important; font-weight:400!important; color:var(--q-quiet)!important; }
}

/* [142000] fixed line heights and fixed-width figure columns in the panel, as design/popups.css — so it
   lays out the same on any machine's fonts (failed on CI's runner by 4–8px) */
@media screen{
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-ph{ line-height:12px; } html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp .q-caps{ line-height:12px; } html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp b{ line-height:16px; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-cmp > span{ min-width:64px; } html body.atiq-stage-v2 .quote-view .stage-panel .page-card .ic-grid{ line-height:14px; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [145000]  THE 11 NOV CANVAS ROUND — take-off rows A (canvas 26), the open / compact toggle B
   (27), unused labour lines (stage page), crossed-out lines and the green dot (28–30, 04).
   Screen only where it says so; everything else reaches paper on purpose.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media screen{
/* ── 26 · the item band: a soft 8px strip, no rule along its top, 6px wider than the text on each
   side (James, 11 Nov: "a touch wider … but i don't want the whole card to grow"). The extra 6px is
   drawn by an outside shadow in the band's own colour, which paints only OUTSIDE the cell — so the
   band reaches into the card's 14px padding while no cell, figure or column moves at all. The ✓
   cell is slid to the far right on screen (the [140000] block), so it carries the right end. */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-counted > td{ border-top-color:transparent!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-counted > td:first-child{
  border-radius:8px 0 0 8px; box-shadow:-6px 0 0 0 var(--q-row-hi); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-counted > td.part-div-cell{
  border-radius:0 8px 8px 0; box-shadow:6px 0 0 0 var(--q-row-hi); }
/* the type pill sits just left of the measure, so every name starts on one edge */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row .part-row-inner > .part-title-txt{ flex:1 1 auto!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row .part-row-inner > .tk-tag{
  order:2!important; margin:0 0 0 8px!important; align-self:center!important; position:relative; }
/* sub-lines 18px in (28 before), and 14px of air after an item's last line */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-item-row > td:first-child,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-sub > td:first-child{ padding-left:18px!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-item-row:has(+ tr.tbl-part-row.tk-counted) > td,
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.sec-check-row:has(+ tr.tbl-part-row.tk-counted) > td{ padding-bottom:14px!important; }

/* ── 29 · a changed item's mark: the green dot, centred in the gap left of the type pill, out of
   flow. It is the measure's undo (it replaced the word "reset"). Without a pill it sits at the end. */
html body.atiq-stage-v2 .quote-view .page-card .tk-meas-dot{
  position:absolute; left:-6.5px; top:50%; width:5px; height:5px; margin:-2.5px 0 0 -2.5px; padding:0; border:0; border-radius:50%;
  background:var(--q-edited); cursor:pointer; font-size:0; }
html body.atiq-stage-v2 .quote-view .page-card .tk-meas-dot::after{ content:''; position:absolute; inset:-6px; }   /* a finger-sized target */
html body.atiq-stage-v2 .quote-view .page-card .part-row-inner{ position:relative; }
html body.atiq-stage-v2 .quote-view .page-card .tk-meas-dot.no-tag{ left:auto; right:0; }
html body.atiq-stage-v2 .quote-view .page-card .part-row-inner .sec-measure-reset{ display:none!important; }

/* ── 27 · open / compact: unfold more (compacted — pressing opens it) or unfold less (open —
   pressing compacts it). The same orange box as the + beside it, and its hover — the box fills
   a little more orange and its edge goes solid. Nothing on these buttons is ever blue. ── */
html body.atiq-stage-v2 .quote-view .tk-compact-btn:not(#_),
html body.atiq-stage-v2 .quote-view .lab-compact-btn:not(#_),
html body.atiq-stage-v2 .quote-view .sv3-section .sum-compact-btn:not(#_),
html body.atiq-stage-v2 .quote-view .tk-compact-btn.on:not(#_),
html body.atiq-stage-v2 .quote-view .lab-compact-btn.on:not(#_),
html body.atiq-stage-v2 .quote-view .sv3-section .sum-compact-btn.on:not(#_),
html body.light.atiq-stage-v2 .quote-view .tk-compact-btn.on:not(#_),
html body.light.atiq-stage-v2 .quote-view .lab-compact-btn.on:not(#_){
  border:1px solid var(--q-add-bd)!important; background:var(--q-add-tint)!important; color:var(--q-add)!important;
  border-radius:6px!important; box-shadow:none!important; transition:background .15s, border-color .15s; }
html body.atiq-stage-v2 .quote-view .tk-compact-btn:not(#_):hover,
html body.atiq-stage-v2 .quote-view .lab-compact-btn:not(#_):hover,
html body.atiq-stage-v2 .quote-view .sv3-section .sum-compact-btn:not(#_):hover,
html body.atiq-stage-v2 .quote-view .hdr-addbtn:not(#_):hover,
html body.atiq-stage-v2 .quote-view .q-addbox:not(#_):hover{
  border-color:var(--q-add)!important; background:color-mix(in srgb, var(--q-add) 16%, transparent)!important; color:var(--q-add)!important; }
html body.atiq-stage-v2 .quote-view .tk-compact-btn:not(#_) i, html body.atiq-stage-v2 .quote-view .lab-compact-btn:not(#_) i,
html body.atiq-stage-v2 .quote-view .tk-compact-btn.on:not(#_) i, html body.atiq-stage-v2 .quote-view .lab-compact-btn.on:not(#_) i,
html body.atiq-stage-v2 .quote-view .hdr-addbtn:not(#_):hover i, html body.atiq-stage-v2 .quote-view .hdr-addbtn.on:not(#_) i{ color:var(--q-add)!important; }
html body.atiq-stage-v2 .quote-view .tk-compact-btn:not(#_) svg,
html body.atiq-stage-v2 .quote-view .lab-compact-btn:not(#_) svg,
html body.atiq-stage-v2 .quote-view .sum-compact-btn:not(#_) svg{ width:13px!important; height:13px!important; display:block; }
}

/* ── stage page · an UNUSED labour line (quantity 0, seen only with the card open): the whole row
   ghost grey — name, 0, rate and dash alike — and the dash not bold (James, 11 Nov). A heading
   whose every line is unused goes ghost with them. Compact still hides them all. ── */
html body.atiq-stage-v2 .quote-view .page-card tr.lab-display-row.lab-zero:not(#_) > td,
html body.atiq-stage-v2 .quote-view .page-card tr.lab-display-row.lab-zero:not(#_) > td *:not(.q-qdel):not(.lab-day-btn),
html body.atiq-stage-v2 .quote-view .page-card tr.lab-group-b3.lab-zero-grp:not(#_) > td,
html body.atiq-stage-v2 .quote-view .page-card tr.lab-group-b3.lab-zero-grp:not(#_) > td *:not(.q-addbox):not(.hdr-addbtn){ color:var(--q-ghost)!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.lab-display-row.lab-zero:not(#_) > td,
html body.atiq-stage-v2 .quote-view .page-card tr.lab-display-row.lab-zero:not(#_) > td *{ font-weight:400!important; }

/* ── 04, 28–30 · A CROSSED-OUT LINE: each part at 40% of its OWN colour, struck through — the name
   stays the name's colour, the figure stays blue, the total stays bold, all faded the same
   (canvas: `.is-deleted > span{ opacity:.4 }`). Until 145000 the app painted every part one flat
   ghost grey, and design/popups.css said the same, so building to the repo's own reference could
   never have caught it (James, 11 Nov: "its been missed before"). color-mix gives the same colour
   opacity .4 would, without fading the Restore pill that sits inside the cell — which is why
   opacity itself is not used. `:not(#_)` lifts these over every class-only rule on the card (it adds
   an id's weight and matches everything): a crossed-out line must win whatever styles the live one.
   _strike145000 compares every part against a live line, both themes. ── */
/* Screen only: paper is pinned (tests/fixtures/print-stage.json) and keeps the struck lines it always
   printed — the design for these is a screen design (James, 10 Nov: print stays as it was). */
@media screen{
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody :is(tr.deleted, tr.tk-matoff):not(#_) > td,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody :is(tr.deleted, tr.tk-matoff):not(#_) > td *:not(.q-restore){ color:var(--q-strike-c, inherit)!important; }
/* a live material's figure is the line's text colour, as on every board (it was the old app --text, a
   shade off — and a struck figure is measured against the live one, so the two must agree) */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.mat-auto-row > td:nth-child(2){ color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row.deleted > td:nth-child(1),
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row.deleted > td:nth-child(2),
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row.deleted > td:nth-child(5){ --q-strike-c:color-mix(in srgb, var(--q-text) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row.deleted > td:nth-child(3){ --q-strike-c:color-mix(in srgb, var(--q-quiet) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.mat-auto-row.deleted > td:nth-child(4){ --q-strike-c:color-mix(in srgb, var(--q-sub) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-matoff > td,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.deleted > td{ --q-strike-c:color-mix(in srgb, var(--q-sub) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-matoff > td:nth-child(4),
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.deleted > td:nth-child(4){ --q-strike-c:color-mix(in srgb, var(--q-quiet) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted > td{ --q-strike-c:color-mix(in srgb, var(--q-text) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted .tk-brk,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted > td.part-unit-cell{ --q-strike-c:color-mix(in srgb, var(--q-quiet) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted .sec-measure-pill{ --q-strike-c:color-mix(in srgb, var(--q-measured) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted .tk-tag{ --q-strike-c:color-mix(in srgb, var(--q-tag) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted:not(#_) .tk-tag{
  border-color:color-mix(in srgb, var(--q-tag-bd) 40%, transparent)!important; text-decoration:none!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted:not(#_) > td{ background:color-mix(in srgb, var(--q-row-hi) 40%, transparent)!important; }
@media screen{
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-counted.deleted:not(#_) > td:first-child{ box-shadow:-6px 0 0 0 color-mix(in srgb, var(--q-row-hi) 40%, transparent); }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .col-breakdown .tbl tbody tr.tbl-part-row.tk-counted.deleted:not(#_) > td.part-div-cell{ box-shadow:6px 0 0 0 color-mix(in srgb, var(--q-row-hi) 40%, transparent); }
}
/* a take-off line whose material is crossed out: struck like a deleted line (canvas 30) */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-item-row.tk-matoff:not(#_) > td{ text-decoration:line-through!important; }
/* only the words are struck on an item: its name (with the sizes) and its figure — the pill, the ✓
   and the dot are not words. text-decoration on the cell reaches every flex item inside it, so the
   cells of an item row carry none and the two pieces of text carry it themselves. */
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted:not(#_) > td{ text-decoration:none!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted:not(#_) .part-title-txt,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.tbl-part-row.deleted:not(#_) .sec-measure-pill{ text-decoration:line-through!important; }
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.deleted:not(#_) .tk-tag,
html body.atiq-stage-v2 .quote-view .page-card .tbl tbody tr.deleted:not(#_) .value-modified-icon{ text-decoration:none!important; }
}

/* ── 28–30 · the green dot on a material: a take-off line feeding it was deleted (or its amount
   was changed by hand). The dot was orange in the app and lime on every board — one colour now,
   the design's "changed by hand" lime, on every changed-by-hand dot on the card. ── */
body.atiq-stage-v2 .quote-view{ --v2-edit:var(--q-edited); }
body.light.atiq-stage-v2 .quote-view{ --v2-edit:var(--q-edited); }
html body.atiq-stage-v2 .quote-view .page-card .value-modified-icon.mat-inherit-del{ cursor:default!important; }

/* ── 02 · add a material (canvas 02 ② ③) — a line you added: the hollow ring in the margin; while
   adding, the total and rate stay grey until there is something in them ── */
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.tbl-manual-row > td:first-child{ position:relative; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card tr.tbl-manual-row > td:first-child > .value-modified-icon{
  position:absolute!important; left:4px; top:50%; margin:0!important; transform:translateY(-50%); }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-add-row .mat-add-tot{ color:var(--q-text)!important; }
html body.atiq-stage-v2 .quote-view .page-card tr.mat-add-row .mat-add-tot.is-zero,
html body.atiq-stage-v2 .quote-view .page-card tr.mat-add-row input.mat-add-rate.is-zero{ color:var(--q-faint)!important; }
html body.atiq-stage-v2 .quote-view .page-card .value-modified-icon.mat-inherit-measure{ cursor:default!important; }
@media screen{
/* [145000] a deleted item's Restore sits over the end of the band, as a line's does */
html body.atiq-stage-v2 .quote-view .page-card td.part-div-cell > .q-restore{ right:0!important; }
/* a take-off line struck because its MATERIAL is crossed out has nothing to delete or restore here */
html body.atiq-stage-v2 .quote-view .page-card tr.tk-matoff > td > .q-qdel,
html body.atiq-stage-v2 .quote-view .page-card tr.tk-matoff:hover > td > .q-qdel{ display:none!important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [146000]  THE TAKE-OFF ITEM ROW — canvas Pop-ups 31, its point of truth. A name is ONE line, its
   sizes inline after it, cut with … (hover: the quiet pop-out, stagecard.js). Until 146000 the name
   was a flex COLUMN, so every bracketed piece and every bit of text between them got a line of its
   own — "RW1 / (3.0m) / - Retaining Footing / (…) […]" — four lines for one name. Screen only:
   paper prints the whole name as it always has.
   ════════════════════════════════════════════════════════════════════════════════════════════ */
@media screen{
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .part-title-txt:not(#_){
  display:block!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; min-width:0; flex:1 1 auto; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row .part-title-txt .tk-dims:not(#_){
  display:inline!important; margin-left:4px; white-space:nowrap!important; overflow:visible!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted .part-row-inner:not(#_){ align-items:center!important; }
html body.atiq-stage-v2 .quote-view .stage-panel .page-card .tbl tbody tr.tbl-part-row.tk-counted > td:not(#_){ vertical-align:middle; }
}