/* Jobs queue module (Pending / Progress / Recurring + the Offer times dialog).
   Source: owner-approved design B mockups (psm-jobs-queue-study/mockups/queue.css + screens.css + b-rail.html),
   re-scoped under .jq (module root) and .jq-dlgwrap / .jq-dlg (dialogs appended to document.body).
   Values come only from --ds-* tokens (design-tokens.css). Every selector is scoped; no bare element rules,
   nothing touches html, body or non-jq classes.

   Raw colour literals (the only ones):
     - Status is a Simpro-colour dot (.jq-dot) set inline by JS; the name uses --ds-ink.
     - The status glyph masks (.jq-gl.* / .jq-pill.*) are SVG data URIs. They hold %23000 (an encoded black) only
       as mask geometry; mask colour is never rendered (the glyph is painted by background: var(--ds-st-*)).

   Phone breakpoint: max-width 759px (the mockup's). Tablet column drop: 760-1400px (recurring grids).
   Sizing literals kept from the mockup where no token exists: grid column widths, 64px id column, 34px board row,
   9/10/12px swatch+glyph geometry, 2-4px micro paddings. Phone touch targets use --ds-touch-h (48px; the mockup used 44px).

   Class names in the three JS files that are intentionally NOT styled (hooks only, or no visual of their own):
     jq (root; only sets type), jq-offer, jq-offer-recipients (id / data hook), jq-rcb / jq-rall (data hooks),
     jq-group, jq-jump, jq-create, jq-more, jq-view, jq-save, jq-saved, jq-sort, jq-del, jq-col, jq-cols,
     jq-cols-reset, jq-act, jq-id, jq-ust, jq-rclear, jq-rcreate, jq-rsub, jq-ug, jq-rrow, jq-rall, jq-rcb
     (all data-jq-* attribute names or ids, never class names). The root modifier is the plain class "progress". */

/* ── Base: type + reset, scoped to the module and the dialogs ── */
:is(.jq, .jq-dlgwrap) { font-family: var(--ds-font); font-feature-settings: var(--ds-features); font-size: var(--ds-text-base); line-height: var(--ds-lh-base); font-weight: var(--ds-w-regular); letter-spacing: var(--ds-track-base); font-variant-numeric: var(--ds-nums); color: var(--ds-ink); }
:is(.jq, .jq-dlgwrap) *, :is(.jq, .jq-dlgwrap) *::before, :is(.jq, .jq-dlgwrap) *::after { box-sizing: border-box; }
:is(.jq, .jq-dlgwrap) :is(h1, h2, h3, p, dl, dd, fieldset) { margin: 0; }
:is(.jq, .jq-dlgwrap) fieldset { border: 0; padding: 0; min-width: 0; }

/* Icons: 16x16 viewBox line family, 1.5px stroke */
:is(.jq, .jq-dlgwrap) .jq-ico { width: var(--ds-ico, 16px); height: var(--ds-ico, 16px); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* Display voice + small text roles */
:is(.jq, .jq-dlgwrap) .jq-d1, :is(.jq, .jq-dlgwrap) .jq-d2 { font-family: var(--ds-display); font-weight: var(--ds-display-weight); letter-spacing: var(--ds-display-track); font-variant-numeric: var(--ds-nums); color: var(--ds-ink); }
:is(.jq, .jq-dlgwrap) .jq-d1 { font-size: var(--ds-text-d1); line-height: var(--ds-lh-d1); }
:is(.jq, .jq-dlgwrap) .jq-d2 { font-size: var(--ds-text-d2); line-height: var(--ds-lh-d2); letter-spacing: -0.004em; }
:is(.jq, .jq-dlgwrap) .jq-caps { font-size: var(--ds-text-caps); line-height: var(--ds-lh-caps); font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-caps); text-transform: uppercase; color: var(--ds-ink-3); }
:is(.jq, .jq-dlgwrap) .jq-meta { font-size: var(--ds-text-sm); line-height: var(--ds-lh-sm); color: var(--ds-ink-3); letter-spacing: var(--ds-track-sm); }
:is(.jq, .jq-dlgwrap) .jq-mut { color: var(--ds-ink-3); }
:is(.jq, .jq-dlgwrap) .jq-sep { color: var(--ds-icon); margin: 0 6px; }
:is(.jq, .jq-dlgwrap) .jq-link { color: var(--ds-ink); font-weight: var(--ds-w-medium); text-decoration: underline; text-decoration-color: var(--ds-field); text-underline-offset: 3px; text-decoration-thickness: 1px; }
:is(.jq, .jq-dlgwrap) .jq-late { display: inline-flex; align-items: center; gap: 6px; color: var(--ds-st-late-ink); font-weight: var(--ds-w-medium); }
:is(.jq, .jq-dlgwrap) .jq-warn { color: var(--ds-st-route-ink); font-weight: var(--ds-w-medium); }
:is(.jq, .jq-dlgwrap) .jq-emsg { color: var(--ds-st-late-ink); font-size: var(--ds-text-sm); font-weight: var(--ds-w-medium); }
/* prose (site names, scope, notes) uses proportional figures so hyphens keep their width */
.jq :is(.jq-ttl, .jq-sub, .jq-note, .jq-osub, .jq-s2, .jq-vis, .jq-facts dd, .jq-scope, .jq-mr, .jq-mats),
.jq-dlgwrap :is(.jq-facts dd, .jq-lnote, .jq-tv, .jq-sig) { font-variant-numeric: normal; }

/* ── Focus: one ring on every interactive element (outline, so the box never moves) ── */
:is(.jq, .jq-dlgwrap) :is(button, a, input, select, textarea, summary, [tabindex], [role="button"]):focus-visible { outline: var(--ds-focus-w) solid var(--ds-focus); outline-offset: var(--ds-focus-off); }
/* clipped / edge-to-edge surfaces: ring drawn inside */
.jq :is(.jq-row, .jq-ohead, .jq-ghead, .jq-orow, .jq-sortb):focus-visible,
.jq-dlgwrap :is(.jq-plane, .jq-pwho, .jq-trow):focus-visible { outline-offset: calc(-1 * var(--ds-focus-w)); }
:is(.jq, .jq-dlgwrap) :is(input:not([type="checkbox"]), textarea):focus-visible { box-shadow: inset 0 0 0 1px var(--ds-line); }

/* ── Buttons: primary / secondary (default) / quiet ── */
:is(.jq, .jq-dlgwrap) .jq-btn { height: var(--ds-control-h); display: inline-flex; align-items: center; justify-content: center; gap: var(--ds-s-2); padding: 0 var(--ds-s-3); border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); color: var(--ds-ink); box-shadow: var(--ds-e-secondary); font: inherit; font-size: var(--ds-text-base); font-weight: var(--ds-w-medium); letter-spacing: inherit; white-space: nowrap; cursor: pointer; text-decoration: none; list-style: none; transition: background-color var(--ds-fast) var(--ds-ease); }
:is(.jq, .jq-dlgwrap) summary.jq-btn::-webkit-details-marker { display: none; }
:is(.jq, .jq-dlgwrap) .jq-btn .jq-ico { color: var(--ds-ink-2); }
:is(.jq, .jq-dlgwrap) .jq-btn .jq-ico:first-child { margin-left: -2px; }
:is(.jq, .jq-dlgwrap) .jq-btn:hover { background: var(--ds-paper-hover); box-shadow: inset 0 0 0 1px var(--ds-ink-3); }
:is(.jq, .jq-dlgwrap) .jq-btn:active { background: var(--ds-canvas); box-shadow: inset 0 0 0 1px var(--ds-field); transform: translateY(0.5px); }
:is(.jq, .jq-dlgwrap) .jq-btn.primary { background: var(--ds-action); color: var(--ds-action-fg); font-weight: var(--ds-w-semi); box-shadow: var(--ds-e-primary); }
:is(.jq, .jq-dlgwrap) .jq-btn.primary:hover { background: var(--ds-action-hover); }
:is(.jq, .jq-dlgwrap) .jq-btn.primary:active { background: var(--ds-action-press); box-shadow: var(--ds-e-primary-press); }
:is(.jq, .jq-dlgwrap) .jq-btn.quiet { background: none; box-shadow: none; color: var(--ds-ink-2); padding: 0 var(--ds-s-2); }
:is(.jq, .jq-dlgwrap) .jq-btn.quiet .jq-ico { color: var(--ds-icon); }
:is(.jq, .jq-dlgwrap) .jq-btn.quiet:hover { background: var(--ds-paper-hover); box-shadow: none; }
:is(.jq, .jq-dlgwrap) .jq-btn:disabled { background: var(--ds-disabled-bg); color: var(--ds-disabled-fg); box-shadow: inset 0 0 0 1px var(--ds-disabled-bd); cursor: not-allowed; transform: none; }
:is(.jq, .jq-dlgwrap) .jq-btn:disabled .jq-ico { color: var(--ds-disabled-fg); }
:is(.jq, .jq-dlgwrap) .jq-btn.primary:disabled { background: var(--ds-disabled-primary-bg); color: var(--ds-disabled-primary-fg); box-shadow: none; }
:is(.jq, .jq-dlgwrap) .jq-btn.quiet:disabled { background: none; box-shadow: none; }
/* "sm" is the in-row action: a normal-height button on desktop (the mockup's final rule), touch height on phone */
.jq .jq-c-act .jq-btn.sm { margin-top: -2px; }
.jq .jq-clear { height: var(--ds-control-h); padding: 0 var(--ds-s-2); border: 0; border-radius: var(--ds-r-md); background: none; font: inherit; font-weight: var(--ds-w-medium); color: var(--ds-ink-2); cursor: pointer; }
.jq .jq-clear:hover { background: var(--ds-paper-hover); }

/* ── Form controls: filter select / search / toggle / checkbox ── */
:is(.jq, .jq-dlgwrap) .jq-fsel { position: relative; display: inline-flex; }
:is(.jq, .jq-dlgwrap) .jq-fsel select { appearance: none; -webkit-appearance: none; height: var(--ds-control-h); padding: 0 28px 0 10px; border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); box-shadow: inset 0 0 0 1px var(--ds-field); color: var(--ds-ink); font: inherit; font-size: var(--ds-text-base); cursor: pointer; max-width: 100%; }
:is(.jq, .jq-dlgwrap) .jq-fsel.set select { background: var(--ds-sel-bg); font-weight: var(--ds-w-medium); }
:is(.jq, .jq-dlgwrap) .jq-fsel .jq-ico { position: absolute; right: 8px; top: 8px; color: var(--ds-icon); pointer-events: none; }
.jq .jq-fsearch { position: relative; display: inline-flex; }
.jq .jq-fsearch input { height: var(--ds-control-h); width: 288px; max-width: 100%; padding: 0 var(--ds-s-2) 0 30px; border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); box-shadow: inset 0 0 0 1px var(--ds-field); color: var(--ds-ink); font: inherit; font-size: var(--ds-text-base); }
.jq .jq-fsearch input::placeholder { color: var(--ds-ink-3); }
.jq .jq-fsearch .jq-ico { position: absolute; left: 9px; top: 8px; color: var(--ds-icon); pointer-events: none; }
.jq .jq-tgl { height: var(--ds-control-h); display: inline-flex; align-items: center; gap: 6px; padding: 0 var(--ds-s-3); border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); box-shadow: inset 0 0 0 1px var(--ds-field); color: var(--ds-ink); font: inherit; white-space: nowrap; cursor: pointer; }
.jq .jq-tgl:hover { background: var(--ds-paper-hover); }
.jq .jq-tgl[aria-pressed="true"] { background: var(--ds-sel-bg); font-weight: var(--ds-w-medium); box-shadow: inset 0 0 0 1px var(--ds-ink-3); }
.jq .jq-tgl .jq-ico { margin-left: -2px; color: var(--ds-ink-2); }
.jq .jq-cb { width: 16px; height: 16px; accent-color: var(--ds-action); margin: 0; }

/* ── Status vocabulary: glyph (.jq-gl), soft pill, Simpro chip, swatch, tag, avatar ── */
.jq .jq-gl { content: ""; width: 12px; height: 12px; flex: none; display: inline-block; background: currentColor; -webkit-mask: var(--g) center / 12px 12px no-repeat; mask: var(--g) center / 12px 12px no-repeat; }
.jq :is(.jq-gl, .jq-pill).sch { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).route { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M6 2.75a3.25 3.25 0 0 1 0 6.5z'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).site { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='6' cy='6' r='3.25'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).done { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cmask id='m'%3E%3Crect width='12' height='12' fill='%23fff'/%3E%3Cpath d='M3.7 6.1 5.3 7.7 8.4 4.4' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/mask%3E%3Ccircle cx='6' cy='6' r='5.5' mask='url%28%23m%29'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).late { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cmask id='m'%3E%3Crect width='12' height='12' fill='%23fff'/%3E%3Cpath d='M6 3.2v3.3' stroke='%23000' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='6' cy='8.6' r='.85' fill='%23000'/%3E%3C/mask%3E%3Ccircle cx='6' cy='6' r='5.5' mask='url%28%23m%29'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).warn { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M6 3.7v2.6' stroke='%23000' stroke-width='1.4' stroke-linecap='round'/%3E%3Ccircle cx='6' cy='8.1' r='.8'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).review { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='6' cy='6' r='1.5'/%3E%3C/svg%3E"); }
.jq :is(.jq-gl, .jq-pill).nil { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.75' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M4 6h4' stroke='%23000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); }
.jq .jq-gl.sch { background: var(--ds-st-sched); }
.jq .jq-gl:is(.route, .warn, .review) { background: var(--ds-st-route); }
.jq .jq-gl.site { background: var(--ds-st-site); }
.jq .jq-gl.done { background: var(--ds-st-done); }
.jq .jq-gl.late { background: var(--ds-st-late); }
.jq .jq-gl.nil { background: var(--ds-icon); }

/* soft pill: tint only, glyph from the family above; the word stays ink-2 */
.jq .jq-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 var(--ds-s-2) 0 6px; border-radius: var(--ds-r-sm); font-size: var(--ds-text-sm); font-weight: var(--ds-w-medium); letter-spacing: var(--ds-track-sm); white-space: nowrap; color: var(--ds-ink-2); background: var(--ds-tint); }
.jq .jq-pill::before { content: ""; width: 12px; height: 12px; flex: none; background: currentColor; -webkit-mask: var(--g) center / 12px 12px no-repeat; mask: var(--g) center / 12px 12px no-repeat; }
.jq .jq-pill.route { background: var(--ds-st-route-bg); } .jq .jq-pill.route::before { background: var(--ds-st-route); }
.jq .jq-pill.done { background: var(--ds-st-done-bg); } .jq .jq-pill.done::before { background: var(--ds-st-done); }
.jq .jq-pill.late { background: var(--ds-st-late-bg); } .jq .jq-pill.late::before { background: var(--ds-st-late); }

/* Simpro status chip: background set inline by JS */
:is(.jq, .jq-dlgwrap) .jq-chip { display: inline-block; width: fit-content; max-width: 100%; padding: 2px var(--ds-s-2); border-radius: var(--ds-r-sm); background: var(--ds-tint); color: var(--ds-ink); font-size: var(--ds-text-sm); line-height: var(--ds-lh-sm); font-weight: var(--ds-w-medium); letter-spacing: var(--ds-track-sm); white-space: nowrap; }
/* status swatch (rail + group head): colour set inline by JS; empty = neutral */
.jq .jq-sw { width: 10px; height: 10px; border-radius: var(--ds-r-tag); flex: none; background: var(--ds-tint); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ds-ink) 25%, transparent); }
/* equipment code: the stamped tag */
.jq .jq-tag { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; border-radius: var(--ds-r-tag); font-size: var(--ds-text-caps); line-height: 1; font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tag); text-transform: uppercase; color: var(--ds-ink); background: var(--ds-tag-bg); font-variant-numeric: var(--ds-nums); white-space: nowrap; flex: none; }
:is(.jq, .jq-dlgwrap) .jq-av { width: 24px; height: 24px; border-radius: var(--ds-r-full); display: inline-grid; place-items: center; flex: none; background: var(--ds-av-1); color: var(--ds-ink-2); font-size: var(--ds-text-av); font-weight: var(--ds-w-semi); letter-spacing: 0.03em; }

/* ── Module layout: rail + main ── */
.jq { --jq-rail-w: 248px; min-width: 0; }
.jq .jq-body { display: flex; align-items: flex-start; min-width: 0; }
.jq:not(.progress) .jq-body { background: linear-gradient(to right, var(--ds-surface) calc(var(--jq-rail-w) - 1px), var(--ds-line) calc(var(--jq-rail-w) - 1px) var(--jq-rail-w), transparent var(--jq-rail-w)); }
.jq .jq-main { flex: 1; min-width: 0; display: flex; flex-direction: column; align-self: stretch; }

/* rail: views, recurring, visit days, statuses (with sub-views), saved views */
.jq .jq-rail { width: var(--jq-rail-w); flex: none; position: sticky; top: 0; max-height: 100vh; overflow: auto; background: var(--ds-surface); padding: var(--ds-s-3) var(--ds-s-2) var(--ds-s-6); }
.jq .jq-rsec { font-size: var(--ds-text-sm); font-weight: var(--ds-w-semi); color: var(--ds-ink-3); padding: var(--ds-s-4) var(--ds-s-3) var(--ds-s-1); }
.jq .jq-ri { width: 100%; height: var(--ds-control-h); display: flex; align-items: center; gap: var(--ds-s-2); padding: 0 var(--ds-s-3); border: 0; border-radius: var(--ds-r-md); background: none; color: var(--ds-ink-2); font: inherit; font-weight: var(--ds-w-medium); text-align: left; white-space: nowrap; cursor: pointer; }
.jq .jq-ri.sub { padding-left: 32px; font-weight: var(--ds-w-regular); height: 28px; }
.jq .jq-ri:hover { background: var(--ds-paper-hover); }
.jq .jq-ri[aria-current="true"] { background: var(--ds-sel-bg); color: var(--ds-ink); font-weight: var(--ds-w-semi); box-shadow: inset 3px 0 0 var(--ds-selection); }
.jq .jq-ri .jq-ico { color: var(--ds-icon); }
.jq .jq-n { margin-left: auto; color: var(--ds-ink-3); font-weight: var(--ds-w-regular); }
.jq .jq-n.hot { color: var(--ds-st-late-ink); font-weight: var(--ds-w-medium); }
.jq .jq-rsaved { display: flex; align-items: center; gap: 2px; }
.jq .jq-rsaved .jq-ri { flex: 1; min-width: 0; }
.jq .jq-nm { min-width: 0; }
.jq .jq-rsaved .jq-nm { overflow: hidden; text-overflow: ellipsis; }
.jq .jq-rdel { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border: 0; border-radius: var(--ds-r-md); background: none; color: var(--ds-icon); cursor: pointer; }
.jq .jq-rdel:hover { background: var(--ds-paper-hover); color: var(--ds-ink); }
.jq .jq-rsave { margin: var(--ds-s-1) var(--ds-s-1) 0; }

/* ── View bar: title, search, filters, columns ── */
.jq .jq-vbar { flex: none; background: var(--ds-surface); box-shadow: inset 0 -1px 0 var(--ds-line); padding: var(--ds-s-3) var(--ds-gutter); display: flex; flex-direction: column; gap: var(--ds-s-3); }
.jq .jq-vrow { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-s-2); min-width: 0; }
.jq .jq-grow { flex: 1; }
.jq .jq-vtitle { display: flex; align-items: baseline; gap: var(--ds-s-3); min-width: 0; }
.jq .jq-vtitle .jq-meta { font-size: var(--ds-text-base); }
.jq .jq-fgroup { display: contents; }
.jq .jq-fmore { display: none; }
.jq .jq-subchips { display: flex; flex-wrap: wrap; gap: var(--ds-s-2); }
/* desktop: the rail already carries status sub-views, so only the chips with their own filter (data-jq-ust) show */
.jq .jq-subchips:not(:has([data-jq-ust])) { display: none; }
.jq .jq-colsm { position: relative; }
.jq .jq-colsm > summary { cursor: pointer; }
.jq .jq-colpop { position: absolute; right: 0; top: 36px; z-index: 6; width: 220px; padding: var(--ds-s-2); background: var(--ds-surface); border-radius: var(--ds-r-lg); box-shadow: var(--ds-e-pop); display: flex; flex-direction: column; }
.jq .jq-colpop label { display: flex; align-items: center; gap: var(--ds-s-2); height: var(--ds-control-h); padding: 0 var(--ds-s-2); border-radius: var(--ds-r-md); cursor: pointer; }
.jq .jq-colpop label:hover { background: var(--ds-paper-hover); }
.jq .jq-colpop label.off { color: var(--ds-ink-3); cursor: not-allowed; }
.jq .jq-colpop input { accent-color: var(--ds-action); width: 16px; height: 16px; margin: 0; }
.jq .jq-colpop > .jq-meta { padding: 4px var(--ds-s-2); }

/* ── List grid ── */
.jq .jq-list { min-width: 0; }
.jq .jq-grid { display: grid; column-gap: var(--ds-s-3); padding: 0 var(--ds-gutter); min-width: 0; grid-template-columns: var(--jq-cols, 64px minmax(160px, 1.5fr) repeat(6, minmax(0, 1fr)) 96px); }
.jq .jq-grid > * { min-width: 0; }
.jq .jq-lhead { height: var(--ds-lhead-h); align-items: center; box-shadow: inset 0 -1px 0 var(--ds-line); background: var(--ds-canvas); position: sticky; top: 0; z-index: 2; }
.jq .jq-lhead .jq-caps { display: inline-flex; align-items: center; gap: 4px; }
.jq .jq-sortb { display: inline-flex; align-items: center; gap: 4px; height: 24px; margin-left: -6px; padding: 0 6px; border: 0; border-radius: var(--ds-r-sm); background: none; font: inherit; font-size: var(--ds-text-caps); line-height: var(--ds-lh-caps); font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-caps); text-transform: uppercase; color: var(--ds-ink-3); cursor: pointer; }
.jq .jq-sortb:hover { background: var(--ds-paper-hover); color: var(--ds-ink-2); }
.jq .jq-sortb .jq-ico { width: 12px; height: 12px; color: var(--ds-ink-2); }
.jq .jq-sortb.on { color: var(--ds-ink); }
.jq .jq-sortb:not(.on) .jq-ico { visibility: hidden; }
.jq .jq-sortb:hover .jq-ico { visibility: visible; }
.jq .jq-caps.jq-r, .jq .jq-c-num.jq-r { text-align: right; }

.jq .jq-row { min-height: 64px; box-shadow: inset 0 -0.5px 0 var(--ds-rule); align-items: start; padding-top: 12px; padding-bottom: 10px; cursor: pointer; background: var(--ds-surface); }
.jq .jq-row:hover { background: var(--ds-paper-hover); }
.jq .jq-row:hover .jq-go { color: var(--ds-ink); }
.jq .jq-row.sel { background: var(--ds-sel-bg); }
.jq .jq-c-num { font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink-2); display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.jq .jq-c-num.jq-r { align-items: flex-end; }
.jq .jq-ttl { font-size: var(--ds-text-md); line-height: 20px; font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tight); color: var(--ds-ink); }
.jq .jq-sub { font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink-2); display: flex; align-items: flex-start; flex-wrap: wrap; column-gap: 6px; row-gap: 2px; }
.jq .jq-sub .jq-tag { margin-top: 1px; }
.jq .jq-wt { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; min-width: 0; }
.jq .jq-c-site { min-width: 0; }
.jq .jq-c-st { padding-top: 2px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.jq .jq-flag { color: var(--ds-st-late-ink); font-weight: var(--ds-w-medium); }
.jq .jq-flag.soft { color: var(--ds-st-route-ink); }
.jq .jq-c-step { font-size: var(--ds-text-base); line-height: 20px; min-width: 0; }
.jq .jq-s1 { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.jq .jq-s2 { color: var(--ds-ink-3); font-size: var(--ds-text-sm); line-height: 16px; padding-left: 18px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.jq .jq-c-step > .jq-chip + .jq-s2, .jq .jq-ugrid .jq-c-step .jq-s2 { padding-left: 0; }
.jq .jq-c-tech { display: flex; align-items: center; gap: var(--ds-s-2); font-size: var(--ds-text-base); line-height: 20px; white-space: nowrap; min-width: 0; }
.jq .jq-c-tech .jq-av { margin: -2px 0; }
.jq .jq-c-tech .jq-nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jq .jq-c-mat, .jq .jq-c-as { min-width: 0; }
.jq .jq-mats { display: flex; flex-direction: column; font-size: var(--ds-text-sm); line-height: 16px; color: var(--ds-ink-2); padding-top: 2px; }
.jq .jq-mats > span:not(.jq-meta) { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.jq .jq-c-act { display: flex; justify-content: flex-end; min-width: 0; }
.jq .jq-go { display: flex; color: var(--ds-icon); padding-top: 2px; }
.jq .jq-lend { padding: var(--ds-s-3) var(--ds-gutter) var(--ds-s-8); }

/* group header */
.jq .jq-ghead { display: flex; align-items: center; gap: var(--ds-s-2); height: var(--ds-lhead-h); width: 100%; padding: 0 var(--ds-gutter); border: 0; background: var(--ds-surface); box-shadow: inset 0 -1px 0 var(--ds-line); position: sticky; top: var(--ds-lhead-h); z-index: 1; text-align: left; font: inherit; cursor: pointer; }
.jq .jq-gtl { font-size: var(--ds-text-base); font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tight); }
.jq .jq-ghead .jq-n { margin-left: 0; }
.jq .jq-ghead .jq-meta { margin-left: auto; }
.jq .jq-ghead > .jq-ico { color: var(--ds-icon); transition: transform var(--ds-fast) var(--ds-ease); }
.jq .jq-ghead[aria-expanded="false"] > .jq-ico { transform: rotate(-90deg); }

/* empty state inside the list frame */
.jq .jq-empty { padding: var(--ds-s-6) var(--ds-gutter); display: grid; grid-template-columns: 64px 1fr; column-gap: var(--ds-s-5); background: var(--ds-surface); box-shadow: inset 0 -0.5px 0 var(--ds-rule); }
.jq .jq-empty > div { display: flex; flex-direction: column; gap: var(--ds-s-2); align-items: flex-start; }
.jq .jq-empty h3 { font-size: var(--ds-text-md); line-height: var(--ds-lh-md); font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tight); }
.jq .jq-empty p { color: var(--ds-ink-2); }

/* ── Recurring grids ── */
.jq .jq-rgrid { grid-template-columns: 20px 64px minmax(220px, 2fr) 104px 128px 128px minmax(100px, 0.8fr) 96px 104px; }
.jq .jq-ugrid { column-gap: var(--ds-s-4); grid-template-columns: 136px minmax(200px, 1.6fr) 104px minmax(170px, 1.2fr) minmax(110px, 0.8fr) 128px 88px 104px; }
.jq .jq-rgrid > :first-child { display: flex; align-items: center; }
.jq .jq-rgrid.jq-row > :first-child { padding-top: 2px; align-items: flex-start; }
.jq .jq-rgrid .jq-sub .jq-wt { -webkit-line-clamp: 2; }
.jq :is(.jq-rgrid, .jq-ugrid) .jq-c-num .jq-meta { overflow-wrap: anywhere; }
@media (max-width: 1400px) and (min-width: 760px) {
  .jq .jq-ugrid { grid-template-columns: 120px minmax(180px, 1.6fr) 96px minmax(160px, 1.2fr) 120px 88px 104px; }
  .jq .jq-ugrid > :nth-child(5) { display: none; }
  .jq .jq-rgrid { grid-template-columns: 20px 76px minmax(190px, 2fr) 120px 128px 88px 104px; }
  .jq .jq-rgrid > :nth-child(4), .jq .jq-rgrid > :nth-child(7) { display: none; }
}

/* ── Open record (expansion in place) ── */
.jq .jq-open { background: var(--ds-surface); box-shadow: inset 3px 0 0 var(--ds-selection), inset 0 -1px 0 var(--ds-line), inset 0 1px 0 var(--ds-line); scroll-margin-top: calc(var(--ds-lhead-h) + var(--ds-s-6)); }
.jq .jq-grid3 { display: grid; grid-template-columns: 64px minmax(0, 1fr) 32px; column-gap: var(--ds-s-3); padding: 0 var(--ds-gutter); }
.jq .jq-ohead { padding-top: var(--ds-s-5); padding-bottom: var(--ds-s-4); align-items: baseline; cursor: pointer; }
.jq .jq-ohead > .jq-c-num { line-height: 32px; }
.jq .jq-ohead .jq-go { align-self: start; padding-top: 8px; justify-content: flex-end; }
.jq .jq-otl { display: flex; align-items: center; gap: var(--ds-s-3); flex-wrap: wrap; }
.jq .jq-oact { margin-left: auto; display: flex; align-items: center; gap: var(--ds-s-3); flex-wrap: wrap; }
.jq .jq-osub { margin-top: var(--ds-s-1); font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink-2); display: flex; align-items: center; flex-wrap: wrap; }
.jq .jq-osub .jq-sep { margin: 0 8px; }
.jq .jq-ofacts { display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 0.7fr); column-gap: var(--ds-s-6); padding: 0 var(--ds-gutter) var(--ds-s-4); font-size: var(--ds-text-base); line-height: 20px; }
.jq .jq-ofacts::before { content: ""; }
.jq .jq-ofacts > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; font-variant-numeric: normal; }
.jq .jq-ocols { display: grid; grid-template-columns: 64px minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1.05fr); column-gap: var(--ds-s-6); padding: 0 var(--ds-gutter) var(--ds-s-6); }
.jq .jq-ocols > section { padding-top: var(--ds-s-4); box-shadow: inset 0 1px 0 var(--ds-line); min-width: 0; }
.jq .jq-ocols > section:first-of-type { grid-column: 2; }
.jq .jq-scope { font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink); overflow-wrap: anywhere; }
.jq .jq-scope + .jq-meta, .jq .jq-sh + .jq-meta { display: block; margin-top: var(--ds-s-2); }
.jq .jq-vis { display: grid; grid-template-columns: 96px minmax(0, 1fr) 36px; column-gap: var(--ds-s-3); font-size: var(--ds-text-base); line-height: 20px; padding: 6px 0; box-shadow: inset 0 -0.5px 0 var(--ds-hair); }
.jq .jq-vis:last-child { box-shadow: none; }
.jq .jq-vis.past { color: var(--ds-ink-3); }
.jq .jq-vis > :first-child { white-space: nowrap; }
.jq .jq-note { font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink); padding: 6px 0; box-shadow: inset 0 -0.5px 0 var(--ds-hair); overflow-wrap: anywhere; }
.jq .jq-note:last-child { box-shadow: none; }
.jq .jq-note.dim { color: var(--ds-ink-2); }
.jq .jq-mr { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--ds-s-2); font-size: var(--ds-text-base); line-height: 20px; padding: 5px 0; box-shadow: inset 0 -0.5px 0 var(--ds-hair); }
.jq .jq-mr > :first-child { text-align: right; }
.jq .jq-orow { width: 100%; display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: var(--ds-s-2); align-items: center; padding: 6px 0; border: 0; background: none; text-align: left; font: inherit; font-size: var(--ds-text-base); box-shadow: inset 0 -0.5px 0 var(--ds-hair); cursor: pointer; }
.jq .jq-orow:hover { background: var(--ds-paper-hover); }
:is(.jq, .jq-dlgwrap) .jq-sh { display: flex; align-items: baseline; gap: var(--ds-s-2); margin-bottom: var(--ds-s-3); }
:is(.jq, .jq-dlgwrap) .jq-sh :is(h2, h3) { font-size: var(--ds-text-md); line-height: var(--ds-lh-md); font-weight: var(--ds-w-medium); letter-spacing: var(--ds-track-tight); color: var(--ds-ink); }
.jq .jq-ocols > section > .jq-sh ~ .jq-sh { margin-top: var(--ds-s-4); }
:is(.jq, .jq-dlgwrap) .jq-sh.em { margin-top: var(--ds-s-5); padding-top: var(--ds-s-4); box-shadow: inset 0 1px 0 var(--ds-line); }
:is(.jq, .jq-dlgwrap) .jq-facts { display: grid; grid-template-columns: 96px minmax(0, 1fr); row-gap: var(--ds-s-2); column-gap: var(--ds-s-3); font-size: var(--ds-text-base); line-height: 20px; }
.jq .jq-ocols .jq-facts { margin-top: var(--ds-s-4); }
:is(.jq, .jq-dlgwrap) .jq-facts dt { color: var(--ds-ink-3); }
:is(.jq, .jq-dlgwrap) .jq-facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }

/* ── Sticky action bar ── */
.jq .jq-bar { height: var(--ds-actionbar-h); flex: none; display: flex; align-items: center; gap: var(--ds-s-4); padding: 0 var(--ds-gutter); background: var(--ds-canvas); box-shadow: var(--ds-e-bar); position: sticky; bottom: 0; z-index: 3; }
.jq .jq-who { display: flex; align-items: center; gap: var(--ds-s-3); min-width: 0; font-size: var(--ds-text-md); letter-spacing: var(--ds-track-tight); color: var(--ds-ink-2); white-space: nowrap; }
.jq .jq-who b { color: var(--ds-ink); font-weight: var(--ds-w-semi); flex: none; }
.jq .jq-who .jq-chip { flex: none; }
.jq .jq-bsite { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.jq .jq-bend { margin-left: auto; display: flex; align-items: center; gap: var(--ds-s-3); }
.jq .jq-bend .jq-btn.primary { min-width: 176px; }
/* money is a normal figure here: body size, never the headline */
.jq .jq-total { display: flex; align-items: baseline; gap: var(--ds-s-2); font-size: var(--ds-text-base); color: var(--ds-ink-3); margin-right: var(--ds-s-3); }
.jq .jq-total b { font-weight: var(--ds-w-regular); color: var(--ds-ink-2); }

/* ═══ Offer times dialog (appended to body) ═══ */
.jq-dlgwrap { position: fixed; inset: 0; z-index: 60; background: var(--ds-scrim); display: grid; place-items: center; padding: var(--ds-s-6); }
.jq-dlgwrap .jq-dlg { width: min(1320px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; background: var(--ds-surface); border-radius: var(--ds-r-lg); box-shadow: var(--ds-e-pop); min-width: 0; }
.jq-dlgwrap .jq-dlg.sm { width: min(640px, 100%); }
.jq-dlgwrap .jq-dlghead { display: flex; align-items: flex-end; gap: var(--ds-s-4); padding: var(--ds-s-4) var(--ds-s-6); box-shadow: inset 0 -1px 0 var(--ds-line); flex: none; }
.jq-dlgwrap .jq-dlghead h2 { margin-top: 2px; font-size: var(--ds-text-md); line-height: var(--ds-lh-md); font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tight); }
.jq-dlgwrap .jq-dlghead > div:first-child { min-width: 0; }
.jq-dlgwrap .jq-dur { margin-left: auto; display: flex; align-items: center; gap: var(--ds-s-2); }
.jq-dlgwrap .jq-x { width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: var(--ds-r-md); background: none; color: var(--ds-icon); align-self: flex-start; cursor: pointer; flex: none; }
.jq-dlgwrap .jq-dlghead > div:first-child + .jq-x { margin-left: auto; }
.jq-dlgwrap .jq-x:hover { background: var(--ds-paper-hover); }

.jq-dlgwrap .jq-dlgbody { flex: 1; min-height: 0; overflow: auto; display: grid; grid-template-columns: minmax(0, 1fr); }
.jq-dlgwrap .jq-dlgbody > section { padding: var(--ds-s-4) var(--ds-s-6) var(--ds-s-5); min-width: 0; }
/* a single-column body (loading, error, email review, recurring confirm) holds its content directly */
.jq-dlgwrap .jq-dlgbody.one { display: flex; flex-direction: column; align-items: stretch; gap: var(--ds-s-3); padding: var(--ds-s-4) var(--ds-s-6) var(--ds-s-5); }
.jq-dlgwrap .jq-dlgbody.one > .jq-btn { align-self: flex-start; }
/* the technician list duplicates the board's name buttons, so (as in the approved mockup) it only shows when it carries
   information the board does not: the crew / fixed technician kept from the current visit */
.jq-dlgwrap .jq-techs { display: none; }
.jq-dlgwrap .jq-techs:has(div.jq-trow) { display: block; box-shadow: inset -1px 0 0 var(--ds-line); padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
.jq-dlgwrap .jq-dlgbody:has(> .jq-techs div.jq-trow) { grid-template-columns: 300px minmax(0, 1fr); }
.jq-dlgwrap .jq-techs .jq-meta { display: block; margin-top: var(--ds-s-2); }
.jq-dlgwrap .jq-trow { width: 100%; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: var(--ds-s-2); min-height: 40px; padding: 0 var(--ds-s-2); border: 0; border-radius: var(--ds-r-md); background: none; text-align: left; font: inherit; font-size: var(--ds-text-base); color: var(--ds-ink); }
.jq-dlgwrap button.jq-trow { cursor: pointer; }
.jq-dlgwrap .jq-trow:hover { background: var(--ds-paper-hover); }
.jq-dlgwrap .jq-trow.on { background: var(--ds-sel-bg); box-shadow: inset 3px 0 0 var(--ds-selection); font-weight: var(--ds-w-medium); }
.jq-dlgwrap .jq-trow:disabled { color: var(--ds-ink-3); cursor: default; background: none; }
.jq-dlgwrap .jq-trow .when { color: var(--ds-ink-2); white-space: nowrap; font-size: var(--ds-text-sm); }
.jq-dlgwrap .jq-trow .nm { min-width: 0; overflow-wrap: anywhere; }
.jq-dlgwrap .jq-slots { min-width: 0; }
.jq-dlgwrap .jq-techsel { display: none; margin-bottom: var(--ds-s-3); }
.jq-dlgwrap .jq-techsel .jq-fsel, .jq-dlgwrap .jq-techsel select { width: 100%; }
.jq-dlgwrap .jq-ccsel { display: flex; align-items: center; gap: var(--ds-s-2); margin-bottom: var(--ds-s-3); }
.jq-dlgwrap .jq-dnote { font-size: var(--ds-text-sm); color: var(--ds-ink-2); margin-top: 6px; }
.jq-dlgwrap .jq-lnote { font-size: var(--ds-text-base); line-height: 20px; color: var(--ds-ink); }
.jq-dlgwrap .jq-dlgfoot { display: flex; align-items: center; gap: var(--ds-s-3); padding: var(--ds-s-3) var(--ds-s-6); box-shadow: var(--ds-e-bar); flex: none; }
.jq-dlgwrap .jq-sum { flex: 1; min-width: 0; color: var(--ds-ink-2); font-size: var(--ds-text-base); }

/* day strip */
.jq-dlgwrap .jq-wk { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 6px; }
.jq-dlgwrap .jq-wkd { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 6px var(--ds-s-2); border: 0; border-radius: var(--ds-r-md); box-shadow: inset 0 0 0 1px var(--ds-line); background: var(--ds-surface); color: var(--ds-ink); text-align: left; font: inherit; font-size: var(--ds-text-sm); line-height: 16px; cursor: pointer; min-width: 0; }
.jq-dlgwrap .jq-wkd b { font-size: var(--ds-text-sm); line-height: 16px; font-weight: var(--ds-w-semi); }
.jq-dlgwrap .jq-wkd .jq-ld { width: 100%; height: 6px; border-radius: 2px; background: var(--ds-line); overflow: hidden; }
.jq-dlgwrap .jq-wkd .jq-ld i { display: block; height: 100%; background: var(--ds-ink-3); }
.jq-dlgwrap .jq-wkd .jq-op { color: var(--ds-ink-2); }
.jq-dlgwrap .jq-wkd:hover { background: var(--ds-paper-hover); }
.jq-dlgwrap .jq-wkd.on { background: var(--ds-sel-bg); box-shadow: inset 0 0 0 2px var(--ds-selection); }
.jq-dlgwrap .jq-wkd:disabled { color: var(--ds-ink-3); background: var(--ds-canvas); cursor: not-allowed; }

/* schedule board */
.jq-dlgwrap .jq-pboard { position: relative; border-radius: var(--ds-r-md); box-shadow: inset 0 0 0 1px var(--ds-line); overflow: hidden; background: var(--ds-surface); --jq-who-w: 230px; }
.jq-dlgwrap .jq-paxis, .jq-dlgwrap .jq-prow { display: grid; grid-template-columns: var(--jq-who-w) minmax(0, 1fr); }
.jq-dlgwrap .jq-paxis { height: 24px; box-shadow: inset 0 -1px 0 var(--ds-line); background: var(--ds-canvas); }
.jq-dlgwrap .jq-pscale { position: relative; }
.jq-dlgwrap .jq-pscale span { position: absolute; top: 4px; transform: translateX(-50%); font-size: var(--ds-text-caps); color: var(--ds-ink-3); white-space: nowrap; }
.jq-dlgwrap .jq-pscale span:first-child { transform: none; }
.jq-dlgwrap .jq-pscale span:last-child { transform: translateX(-100%); }
.jq-dlgwrap .jq-plines { position: absolute; top: 24px; bottom: 0; left: var(--jq-who-w); right: 0; pointer-events: none; }
.jq-dlgwrap .jq-plines i { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--ds-hair); }
.jq-dlgwrap .jq-plines .off { position: absolute; top: 0; bottom: 0; background: var(--ds-board-offhours, var(--ds-canvas)); opacity: 0.7; }
.jq-dlgwrap .jq-prow { min-height: 34px; box-shadow: inset 0 -1px 0 var(--ds-hair); position: relative; }
.jq-dlgwrap .jq-prow.sel { background: color-mix(in srgb, var(--ds-sel-bg) 60%, transparent); }
.jq-dlgwrap .jq-prow.dim { opacity: 0.55; }
.jq-dlgwrap .jq-pwho { display: flex; flex-direction: column; justify-content: center; padding: 2px var(--ds-s-2); box-shadow: inset -1px 0 0 var(--ds-line); background: var(--ds-surface); z-index: 1; min-width: 0; }
.jq-dlgwrap button.jq-pwho { width: 100%; height: 100%; border: 0; text-align: left; font: inherit; color: var(--ds-ink); cursor: pointer; }
.jq-dlgwrap button.jq-pwho:hover { background: var(--ds-paper-hover); }
.jq-dlgwrap button.jq-pwho[aria-pressed="true"] { box-shadow: inset 3px 0 0 var(--ds-selection), inset -1px 0 0 var(--ds-line); }
.jq-dlgwrap button.jq-pwho:disabled { cursor: default; color: var(--ds-ink-3); }
.jq-dlgwrap .jq-pwho .n { font-size: var(--ds-text-sm); font-weight: var(--ds-w-medium); line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jq-dlgwrap .jq-pwho .jq-meta { font-size: var(--ds-text-caps); line-height: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jq-dlgwrap .jq-plane { position: relative; cursor: copy; min-width: 0; }
.jq-dlgwrap .jq-pb { position: absolute; top: 3px; bottom: 3px; border-radius: var(--ds-r-block); background: var(--ds-surface); box-shadow: inset 0 0 0 1px var(--ds-field-quiet); padding: 1px 5px; overflow: hidden; display: flex; align-items: center; gap: 4px; font-size: var(--ds-text-sm); line-height: 14px; white-space: nowrap; cursor: not-allowed; }
.jq-dlgwrap .jq-pb .t { color: var(--ds-ink-3); font-variant-numeric: var(--ds-nums); flex: none; }
.jq-dlgwrap .jq-pb .s { font-weight: var(--ds-w-medium); overflow: hidden; text-overflow: ellipsis; }
.jq-dlgwrap .jq-pb.act { background: var(--ds-wash); }
.jq-dlgwrap .jq-pb.me { background: var(--ds-st-route-bg); box-shadow: inset 0 0 0 2px var(--ds-selection); border: 1px dashed var(--ds-selection); z-index: 2; cursor: default; }
.jq-dlgwrap .jq-pb.me .t { color: var(--ds-ink); font-weight: var(--ds-w-semi); }
.jq-dlgwrap .jq-pb.now { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ds-field); border: 1px dashed var(--ds-field); cursor: default; }
.jq-dlgwrap .jq-pb.now .s { color: var(--ds-ink-2); }

/* travel context under the board */
.jq-dlgwrap .jq-travel { margin-top: var(--ds-s-3); display: flex; flex-direction: column; }
.jq-dlgwrap .jq-tv { display: grid; grid-template-columns: 72px minmax(0, 1fr) 140px; gap: var(--ds-s-3); padding: 5px 0; font-size: var(--ds-text-base); line-height: 20px; box-shadow: inset 0 -0.5px 0 var(--ds-hair); }
.jq-dlgwrap .jq-tv .jq-caps { padding-top: 2px; }
.jq-dlgwrap .jq-tv.me { font-weight: var(--ds-w-medium); }

/* email review */
.jq-dlgwrap .jq-mailedit fieldset { display: flex; flex-direction: column; gap: var(--ds-s-3); }
.jq-dlgwrap .jq-fld { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.jq-dlgwrap .jq-fld input, .jq-dlgwrap .jq-fld textarea { width: 100%; padding: 0 var(--ds-s-2); border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); box-shadow: inset 0 0 0 1px var(--ds-field); color: var(--ds-ink); font: inherit; font-size: var(--ds-text-base); font-variant-numeric: normal; }
.jq-dlgwrap .jq-fld input { height: var(--ds-control-h); }
.jq-dlgwrap .jq-fld textarea { padding-top: var(--ds-s-2); padding-bottom: var(--ds-s-2); line-height: 20px; resize: vertical; min-height: 160px; }
.jq-dlgwrap .jq-sig { white-space: pre-wrap; padding: var(--ds-s-2) var(--ds-s-3); border-radius: var(--ds-r-md); box-shadow: inset 0 0 0 1px var(--ds-line); color: var(--ds-ink-2); font-size: var(--ds-text-sm); line-height: var(--ds-lh-sm); overflow-wrap: anywhere; }

/* recurring confirm list */
.jq-dlgwrap .jq-clist { display: flex; flex-direction: column; max-height: 50vh; overflow: auto; }
.jq-dlgwrap .jq-ci { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; gap: var(--ds-s-3); align-items: center; padding: 8px 0; box-shadow: inset 0 -0.5px 0 var(--ds-rule); }
.jq-dlgwrap .jq-ci .jq-c-num { color: var(--ds-ink-2); }
.jq-dlgwrap .jq-ci .jq-ttl { font-size: var(--ds-text-md); line-height: 20px; font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tight); overflow-wrap: anywhere; }
.jq-dlgwrap .jq-ci .jq-sub { display: flex; gap: 6px; flex-wrap: nowrap; color: var(--ds-ink-2); }
.jq-dlgwrap .jq-ci .jq-tag { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; border-radius: var(--ds-r-tag); font-size: var(--ds-text-caps); line-height: 1; font-weight: var(--ds-w-semi); letter-spacing: var(--ds-track-tag); text-transform: uppercase; background: var(--ds-tag-bg); }

/* ═══ Phone (the mockup's 759px breakpoint) ═══ */
@media (max-width: 759px) {
  /* rail becomes a sticky strip of chips */
  .jq .jq-body, .jq:not(.progress) .jq-body { flex-direction: column; align-items: stretch; background: none; }
  .jq .jq-rail { width: auto; max-height: none; flex: none; display: flex; overflow-x: auto; overflow-y: hidden; padding: var(--ds-s-2) var(--ds-s-4); box-shadow: inset 0 -1px 0 var(--ds-line); gap: var(--ds-s-1); z-index: 4; scrollbar-width: none; }
  .jq .jq-rsec, .jq .jq-rsave, .jq .jq-ri.sub, .jq .jq-rsaved .jq-rdel { display: none; }
  .jq .jq-ri { width: auto; height: var(--ds-touch-h); flex: none; }
  .jq .jq-ri .jq-n { margin-left: 6px; }
  .jq .jq-main { align-self: auto; }

  /* view bar */
  .jq .jq-vbar { padding: var(--ds-s-3) var(--ds-s-4); }
  .jq .jq-vtitle .jq-d2 { font-size: var(--ds-text-p-d2); line-height: var(--ds-lh-p-d2); }
  .jq .jq-fsearch { flex: 1 1 100%; } .jq .jq-fsearch input { width: 100%; }
  .jq .jq-fsearch input, .jq .jq-fsel select { height: var(--ds-touch-h); }
  .jq .jq-fsel, .jq .jq-fsel select { flex: 1 1 140px; }
  .jq .jq-fsel .jq-ico, .jq .jq-fsearch .jq-ico { top: 16px; }
  .jq .jq-fmore { display: inline-flex; height: var(--ds-touch-h); }
  .jq .jq-fgroup { display: none; }
  .jq .jq-fmore[aria-expanded="true"] + .jq-fgroup { display: flex; flex-wrap: wrap; gap: var(--ds-s-2); width: 100%; }
  .jq .jq-vrow > .jq-grow { display: none; }
  .jq .jq-tgl, .jq .jq-clear { height: var(--ds-touch-h); }
  .jq .jq-subchips, .jq .jq-subchips:not(:has([data-jq-ust])) { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--ds-s-4)); padding: 0 var(--ds-s-4); }
  .jq .jq-subchips .jq-tgl { flex: none; }
  .jq .jq-colsm { display: none; }

  /* touch heights on every in-row / bar action */
  .jq .jq-btn.sm, .jq .jq-c-act .jq-btn, .jq .jq-bar .jq-btn { height: var(--ds-touch-h); }
  .jq .jq-c-act .jq-btn.sm { margin-top: 0; }

  /* list: header gone, rows become cards */
  .jq .jq-lhead { display: none; }
  .jq .jq-ghead { top: 0; padding: 0 var(--ds-s-4); height: var(--ds-touch-h); }
  .jq .jq-lend { padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
  .jq .jq-empty { padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); grid-template-columns: 1fr; }
  .jq .jq-empty > span { display: none; }
  .jq .jq-grid { padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "site num" "st st" "step step" "tech tech" "go go"; row-gap: 6px; padding-top: var(--ds-s-3); padding-bottom: var(--ds-s-3); min-height: 0; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-site { grid-area: site; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-num:first-child { grid-area: num; text-align: right; align-items: flex-end; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-st { grid-area: st; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px; padding: 0; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-step { grid-area: step; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-tech { grid-area: tech; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-act { grid-area: go; justify-content: flex-start; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-num:not(:first-child),
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat,
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-as,
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-tech:not(:has(.jq-av)),
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-act:not(:has(.jq-btn)) { display: none; }
  .jq .jq-row .jq-ttl { font-size: var(--ds-text-p-body); line-height: 22px; }
  .jq .jq-chip { white-space: normal; }
  .jq .jq-c-tech .jq-nm { white-space: normal; }

  /* recurring due to create */
  .jq .jq-rgrid.jq-row { grid-template-columns: 24px minmax(0, 1fr) auto; grid-template-areas: "cb site num" "cb due due" "cb act act"; row-gap: 6px; }
  .jq .jq-rgrid.jq-row > :nth-child(1) { grid-area: cb; min-width: 44px; min-height: 44px; }
  .jq .jq-rgrid.jq-row > :nth-child(2) { grid-area: num; text-align: right; align-items: flex-end; }
  .jq .jq-rgrid.jq-row > :nth-child(3) { grid-area: site; }
  .jq .jq-rgrid.jq-row > :nth-child(5) { grid-area: due; flex-direction: row; gap: 8px; align-items: baseline; }
  .jq .jq-rgrid.jq-row > :nth-child(9) { grid-area: act; justify-content: flex-start; }
  .jq .jq-rgrid.jq-row > :nth-child(4), .jq .jq-rgrid.jq-row > :nth-child(6), .jq .jq-rgrid.jq-row > :nth-child(7), .jq .jq-rgrid.jq-row > :nth-child(8) { display: none; }
  .jq .jq-rgrid .jq-cb { width: 28px; height: 28px; }
  /* recurring coming up */
  .jq .jq-ugrid.jq-row { grid-template-columns: minmax(0, 1fr); grid-template-areas: "site" "due" "step" "go"; }
  .jq .jq-ugrid.jq-row > :nth-child(1) { grid-area: due; flex-direction: row; gap: 8px; }
  .jq .jq-ugrid.jq-row > :nth-child(2) { grid-area: site; }
  .jq .jq-ugrid.jq-row > :nth-child(4) { grid-area: step; }
  .jq .jq-ugrid.jq-row > :nth-child(8) { grid-area: go; justify-content: flex-start; }
  .jq .jq-ugrid.jq-row > :nth-child(3), .jq .jq-ugrid.jq-row > :nth-child(5), .jq .jq-ugrid.jq-row > :nth-child(6), .jq .jq-ugrid.jq-row > :nth-child(7) { display: none; }
  .jq .jq-ugrid .jq-c-act:not(:has(.jq-btn)) { display: none; }

  /* open record stacks */
  .jq .jq-ohead, .jq .jq-ocols { display: block; padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
  .jq .jq-ohead > .jq-c-num, .jq .jq-ohead > .jq-go { display: none; }
  .jq .jq-oact { margin-left: 0; }
  .jq .jq-d1 { font-size: var(--ds-text-p-d1); line-height: var(--ds-lh-p-d1); }
  .jq .jq-ocols > section { margin-top: var(--ds-s-4); }
  .jq .jq-ofacts { display: flex; flex-direction: column; gap: var(--ds-s-3); padding: 0 var(--ds-s-4) var(--ds-s-4); }
  .jq .jq-ofacts::before { display: none; }
  .jq .jq-ofacts a.jq-link { display: inline-block; padding: 12px 0; }
  .jq .jq-orow { min-height: var(--ds-touch-h); }

  /* action bar: identity row, then every action at touch height */
  .jq .jq-bar { height: auto; flex-wrap: wrap; padding: var(--ds-s-2) var(--ds-s-4); gap: var(--ds-s-2); }
  .jq .jq-who { flex: 1 1 100%; font-size: var(--ds-text-base); }
  .jq .jq-who .jq-chip, .jq .jq-total { display: none; }
  .jq .jq-bend { flex: 1 1 100%; flex-wrap: wrap; margin-left: 0; gap: var(--ds-s-2); }
  .jq .jq-bend .jq-btn { flex: 1 1 auto; min-width: 0; }
  .jq .jq-bend .jq-btn.primary { min-width: 0; }

  /* dialog: full screen */
  .jq-dlgwrap { padding: 0; }
  .jq-dlgwrap .jq-dlg, .jq-dlgwrap .jq-dlg.sm { width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
  @supports (height: 100dvh) { .jq-dlgwrap .jq-dlg, .jq-dlgwrap .jq-dlg.sm { max-height: 100dvh; height: 100dvh; } }
  .jq-dlgwrap .jq-dlghead { flex-wrap: wrap; padding: var(--ds-s-3) var(--ds-s-4); }
  .jq-dlgwrap .jq-dlghead > div:first-child { flex: 1 1 0; }
  .jq-dlgwrap .jq-dlgfoot { flex-wrap: wrap; padding: var(--ds-s-3) var(--ds-s-4); }
  .jq-dlgwrap .jq-dlgfoot .jq-sum { flex-basis: 100%; }
  .jq-dlgwrap .jq-dlgfoot .jq-btn { flex: 1; }
  .jq-dlgwrap .jq-dlgbody { grid-template-columns: minmax(0, 1fr) !important; }
  .jq-dlgwrap .jq-dlgbody > section, .jq-dlgwrap .jq-dlgbody.one { padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
  .jq-dlgwrap .jq-techs:has(div.jq-trow) { box-shadow: inset 0 -1px 0 var(--ds-line); }
  .jq-dlgwrap .jq-techsel { display: flex; }
  .jq-dlgwrap .jq-trow, .jq-dlgwrap .jq-wkd, .jq-dlgwrap .jq-dlg select, .jq-dlgwrap .jq-dlg .jq-btn { min-height: var(--ds-touch-h); }
  .jq-dlgwrap .jq-dlghead .jq-x { width: var(--ds-touch-h); height: var(--ds-touch-h); }
  .jq-dlgwrap .jq-fsel .jq-ico { top: 16px; }
  .jq-dlgwrap .jq-wk { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jq-dlgwrap .jq-wkd { min-height: 64px; }
  .jq-dlgwrap .jq-tv { grid-template-columns: 64px 1fr; }
  .jq-dlgwrap .jq-tv > :last-child { grid-column: 2; }
  .jq-dlgwrap .jq-ci { grid-template-columns: 48px minmax(0, 1fr); }
  .jq-dlgwrap .jq-ci > :nth-child(n + 3) { grid-column: 2; }
  /* board: lanes scroll sideways, technician names stay pinned */
  .jq-dlgwrap .jq-pboard { --jq-who-w: 120px; --jq-board-w: 760px; display: block; overflow-x: auto; overscroll-behavior-x: contain; }
  .jq-dlgwrap .jq-pboard .jq-paxis, .jq-dlgwrap .jq-pboard .jq-prow { width: var(--jq-board-w); }
  .jq-dlgwrap .jq-pboard .jq-plines { right: auto; width: calc(var(--jq-board-w) - var(--jq-who-w)); }
  .jq-dlgwrap .jq-pboard .jq-pwho { position: sticky; left: 0; }
  .jq-dlgwrap .jq-pboard .jq-paxis .jq-pwho { background: var(--ds-canvas); }
  .jq-dlgwrap .jq-prow { min-height: var(--ds-touch-h); }
}

/* ═══ Motion: nothing animates for people who ask for less ═══ */
@media (prefers-reduced-motion: reduce) {
  :is(.jq, .jq-dlgwrap) *, :is(.jq, .jq-dlgwrap) *::before, :is(.jq, .jq-dlgwrap) *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  .jq .jq-btn:active { transform: none; }
}

/* Open job: the record band and Edit details (owned by jobs.js) sit on the content column, after the job-number column. */
.jq .jq-oband, .jq .jq-oedit { padding: 0 var(--ds-gutter) var(--ds-s-3) calc(var(--ds-gutter) + 64px + var(--ds-s-6)); }
.jq .jq-oedit:empty, .jq .jq-oband:empty { display: none; }
@media (max-width: 759px) { .jq .jq-oband, .jq .jq-oedit { padding-left: var(--ds-gutter); } }

/* Review fixes 2026-10-19 */
.jq .jq-viewsel { display: none; }
.jq .jq-mr .jq-meta { display: block; }
.jq-dlgwrap .jq-dctx { margin: var(--ds-s-1) 0 0; color: var(--ds-ink-2); font-size: var(--ds-text-sm); line-height: var(--ds-lh-sm); max-width: 72ch; }
.jq-dlgwrap .jq-dctx .jq-sep { color: var(--ds-ink-3); }
@media (max-width: 759px) {
  /* Phone: one "View" picker replaces the sideways rail strip (13 views did not fit and the current one could sit off-screen). */
  .jq .jq-rail { display: none; }
  .jq .jq-viewsel { display: flex; margin: 0 0 var(--ds-s-2); }
  .jq .jq-viewsel select { width: 100%; min-height: var(--ds-touch-h); font-weight: var(--ds-w-semi); }
  .jq-dlgwrap .jq-dctx { display: none; }
}

/* ═══ Calm pass (owner feedback 2026-10-21: "badly formatted, alarmist, generic elements") ═══
   Red is kept for the few things that are actually late (visit tomorrow not confirmed, parts ETA passed, visited but
   status not updated). Waiting a while, a passed due date and empty columns read as plain text. One action per row,
   as a quiet text link; no decorative glyphs. */
.jq .jq-s1 { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ds-ink); }
.jq .jq-s1.late, .jq .jq-s2.late { color: var(--ds-st-late-ink); }
.jq .jq-s1.ok { color: var(--ds-ok-ink); }
.jq .jq-s2 { padding-left: 0; }
.jq .jq-due-past { color: var(--ds-ink); font-weight: var(--ds-w-medium); }
.jq .jq-row .jq-ttl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jq .jq-row .jq-sub { flex-wrap: nowrap; overflow: hidden; }
.jq .jq-row .jq-sub .jq-wt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jq .jq-ctag { flex: none; margin-left: var(--ds-s-1); color: var(--ds-ink-3); font-size: var(--ds-text-sm); }
.jq .jq-ctag::before { content: "· "; }
.jq .jq-n { color: var(--ds-ink-3); font-weight: var(--ds-w-regular); }
.jq .jq-ri[aria-current="true"] .jq-n { color: var(--ds-ink-2); }
.jq .jq-act-link { min-height: var(--ds-control-h); padding: 0 var(--ds-s-2); margin-right: calc(-1 * var(--ds-s-2)); border: 0; border-radius: var(--ds-r-md); background: none; color: var(--ds-action); font: inherit; font-weight: var(--ds-w-medium); white-space: nowrap; cursor: pointer; }
.jq .jq-act-link:hover { background: var(--ds-paper-hover); text-decoration: underline; text-underline-offset: 3px; }
.jq .jq-act-link:focus-visible { outline: var(--ds-focus-w) solid var(--ds-focus); outline-offset: var(--ds-focus-off); }
.jq .jq-act-link:disabled { color: var(--ds-ink-3); cursor: default; text-decoration: none; background: none; }
.jq .jq-c-act { justify-content: flex-end; }
.jq .jq-vrow .jq-fsearch input { width: 240px; }
.jq .jq-filtm { position: relative; }
.jq .jq-filtm > summary { cursor: pointer; list-style: none; }
.jq .jq-filtm > summary::-webkit-details-marker, .jq .jq-colsm > summary::-webkit-details-marker { display: none; }
.jq .jq-filtm .jq-colpop { width: 260px; }
.jq .jq-filtm .jq-fld { display: flex; flex-direction: column; align-items: stretch; gap: 4px; height: auto; padding: var(--ds-s-1) var(--ds-s-2) var(--ds-s-2); cursor: default; }
.jq .jq-filtm .jq-fld:hover { background: none; }
.jq .jq-filtm .jq-fld .jq-fsel, .jq .jq-filtm .jq-fld select { width: 100%; }
.jq .jq-badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 6px; padding: 0 5px; border-radius: var(--ds-r-full); background: var(--ds-action); color: var(--ds-action-fg); font-size: var(--ds-text-sm); font-weight: var(--ds-w-semi); }
.jq .jq-flag, .jq .jq-flag.soft { display: none; }
@media (max-width: 759px) {
  .jq .jq-vrow .jq-fsearch input { width: 100%; }
  .jq .jq-act-link { min-height: var(--ds-touch-h); }
}
/* Row actions: a text action that reads as a link, on the first line of the row. */
.jq .jq-c-act { align-self: start; }
.jq .jq-act-link { min-height: 24px; padding: 2px var(--ds-s-2); margin-top: -2px; text-decoration: underline; text-decoration-color: var(--ds-line); text-underline-offset: 3px; }
.jq .jq-act-link:hover { text-decoration-color: currentColor; }
/* Open job: header actions in one row; quieter section rhythm. */
.jq .jq-oact { display: inline-flex; align-items: center; gap: var(--ds-s-3); }
.jq .jq-oact .planning-edit { font: inherit; font-size: var(--ds-text-sm); color: var(--ds-ink-2); }
.jq .jq-open .jq-facts + .jq-sh { margin-top: var(--ds-s-5); }
/* Offer board: time someone is not available is hatched, not a block labelled "Activity". */
.jq-dlgwrap .jq-pb.act { background: repeating-linear-gradient(135deg, var(--ds-wash) 0 6px, var(--ds-surface) 6px 12px); color: var(--ds-ink-3); box-shadow: inset 0 0 0 1px var(--ds-line); }
.jq-dlgwrap .jq-pb.act .t { display: none; }

/* ═══ Owner review 2026-10-21 (2): real row buttons, status dot, job details layout, schedule preview ═══ */
/* Status: the Simpro colour as a solid dot, the name in normal text. */
:is(.jq, .jq-dlgwrap) .jq-chip { display: inline-flex; align-items: center; gap: 7px; padding: 0; background: none; color: var(--ds-ink); font-size: var(--ds-text-base); font-weight: var(--ds-w-regular); line-height: 20px; white-space: nowrap; border-radius: 0; }
:is(.jq, .jq-dlgwrap) .jq-dot { width: 10px; height: 10px; flex: none; border-radius: var(--ds-r-full); background: var(--ds-ink-3); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ds-ink) 22%, transparent); }
.jq .jq-who .jq-chip { font-size: var(--ds-text-sm); }

/* Row actions: the main action is a real button; the next one sits beside it; the rest are under "More". */
.jq .jq-c-act { align-self: start; justify-content: flex-end; }
.jq .jq-racts { display: flex; align-items: center; justify-content: flex-end; gap: var(--ds-s-1); margin-top: -4px; }
.jq .jq-racts .jq-btn.sm { height: 30px; padding: 0 var(--ds-s-3); font-size: var(--ds-text-sm); }
.jq .jq-racts .jq-btn.sm.main { font-weight: var(--ds-w-semi); }
.jq .jq-racts .jq-btn.sm:not(.main) { box-shadow: none; color: var(--ds-ink-2); background: none; }
.jq .jq-racts .jq-btn.sm:not(.main):hover { background: var(--ds-paper-hover); box-shadow: none; color: var(--ds-ink); }
.jq .jq-btn.icon { width: 30px; padding: 0; box-shadow: none; background: none; }
.jq .jq-btn.icon:hover { background: var(--ds-paper-hover); box-shadow: none; }
.jq .jq-btn.icon .jq-ico { margin: 0; fill: currentColor; stroke: none; }
.jq .jq-more { position: relative; }
.jq .jq-more > summary { list-style: none; }
.jq .jq-more > summary::-webkit-details-marker { display: none; }
.jq .jq-menu { position: absolute; right: 0; top: 34px; z-index: 8; min-width: 200px; padding: var(--ds-s-1); background: var(--ds-surface); border-radius: var(--ds-r-lg); box-shadow: var(--ds-e-pop); display: flex; flex-direction: column; }
.jq .jq-menu > * { display: flex; align-items: center; height: var(--ds-control-h); padding: 0 var(--ds-s-3); border: 0; border-radius: var(--ds-r-md); background: none; color: var(--ds-ink); font: inherit; font-size: var(--ds-text-base); text-align: left; text-decoration: none; white-space: nowrap; cursor: pointer; }
.jq .jq-menu > *:hover, .jq .jq-menu > *:focus-visible { background: var(--ds-paper-hover); }

/* Open job: header, then scope/materials/notes on the left and the job's facts in cards on the right. */
.jq .jq-ohead { display: flex; align-items: flex-start; gap: var(--ds-s-4); padding: var(--ds-s-5) var(--ds-gutter) var(--ds-s-4) calc(var(--ds-gutter) + 64px + var(--ds-s-3)); cursor: pointer; }
.jq .jq-ohead-main { flex: 1 1 auto; min-width: 0; }
.jq .jq-otl { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-s-2) var(--ds-s-4); }
.jq .jq-oname { margin: 0; font-family: var(--ds-display); font-weight: var(--ds-display-weight); letter-spacing: var(--ds-display-track); font-size: var(--ds-text-d2); line-height: var(--ds-lh-d2); color: var(--ds-ink); }
.jq .jq-osub { margin-top: 2px; color: var(--ds-ink-2); font-size: var(--ds-text-base); }
.jq .jq-note-pill { font-size: var(--ds-text-sm); color: var(--ds-st-late-ink); font-weight: var(--ds-w-medium); }
.jq .jq-note-pill.ok { color: var(--ds-ok-ink); }
.jq .jq-oact { flex: none; display: flex; align-items: center; gap: var(--ds-s-3); }
.jq .jq-oact .jq-btn.sm { height: 30px; font-size: var(--ds-text-sm); }
.jq .jq-oact .planning-edit { height: 30px; padding: 0 var(--ds-s-3); border-radius: var(--ds-r-md); box-shadow: var(--ds-e-secondary); background: var(--ds-surface); color: var(--ds-ink); font: inherit; font-size: var(--ds-text-sm); font-weight: var(--ds-w-medium); text-decoration: none; cursor: pointer; }
.jq .jq-oact .planning-edit:hover { background: var(--ds-paper-hover); }
.jq .jq-oact .jq-go { color: var(--ds-icon); }
.jq .jq-obody { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); gap: var(--ds-s-8); padding: 0 var(--ds-gutter) var(--ds-s-6) calc(var(--ds-gutter) + 64px + var(--ds-s-3)); }
.jq .jq-omain { min-width: 0; display: flex; flex-direction: column; gap: var(--ds-s-6); }
.jq .jq-osh { margin: 0 0 var(--ds-s-2); font-size: var(--ds-text-caps); line-height: var(--ds-lh-caps); letter-spacing: var(--ds-track-caps); text-transform: uppercase; font-weight: var(--ds-w-semi); color: var(--ds-ink-2); display: flex; gap: var(--ds-s-2); align-items: baseline; }
.jq .jq-scope { max-width: 72ch; color: var(--ds-ink); font-size: var(--ds-text-base); line-height: var(--ds-lh-md); }
.jq .jq-scope p { margin: 0 0 var(--ds-s-2); }
.jq .jq-scope .jq-scope-intro { color: var(--ds-ink-2); }
.jq .jq-scope h3 { margin: var(--ds-s-4) 0 var(--ds-s-1); font-size: var(--ds-text-base); font-weight: var(--ds-w-semi); color: var(--ds-ink); }
.jq .jq-scope ol { margin: 0 0 var(--ds-s-2); padding-left: 20px; }
.jq .jq-scope li { margin: 0 0 4px; padding-left: 2px; }
.jq .jq-kv { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 6px var(--ds-s-3); margin: 0; font-size: var(--ds-text-base); line-height: 20px; }
.jq .jq-kv dt { color: var(--ds-ink-2); }
.jq .jq-kv dd { margin: 0; color: var(--ds-ink); overflow-wrap: anywhere; }
.jq .jq-scope .jq-kv { margin: var(--ds-s-2) 0 var(--ds-s-2); }
.jq .jq-mtable { width: 100%; max-width: 760px; border-collapse: collapse; font-size: var(--ds-text-base); line-height: 20px; }
.jq .jq-mtable th { text-align: left; font-size: var(--ds-text-caps); letter-spacing: var(--ds-track-caps); text-transform: uppercase; font-weight: var(--ds-w-semi); color: var(--ds-ink-3); padding: 0 var(--ds-s-3) 6px 0; box-shadow: inset 0 -1px 0 var(--ds-line); }
.jq .jq-mtable td { padding: 7px var(--ds-s-3) 7px 0; vertical-align: top; box-shadow: inset 0 -1px 0 var(--ds-hair); }
.jq .jq-mtable .q { width: 48px; text-align: right; padding-right: var(--ds-s-4); font-variant-numeric: var(--ds-nums); color: var(--ds-ink-2); }
.jq .jq-mtable .pn { width: 150px; color: var(--ds-ink-2); font-variant-numeric: var(--ds-nums); }
.jq .jq-mtable tr.g th { padding-top: var(--ds-s-3); text-transform: none; letter-spacing: 0; font-size: var(--ds-text-sm); color: var(--ds-ink-2); }
.jq .jq-notes { margin: 0; padding: 0; list-style: none; max-width: 72ch; }
.jq .jq-notes li { padding: 8px 0; box-shadow: inset 0 -1px 0 var(--ds-hair); font-size: var(--ds-text-base); line-height: var(--ds-lh-md); }
.jq .jq-notes li:first-child { padding-top: 0; }
.jq .jq-oside { display: flex; flex-direction: column; gap: var(--ds-s-3); min-width: 0; }
.jq .jq-card { padding: var(--ds-s-4); border-radius: var(--ds-r-lg); background: var(--ds-canvas); }
.jq .jq-card .jq-kv { grid-template-columns: 96px minmax(0, 1fr); }
.jq .jq-addr, .jq .jq-contact { margin: 0 0 var(--ds-s-3); line-height: 20px; }
.jq .jq-contact { display: flex; flex-direction: column; gap: 2px; margin-bottom: 0; }
.jq .jq-vlist, .jq .jq-olist { margin: 0; padding: 0; list-style: none; }
.jq .jq-vlist li { display: grid; grid-template-columns: 96px 1fr auto; gap: var(--ds-s-2); padding: 4px 0; font-size: var(--ds-text-sm); line-height: 18px; }
.jq .jq-vlist li.past { color: var(--ds-ink-3); }
.jq .jq-olist .jq-orow { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px var(--ds-s-2); padding: 6px 0; border: 0; background: none; text-align: left; font: inherit; font-size: var(--ds-text-sm); color: var(--ds-ink); cursor: pointer; }
.jq .jq-olist .jq-orow .jq-chip { grid-column: 2; font-size: var(--ds-text-sm); }
.jq .jq-olist .jq-orow:hover > span:nth-child(2) { text-decoration: underline; }
@media (max-width: 759px) {
  .jq .jq-ohead { flex-direction: column; padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); }
  .jq .jq-obody { grid-template-columns: 1fr; padding: 0 var(--ds-s-4) var(--ds-s-6); gap: var(--ds-s-5); }
  .jq .jq-racts { margin-top: 0; }
  .jq .jq-racts .jq-btn.sm { height: var(--ds-touch-h); }
}

/* Offer preview: two-line blocks (site + town · job), held visits dashed, activities by name, the technician's day in one line. */
.jq-dlgwrap .jq-prow { min-height: 46px; }
.jq-dlgwrap .jq-pb { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; padding: 2px 6px; }
.jq-dlgwrap .jq-pb .s { max-width: 100%; font-size: var(--ds-text-sm); line-height: 16px; color: var(--ds-ink); }
.jq-dlgwrap .jq-pb .d { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font-size: var(--ds-text-caps); line-height: 14px; color: var(--ds-ink-2); }
.jq-dlgwrap .jq-pb.held { background: var(--ds-surface); box-shadow: none; border: 1px dashed var(--ds-field); }
.jq-dlgwrap .jq-pb.held em { font-style: normal; font-weight: var(--ds-w-semi); color: var(--ds-ink-2); }
.jq-dlgwrap .jq-pb.act .s { color: var(--ds-ink-2); font-weight: var(--ds-w-medium); }
.jq-dlgwrap .jq-pb.me { justify-content: center; }
.jq-dlgwrap .jq-pwho .jq-free { font-size: var(--ds-text-caps); line-height: 14px; color: var(--ds-ok-ink); font-weight: var(--ds-w-medium); }
.jq-dlgwrap .jq-pwho .jq-free.none { color: var(--ds-ink-3); font-weight: var(--ds-w-regular); }
.jq-dlgwrap .jq-wkd .jq-op2 { display: block; font-size: var(--ds-text-caps); line-height: 14px; color: var(--ds-ink-3); }
.jq .jq-grid { column-gap: var(--ds-s-4); }
.jq .jq-c-st { min-width: 0; overflow: hidden; }
.jq .jq-c-st .jq-chip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* ═══ Strict review round 1 fixes ═══ */
/* Every row action is a bordered button; the main one (right) carries a stronger outline. Fixed column, right aligned. */
.jq .jq-racts .jq-btn.sm, .jq .jq-racts .jq-btn.sm:not(.main) { height: 28px; padding: 0 10px; background: var(--ds-surface); color: var(--ds-ink); box-shadow: var(--ds-e-secondary); font-size: var(--ds-text-sm); font-weight: var(--ds-w-medium); }
.jq .jq-racts .jq-btn.sm:not(.main):hover, .jq .jq-racts .jq-btn.sm:hover { background: var(--ds-paper-hover); box-shadow: inset 0 0 0 1px var(--ds-ink-3); }
.jq .jq-racts .jq-btn.sm.main { box-shadow: inset 0 0 0 1px var(--ds-ink-2); font-weight: var(--ds-w-semi); }
.jq .jq-racts .jq-btn.icon { width: 28px; height: 28px; box-shadow: none; background: none; }
/* Status: a 12px Simpro-colour dot with a ring so light colours (yellow, lime) stay visible; same shape in the rail. */
:is(.jq, .jq-dlgwrap) .jq-dot, .jq .jq-sw { width: 12px; height: 12px; border-radius: var(--ds-r-full); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ds-ink) 35%, transparent); }
/* Amber for "tomorrow", red only for today. */
.jq .jq-s1.warn, .jq .jq-s2.warn { color: var(--ds-warn-ink); }
/* What the work is, one line, under the site. */
.jq .jq-snip { margin-top: 2px; color: var(--ds-ink-3); font-size: var(--ds-text-sm); line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* No grey band under short lists. */
.jq .jq-main { background: var(--ds-surface); }
@media (max-width: 759px) {
  /* Cards keep Due and Age (the sort is by age). */
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) { grid-template-areas: "site num" "st st" "step step" "due age" "tech tech" "go go"; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-due:not(:empty) { display: flex; grid-area: due; flex-direction: row; gap: 6px; align-items: baseline; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-age:not(:empty) { display: flex; grid-area: age; justify-content: flex-end; }
  .jq .jq-row > .jq-c-due:not(:empty)::before { content: "Due"; color: var(--ds-ink-3); font-size: var(--ds-text-sm); }
  .jq .jq-row > .jq-c-age:not(:empty)::before { content: "Waiting\00a0"; color: var(--ds-ink-3); font-size: var(--ds-text-sm); }
  .jq .jq-viewsel { margin-bottom: var(--ds-s-1); }
  .jq .jq-vbar .jq-vrow:first-of-type { min-height: 0; }
  /* Offer dialog: days scroll in one row so the board stays on screen. */
  .jq-dlgwrap .jq-wk { display: flex; overflow-x: auto; gap: var(--ds-s-2); scroll-snap-type: x proximity; }
  .jq-dlgwrap .jq-wkd { flex: 0 0 132px; scroll-snap-align: start; }
  .jq-dlgwrap .jq-dctx { display: block; font-size: var(--ds-text-caps); }
  .jq-dlgwrap .jq-dlgfoot .jq-sum { font-size: var(--ds-text-sm); }
}
.jq-dlgwrap .jq-duetag { margin-left: 4px; padding: 0 5px; border-radius: var(--ds-r-sm); background: var(--ds-warn-soft); color: var(--ds-warn-ink); font-size: var(--ds-text-caps); font-weight: var(--ds-w-semi); }
.jq .jq-held { font-style: normal; font-size: var(--ds-text-caps); font-weight: var(--ds-w-semi); color: var(--ds-ink-2); border: 1px dashed var(--ds-field); border-radius: var(--ds-r-sm); padding: 0 4px; }
.jq .jq-holdnote { margin: 0 0 var(--ds-s-1); line-height: var(--ds-lh-md); }
.jq .jq-morenotes > summary { cursor: pointer; color: var(--ds-action); font-weight: var(--ds-w-medium); padding: var(--ds-s-2) 0; }
.jq .jq-card .jq-kv { grid-template-columns: 104px minmax(0, 1fr); }

/* ═══ Strict review round 2 ═══ */
.jq .jq-c-tech, .jq .jq-c-step, .jq .jq-c-num { min-width: 0; overflow: hidden; }
.jq .jq-c-act { min-width: 0; }
.jq .jq-racts { flex-wrap: nowrap; }
:is(.jq, .jq-dlgwrap) .jq-dot, .jq .jq-sw { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--ds-ink) 45%, transparent); }
/* The page fills the window under short lists. */
.jq .jq-body { min-height: calc(100vh - 160px); }
.jq-dlgwrap .jq-pwho .jq-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 759px) {
  .jq .jq-viewsel { margin: 0 0 var(--ds-s-2); }
  .jq .jq-vbar { padding-top: var(--ds-s-2); padding-bottom: var(--ds-s-2); }
  .jq .jq-vbar .jq-vtitle { padding: 0; }
  .jq .jq-subchips { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: var(--ds-s-2); scrollbar-width: none; }
  .jq .jq-subchips > * { flex: none; }
  /* Offer on a phone: one-line header, one-row footer, so the board gets the screen. */
  .jq-dlgwrap .jq-dctx { display: none; }
  .jq-dlgwrap .jq-dlghead h2 { font-size: var(--ds-text-md); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .jq-dlgwrap .jq-dlghead .jq-meta { display: none; }
  .jq-dlgwrap .jq-dlgfoot { flex-wrap: nowrap; gap: var(--ds-s-2); }
  .jq-dlgwrap .jq-dlgfoot .jq-sum { flex: 1 1 auto; flex-basis: auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: var(--ds-text-sm); }
  .jq-dlgwrap .jq-dlgfoot [data-o-hold="0"], .jq-dlgwrap .jq-dlgfoot > .jq-meta { display: none; }
  .jq-dlgwrap .jq-dlgfoot .jq-btn { flex: none; }
}

/* ═══ Strict review round 3 ═══ */
.jq .jq-notech .jq-rgrid { grid-template-columns: 20px 64px minmax(220px, 2fr) 104px 128px 128px 96px 104px; }
.jq .jq-notech .jq-rgrid > :nth-child(7) { display: none; }
@media (max-width: 759px) {
  .jq .jq-viewsel { position: relative; display: block; height: var(--ds-touch-h); margin: 0 0 var(--ds-s-3); }
  .jq .jq-viewsel select { display: block; width: 100%; height: var(--ds-touch-h); min-height: 0; }
  .jq .jq-viewsel .jq-ico { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); pointer-events: none; }
  /* Offer footer on a phone: the slot on one line, who and why on the next, button beside. */
  .jq-dlgwrap .jq-dlgfoot .jq-sum { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 18px; }
}
.jq-dlgwrap .jq-phone-br { display: none; }
@media (max-width: 759px) { .jq-dlgwrap .jq-phone-br { display: inline; } }
@media (max-width: 759px) { .jq-dlgwrap .jq-desk-sep { display: none; } }
@media (max-width: 759px) { .jq .jq-vbar > .jq-viewsel { flex: none; } }
@media (max-width: 759px) {
  .jq-dlgwrap .jq-desk-only { display: none; }
  .jq-dlgwrap .jq-dlgfoot .jq-sum { max-height: 36px; overflow: hidden; overscroll-behavior: none; }
}
@media (max-width: 759px) {
  /* Phone Offer footer: summary full width (date, then who · why), button full width under it. */
  .jq-dlgwrap .jq-dlgfoot { flex-wrap: wrap; }
  .jq-dlgwrap .jq-dlgfoot .jq-sum { flex: 1 1 100%; max-height: 40px; -webkit-line-clamp: 2; }
  .jq-dlgwrap .jq-dlgfoot .jq-btn { flex: 1 1 100%; }
}
.jq .jq-warn-text { color: var(--ds-warn-ink); }

/* ═══ Owner round (2): merged Status / where-it-stands cell, Due · open cell, parts on every view ═══ */
.jq .jq-c-st { display: flex; flex-direction: column; gap: 2px; }
.jq .jq-c-st .jq-chip + .jq-s1 { margin-top: 2px; }
.jq .jq-c-due { display: flex; flex-direction: column; }
.jq .jq-mats .jq-mut { font-size: var(--ds-text-sm); }
.jq .jq-row .jq-sub { flex-wrap: wrap; }
@media (max-width: 759px) {
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) { grid-template-areas: "site num" "st st" "tech tech" "mat mat" "due due" "go go"; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat { display: block; grid-area: mat; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat .jq-mats { display: block; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat .jq-mats > span { display: inline; }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat .jq-mats > span + span::before { content: " · "; color: var(--ds-ink-3); }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat::before { content: "Parts: "; color: var(--ds-ink-3); font-size: var(--ds-text-sm); }
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-due:not(:empty) { display: flex; grid-area: due; flex-direction: row; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; justify-content: flex-start; }
  .jq .jq-row > .jq-c-due:not(:empty)::before { content: none; }
}
.jq-dlgwrap .jq-offering { margin: 0 0 var(--ds-s-2); padding: 6px var(--ds-s-3); border-radius: var(--ds-r-md); background: var(--ds-st-route-bg); font-size: var(--ds-text-sm); line-height: 18px; color: var(--ds-ink); }
.jq-dlgwrap .jq-daylist { margin-top: var(--ds-s-2); font-size: var(--ds-text-sm); }
.jq-dlgwrap .jq-daylist > summary { cursor: pointer; color: var(--ds-action); font-weight: var(--ds-w-medium); padding: var(--ds-s-1) 0; }
.jq-dlgwrap .jq-daylist ul { margin: var(--ds-s-1) 0 0; padding: 0; list-style: none; }
.jq-dlgwrap .jq-daylist li { display: grid; grid-template-columns: 96px 150px minmax(0, 1fr); gap: var(--ds-s-3); padding: 4px 0; box-shadow: inset 0 -1px 0 var(--ds-hair); line-height: 18px; }
.jq-dlgwrap .jq-heldtag { font-style: normal; font-size: var(--ds-text-caps); font-weight: var(--ds-w-semi); color: var(--ds-ink-2); border: 1px dashed var(--ds-field); border-radius: var(--ds-r-sm); padding: 0 4px; }
@media (max-width: 759px) { .jq-dlgwrap .jq-daylist li { grid-template-columns: 80px minmax(0, 1fr); } .jq-dlgwrap .jq-daylist li > span:nth-child(2) { grid-column: 2; } .jq-dlgwrap .jq-daylist li > span:nth-child(3) { grid-column: 1 / -1; } }

/* ═══ Round 9 ═══ */
/* Work line stays one line: codes and "Contract" keep their size, the title gives way with "…". */
.jq .jq-row .jq-sub { flex-wrap: nowrap; overflow: hidden; }
.jq .jq-row .jq-sub .jq-tag, .jq .jq-row .jq-sub .jq-ctag { flex: none; }
.jq .jq-row .jq-sub .jq-wt { flex: 0 1 auto; min-width: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 759px) {
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat:empty { display: none; }
}
.jq-dlgwrap .jq-daylist li { grid-template-columns: 96px minmax(150px, 0.8fr) minmax(0, 2fr); }
.jq-dlgwrap .jq-note1 { margin-top: 2px; color: var(--ds-ink-2); }
.jq-dlgwrap .jq-note1 > summary { cursor: pointer; list-style: none; }
.jq-dlgwrap .jq-note1 > summary::-webkit-details-marker { display: none; }
.jq-dlgwrap .jq-note1 > summary::after { content: " Show note"; color: var(--ds-action); font-weight: var(--ds-w-medium); }
.jq-dlgwrap .jq-note1[open] > summary::after { content: " Hide note"; }
.jq-dlgwrap .jq-note1 > p { margin: 4px 0 0; white-space: pre-wrap; }
.jq-dlgwrap .jq-daylist li .jq-meta { display: block; }
.jq-dlgwrap .jq-daylist li b + .jq-meta { display: inline; }
.jq-dlgwrap .jq-daylist li > span:nth-child(2) { overflow-wrap: normal; }
.jq-dlgwrap .jq-dctx { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.jq-dlgwrap .jq-dlghead > div:first-child { min-width: 0; flex: 1 1 auto; }
.jq-dlgwrap .jq-daylist li > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; align-self: start; }

/* ═══ Owner 2026-10-21: job detail used too much space — three columns, no big indent, tight rhythm ═══ */
.jq .jq-ohead { padding: var(--ds-s-3) var(--ds-gutter) var(--ds-s-2); gap: var(--ds-s-3); }
.jq .jq-oname { font-size: var(--ds-text-md); line-height: 22px; }
.jq .jq-osub { margin-top: 0; font-size: var(--ds-text-sm); }
.jq .jq-oband, .jq .jq-oedit { padding: 0 var(--ds-gutter) var(--ds-s-2); }
.jq .jq-obody { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(240px, 300px); gap: var(--ds-s-5); padding: var(--ds-s-2) var(--ds-gutter) var(--ds-s-4); align-items: start; }
.jq .jq-omain { gap: var(--ds-s-4); }
.jq .jq-omats { min-width: 0; }
.jq .jq-osh { margin-bottom: 6px; }
.jq .jq-scope { font-size: var(--ds-text-sm); line-height: 19px; max-width: none; }
.jq .jq-scope p { margin: 0 0 6px; }
.jq .jq-scope h3 { margin: var(--ds-s-2) 0 2px; font-size: var(--ds-text-sm); }
.jq .jq-scope ol { margin: 0 0 6px; padding-left: 18px; }
.jq .jq-scope li { margin: 0 0 1px; }
.jq .jq-eq { margin: 0 0 6px; font-size: var(--ds-text-sm); line-height: 19px; }
.jq .jq-mtable { font-size: var(--ds-text-sm); line-height: 18px; max-width: none; }
.jq .jq-mtable td { padding: 4px var(--ds-s-2) 4px 0; }
.jq .jq-mtable th { padding-bottom: 4px; }
.jq .jq-mtable .q { width: 32px; padding-right: var(--ds-s-2); }
.jq .jq-mtable .pn { width: 110px; }
.jq .jq-mtable tr.g th { padding-top: var(--ds-s-2); }
.jq .jq-notes li { padding: 5px 0; font-size: var(--ds-text-sm); line-height: 19px; }
.jq .jq-oside { gap: var(--ds-s-2); }
.jq .jq-card { padding: var(--ds-s-3); border-radius: var(--ds-r-md); }
.jq .jq-card .jq-kv { grid-template-columns: 92px minmax(0, 1fr); gap: 3px var(--ds-s-2); font-size: var(--ds-text-sm); line-height: 18px; }
.jq .jq-addr { margin: 0 0 4px; font-size: var(--ds-text-sm); line-height: 18px; }
.jq .jq-contact { font-size: var(--ds-text-sm); }
.jq .jq-vlist li { padding: 2px 0; }
@media (max-width: 1100px) { .jq .jq-obody { grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); } .jq .jq-omats { grid-column: 1; } .jq .jq-oside { grid-row: 1 / span 2; grid-column: 2; } }
@media (max-width: 759px) { .jq .jq-obody { grid-template-columns: 1fr; padding: var(--ds-s-2) var(--ds-s-4) var(--ds-s-4); } .jq .jq-oside, .jq .jq-omats { grid-column: auto; grid-row: auto; } .jq .jq-ohead { padding-left: var(--ds-s-4); padding-right: var(--ds-s-4); } }
.jq .jq-oname { font-family: inherit; letter-spacing: var(--ds-track-tight); font-weight: var(--ds-w-semi); font-size: var(--ds-text-p-body); line-height: 22px; }

/* ═══ Round 12 ═══ */
.jq .jq-grid { column-gap: var(--ds-s-3); }
.jq .jq-oside .jq-partscard { order: -1; }
.jq .jq-oside { display: flex; flex-direction: column; }
.jq .jq-lastnote > summary { list-style: none; cursor: pointer; font-size: var(--ds-text-sm); line-height: 19px; }
.jq .jq-lastnote > summary::-webkit-details-marker { display: none; }
.jq .jq-lastnote .jq-clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.jq .jq-lastnote[open] > summary { display: none; }
.jq .jq-lastnote > p { margin: 0; font-size: var(--ds-text-sm); line-height: 19px; white-space: pre-wrap; }
.jq .jq-lastnote:not([open]) > summary::after { content: "Show all"; color: var(--ds-action); font-weight: var(--ds-w-medium); }
.jq .jq-so { font-size: var(--ds-text-caps); color: var(--ds-warn-ink); font-weight: var(--ds-w-semi); white-space: nowrap; }
@media (max-width: 759px) {
  /* Phone: the decision facts (parts, site, job) first, then scope, then materials. */
  .jq .jq-obody { display: flex; flex-direction: column; }
  .jq .jq-oside { order: 1; } .jq .jq-omain { order: 2; } .jq .jq-omats { order: 3; }
}

/* ═══ Round 13 ═══ */
/* A status name is never cut: it wraps. */
.jq .jq-c-st .jq-chip { white-space: normal; overflow: visible; text-overflow: clip; align-items: flex-start; }
.jq .jq-c-st .jq-chip .jq-dot { margin-top: 4px; }
.jq .jq-note-one { margin: 0; font-size: var(--ds-text-sm); line-height: 19px; }
.jq .jq-obody.noscope { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.45fr) minmax(240px, 300px); }
@media (max-width: 1100px) { .jq .jq-obody.noscope { grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); } }
.jq .jq-dl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .jq .jq-dl.past { color: var(--ds-ink); }
@media (max-width: 759px) {
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-mat.none::before { content: none; }
}
@media (max-width: 759px) {
  /* Status block stacks: status, visit/hold, due, open — one per line, same as narrow desktop. */
  .jq .jq-row:not(.jq-rgrid):not(.jq-ugrid) > .jq-c-st { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 2px; }
}