/* The [hidden] attribute means hidden, everywhere, whatever display the
   element also carries. The browser's own rule is `[hidden]{display:none}`
   with no !important, so a plain `display:flex` or `display:grid` in this
   stylesheet SILENTLY BEATS IT — and the element stays on screen while its
   JavaScript correctly sets `el.hidden = true`. That shipped twice: the guide
   pager was visible in Continuous mode from the day it shipped, under a
   document that explicitly does not page, and the search stepper inherited the
   same fault before anyone noticed. Neither raised an error anywhere.

   ~40 places in js/ write `el.hidden`; before this rule, 9 hand-written
   guards covered them. Guarding the attribute once removes the class of bug
   rather than the next instance of it. The per-element guards below are now
   redundant and harmless, and are kept where their comments explain history.

   Anything that must stay on screen must not carry the attribute. */
[hidden]{display:none!important}
*{box-sizing:border-box}html{color-scheme:light}html[data-theme="dark"]{color-scheme:dark}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{transition:.15s ease}.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) 1fr}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--mvta-green-dark),var(--mvta-green-deep));color:#fff;padding:20px 14px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;padding:4px 10px 24px;font-weight:700}.brand img{width:76px;height:auto}.brand span{font-size:15px}.nav-group{display:grid;gap:4px}.nav-button{width:100%;border:0;background:transparent;color:rgba(255,255,255,.78);display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;text-align:left;cursor:pointer}.nav-button:hover,.nav-button.active{background:rgba(255,255,255,.12);color:#fff}.nav-icon{width:22px;text-align:center}
.nav-section-label{margin:14px 0 6px 12px;font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:rgba(255,255,255,.4)}#primary-nav{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.25) transparent;margin:0 -4px;padding:0 4px}.sidebar-footer,.version-badge{flex-shrink:0}.sidebar-footer{margin-top:auto;padding:14px 12px;font-size:12px;color:rgba(255,255,255,.72);display:flex;gap:8px;align-items:center}.status-dot{width:8px;height:8px;border-radius:50%;background:#7ee2aa;box-shadow:0 0 0 4px rgba(126,226,170,.12)}
.version-badge{margin:0 12px 14px;border:0;background:rgba(255,255,255,.1);color:rgba(255,255,255,.75);font-size:10px;font-weight:700;letter-spacing:.3px;padding:5px 10px;border-radius:6px;cursor:pointer;text-align:left}
.version-badge:hover{background:rgba(255,255,255,.18);color:#fff}
.changelog-card{max-height:80vh}
.changelog-card header p{margin:2px 0 0;font-size:11px;color:var(--muted)}
.changelog-body{padding:18px 20px}
.changelog-entry{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.changelog-entry:last-child{margin-bottom:0}
.changelog-symbol{flex:none;width:20px;height:20px;border-radius:5px;display:grid;place-items:center;font-size:12px;font-weight:800;margin-top:1px}
.changelog-symbol.added{background:var(--status-approved-bg);color:var(--status-approved-text)}
.changelog-symbol.fixed{background:var(--danger-soft);color:var(--danger)}
.changelog-symbol.changed{background:var(--mvta-green-soft);color:var(--mvta-green)}
.changelog-symbol.flagged{background:var(--status-warning-bg);color:var(--status-warning-text)}
.changelog-symbol.info{background:var(--surface-2);color:var(--muted)}
.changelog-text{font-size:12.5px;line-height:1.55;color:var(--text)}
.changelog-text strong{font-weight:700}
.changelog-release{border:1px solid var(--border);border-radius:10px;margin-bottom:10px;background:var(--surface)}
.changelog-release:last-child{margin-bottom:0}
.changelog-release>summary{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 14px;cursor:pointer;font-size:13px;font-weight:700;border-radius:10px;list-style:none}
.changelog-release>summary::-webkit-details-marker{display:none}
.changelog-release>summary:hover{background:var(--surface-2)}
.changelog-release[open]>summary{border-bottom:1px solid var(--border);border-radius:10px 10px 0 0}
.changelog-release>summary .muted{font-size:11px;font-weight:600}
.changelog-release-name::before{content:"\25B8";display:inline-block;margin-right:8px;color:var(--muted);transition:transform .12s}
.changelog-release[open] .changelog-release-name::before{transform:rotate(90deg)}
.changelog-release.unreleased{border-color:var(--mvta-green)}
.changelog-release>.changelog-entry,.changelog-release>.changelog-group{margin:0}
.changelog-release>.changelog-entry:first-of-type{margin-top:14px}
.changelog-release>.changelog-entry{padding:0 14px 10px}
.changelog-group{margin-bottom:0;border-top:1px solid var(--border)}
.changelog-group:first-of-type{border-top:0}
.changelog-group>summary{padding:9px 14px;cursor:pointer;font-size:12px;font-weight:650;list-style:none}
.changelog-group>summary::-webkit-details-marker{display:none}
.changelog-group>summary:hover{background:var(--surface-2)}
.changelog-group>summary .muted{font-size:11px;font-weight:500;margin-left:6px}
.changelog-group>.changelog-entry{padding:0 14px 10px}
.changelog-group>.changelog-entry:first-of-type{padding-top:2px}
.changelog-text code{background:var(--surface-2);padding:1px 5px;border-radius:4px;font-size:11.5px}.status-dot.offline{background:#f1a264}.workspace{min-width:0}.topbar{height:84px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:5}.topbar h1{font-size:22px;margin:0}.topbar p{font-size:12px;margin:5px 0 0;color:var(--muted)}.topbar-actions{display:flex;align-items:center;gap:10px}.icon-button,.profile-button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;cursor:pointer}.icon-button{width:40px;height:40px}.profile-button{height:42px;padding:4px 10px 4px 5px;display:flex;align-items:center;gap:8px}.avatar{width:32px;height:32px;border-radius:8px;background:var(--mvta-green);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700}.profile-wrap{position:relative}.profile-caret{color:var(--muted)}.profile-menu{position:absolute;right:0;top:48px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:6px;min-width:140px}.profile-menu button{width:100%;border:0;background:transparent;color:var(--text);padding:9px 10px;text-align:left;border-radius:7px;cursor:pointer}.profile-menu button:hover{background:var(--surface-2)}.content{padding:26px 28px;outline:none}.hero{display:flex;justify-content:space-between;gap:24px;align-items:center;background:linear-gradient(135deg,var(--mvta-green-deep),var(--hero-to));color:#fff;border-radius:18px;padding:25px 27px;margin-bottom:22px}.hero h2{margin:0 0 7px;font-size:23px}.hero p{margin:0;color:rgba(255,255,255,.78);max-width:760px}.hero .eyebrow{font-size:10px;letter-spacing:1.4px;font-weight:800;color:rgba(255,255,255,.65);margin-bottom:9px}.hero-actions,.action-row,.form-actions{display:flex;gap:10px;align-items:center}.hero button,.primary{border:0;background:var(--mvta-orange);color:var(--accent-on-orange);padding:10px 15px;border-radius:9px;font-weight:700;cursor:pointer}.primary:not(.hero button){background:var(--mvta-green);color:var(--accent-text)}.secondary,.secondary-on-dark{border:1px solid var(--border);background:var(--surface);color:var(--text);padding:9px 14px;border-radius:9px;font-weight:650;cursor:pointer}.secondary-on-dark{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.25)!important}.small{padding:7px 10px;font-size:11px}.grid{display:grid;gap:16px}.stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.stat-card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.stat-card{padding:18px}.stat-card.clickable{cursor:pointer}.stat-card.clickable:hover{transform:translateY(-1px);border-color:var(--mvta-green)}.stat-label{color:var(--muted);font-size:12px}.stat-value{font-size:27px;font-weight:750;margin:8px 0 3px}.stat-note{font-size:11px;color:var(--mvta-green)}.two-col{grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr)}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:17px 18px;border-bottom:1px solid var(--border)}.panel-header h3{font-size:14px;margin:0}.panel-header p{font-size:11px;color:var(--muted);margin:4px 0 0}.panel-body{padding:18px}.list{display:grid;gap:12px}.list.compact{gap:8px}.list-item{display:flex;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);align-items:center}.button-row{width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer}.button-row:hover{border-color:var(--mvta-green)}.list-item strong{font-size:13px}.list-item small{display:block;color:var(--muted);margin-top:4px}.id-type{font-size:10px;font-weight:800;color:var(--mvta-green);width:40px}.mono{font-family:"SFMono-Regular",Consolas,monospace}.badge{align-self:flex-start;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:700;background:var(--surface-2);color:var(--muted);white-space:nowrap}.badge.success{background:var(--success-soft);color:var(--success)}.badge.warning{background:var(--warning-soft);color:var(--warning)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.status-badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:700;background:var(--surface-2);color:var(--muted);white-space:nowrap}.status-badge.success{background:var(--success-soft);color:var(--success)}.status-badge.warning{background:var(--warning-soft);color:var(--warning)}.status-badge.danger{background:var(--danger-soft);color:var(--danger)}.text-button{border:0;background:transparent;color:var(--mvta-green);font-size:12px;font-weight:700;cursor:pointer}.page-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.page-toolbar h2{margin:0 0 5px;font-size:20px}.page-toolbar p{margin:0;color:var(--muted);font-size:12px}.phase-badge{display:inline-block;font-size:10px;letter-spacing:1.2px;font-weight:800;text-transform:uppercase;color:var(--mvta-green);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:5px 11px}.filter-panel{padding:14px 16px;margin-bottom:16px}.filter-row{display:flex;align-items:end;gap:12px}.filter-row label,.form-grid label,.field{display:grid;gap:6px;font-size:11px;font-weight:700;color:var(--muted)}.filter-row input,.filter-row select,.form-grid input,.form-grid select,.form-grid textarea,.field input,.field select,.field textarea{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:9px 11px;outline:none}.filter-row input:focus,.filter-row select:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--mvta-green);box-shadow:0 0 0 3px color-mix(in srgb,var(--mvta-green) 16%,transparent)}.search-field{flex:1}.filter-count{margin-left:auto;color:var(--muted);font-size:12px;padding-bottom:10px}
.column-picker-wrap{position:relative}
.column-picker-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:10;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:10px;min-width:200px;display:grid;gap:2px}
.column-picker-panel label{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;font-size:12.5px;font-weight:600;color:var(--text);cursor:pointer}
.column-picker-panel label:hover{background:var(--surface-2)}
.column-picker-panel[hidden]{display:none}
.data-table th.sortable{cursor:pointer;user-select:none}.data-table th.sortable:hover{color:var(--text)}
.row-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:5px}
.doc-companion-list{display:grid;gap:6px;margin-bottom:10px}
.doc-companion-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;background:var(--surface-2);border-radius:8px;font-size:13px}
.doc-companion-add{display:flex;gap:8px;align-items:center}.doc-companion-add select{flex:1}
.companion-fieldset{border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-top:4px}.companion-fieldset legend{padding:0 6px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.doc-manage-footer{display:flex;align-items:center;gap:10px;padding:14px 19px;border-top:1px solid var(--border)}.footer-spacer{flex:1}.queue-list{display:grid;gap:12px}.queue-card{display:flex;justify-content:space-between;gap:24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}.queue-main h3{margin:5px 0 5px;font-size:15px}.queue-main>p{margin:0;color:var(--muted);font-size:12px}.detail-copy{margin-top:10px!important;line-height:1.5}.queue-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.8px;font-weight:800;color:var(--muted);display:flex;align-items:center;gap:7px}.kind-dot{width:7px;height:7px;border-radius:50%;background:var(--muted)}.kind-dot.request{background:var(--mvta-orange)}.kind-dot.output{background:var(--success)}.kind-dot.suggestion{background:#7357b7}.queue-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:13px;color:var(--muted);font-size:10px}.queue-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:16px}.queue-actions{display:flex;gap:7px}.form-panel{overflow:hidden}.form-section{padding:22px}.form-section+.form-section{border-top:1px solid var(--border)}.section-heading{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}.section-heading>span{width:26px;height:26px;border-radius:8px;background:var(--mvta-green-soft);color:var(--mvta-green-dark);display:grid;place-items:center;font-size:11px;font-weight:800}.section-heading h3{margin:1px 0 3px;font-size:14px}.section-heading p{margin:0;color:var(--muted);font-size:11px}.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:15px}.form-grid .full{grid-column:1/-1}.form-grid textarea,.field textarea{resize:vertical;line-height:1.5}.form-actions{justify-content:flex-end;padding:18px 22px;border-top:1px solid var(--border);background:var(--surface-2)}.form-message{padding:0 22px;font-size:12px}.form-message.success{color:var(--success);padding-bottom:14px}.form-message.error{color:var(--danger);padding-bottom:14px}.table-filters{padding:14px 16px;border-bottom:1px solid var(--border)}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;font-size:12px}.data-table th{color:var(--muted);text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;padding:11px 14px;background:var(--surface-2);border-bottom:1px solid var(--border)}.data-table td{padding:13px 14px;border-bottom:1px solid var(--border);vertical-align:top}.data-table td small{display:block;color:var(--muted);margin-top:5px;max-width:390px}.data-table tbody tr:hover{background:color-mix(in srgb,var(--mvta-green-soft) 42%,transparent)}.empty-page,.error-state,.loading-state{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:42px;text-align:center}.empty-page h2,.error-state h2,.loading-state h2{margin:0 0 8px}.empty-page p,.error-state p,.loading-state p{color:var(--muted);max-width:620px;margin:0 auto 18px;line-height:1.55}.empty-page .action-row,.error-state .action-row{justify-content:center}.empty-icon,.error-icon{width:52px;height:52px;border-radius:14px;background:var(--mvta-green-soft);color:var(--mvta-green);display:grid;place-items:center;margin:0 auto 15px;font-size:24px;font-weight:800}.error-icon{background:var(--danger-soft);color:var(--danger)}.loading-state.compact{border:0;box-shadow:none;padding:25px}.spinner{width:25px;height:25px;border:3px solid var(--border);border-top-color:var(--mvta-green);border-radius:50%;display:inline-block;animation:spin .8s linear infinite;margin-bottom:9px}
.spinner-inline{width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--mvta-green);border-radius:50%;display:inline-block;animation:spin .8s linear infinite;vertical-align:middle;margin-right:4px}@keyframes spin{to{transform:rotate(360deg)}}.empty-inline{text-align:center;color:var(--muted);font-size:12px;padding:14px}.empty-inline.large{padding:34px}.button-row:disabled,.primary:disabled,.secondary:disabled{opacity:.65;cursor:not-allowed}@media(max-width:1000px){.stats{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}}@media(max-width:760px){.app-shell{grid-template-columns:72px 1fr}.brand span,.nav-label,.sidebar-footer span:last-child{display:none}.brand img{width:46px}.nav-button{justify-content:center}.content{padding:18px}.topbar{padding:0 18px}.profile-button>span:not(.avatar){display:none}.hero,.page-toolbar,.queue-card{align-items:flex-start;flex-direction:column}.hero-actions{width:100%}.stats{grid-template-columns:1fr}.filter-row{align-items:stretch;flex-direction:column}.filter-count{margin:0;padding:0}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.queue-side{width:100%;align-items:flex-start}.table-filters{align-items:stretch}}

/* Sign-in gate — the brand panel and the sign-in column.
   Replaces the single centred card. The panel's greens are BRAND values, not
   theme surfaces: --mvta-green-deep is the one green the dark block does not
   override, so the panel reads the same in both themes and only the right-hand
   column follows --surface/--text/--muted. The old rules hard-coded #fff and
   #17201d on the card and were then overridden by a themed copy 940 lines
   further down; both are gone rather than one layered over the other. */
.auth-gate{position:fixed;inset:0;z-index:100;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);background:var(--surface);color:var(--text);overflow:auto}
.auth-gate[hidden]{display:none}

.auth-brand{box-sizing:border-box;padding:56px 56px 44px;display:flex;flex-direction:column;justify-content:space-between;gap:40px;color:#fff;background-color:var(--mvta-green-deep);background-image:radial-gradient(760px 520px at 12% 4%,rgba(65,123,104,.58),rgba(11,28,21,0) 70%),linear-gradient(160deg,#123328 0%,var(--mvta-green-deep) 62%,#071310 100%)}
.auth-brand-logo{width:118px;height:auto;display:block}
.auth-brand-body{display:flex;flex-direction:column}
.auth-brand-eyebrow{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#9dc4b4}
.auth-brand-head{margin:14px 0 0;font-size:clamp(25px,2.5vw,34px);line-height:1.2;font-weight:700;letter-spacing:-.6px;max-width:14em}
.auth-brand-list{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.auth-brand-list li{display:flex;align-items:flex-start;gap:13px;font-size:14px;line-height:1.5;color:#d7e7e0}
.auth-brand-list svg{width:19px;height:19px;flex-shrink:0;margin-top:1px;display:block;fill:none;stroke:#9dc4b4;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.auth-brand-foot{font-size:11.5px;color:#7fa494}

.auth-panel{box-sizing:border-box;padding:56px 72px;display:flex;flex-direction:column;justify-content:center;background:var(--surface)}
.auth-panel-inner{width:100%;max-width:340px}
.auth-panel h1{margin:0 0 10px;font-size:26px;font-weight:700;letter-spacing:-.4px;line-height:1.25}
#auth-message{margin:0;font-size:14px;line-height:1.6;color:var(--muted)}

/* A failed sign-in is its own region, never the standing invitation rewritten
   in muted grey — see services/auth-gate.js for what that cost. */
.auth-error{margin:18px 0 0;display:flex;align-items:flex-start;gap:11px;padding:13px 14px;border-radius:10px;background:var(--danger-soft);border:1px solid color-mix(in srgb,var(--danger) 30%,transparent)}
.auth-error[hidden]{display:none}
.auth-error svg{width:17px;height:17px;flex-shrink:0;margin-top:1px;display:block;fill:none;stroke:var(--danger);stroke-width:2.2;stroke-linecap:round}
.auth-error strong{display:block;font-size:13px;font-weight:700;color:var(--danger)}
.auth-error span{display:block;margin-top:4px;font-size:12.5px;line-height:1.55;color:var(--text)}
.auth-error code{display:block;margin-top:7px;font:11px/1.5 "SFMono-Regular",Consolas,monospace;color:var(--muted);overflow-wrap:anywhere}

.auth-button.primary{width:100%;margin:22px 0 0;min-height:48px;padding:12px 16px;border-radius:10px;font-weight:600;font-size:14.5px;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.auth-button .auth-ms-mark{width:17px;height:17px;flex-shrink:0;display:block}
.auth-button .auth-spinner{display:none;width:15px;height:15px;flex-shrink:0;box-sizing:border-box;border-radius:50%;border:2px solid color-mix(in srgb,var(--accent-text) 35%,transparent);border-top-color:var(--accent-text);animation:spin .8s linear infinite}
.auth-button.is-busy .auth-ms-mark{display:none}
.auth-button.is-busy .auth-spinner{display:block}
.auth-button[disabled]{opacity:.72;cursor:not-allowed}
.auth-help{margin:16px 0 0;font-size:12px;line-height:1.55;color:var(--muted)}

/* The panel is the first thing to go: it is context, the column is the task. */
@media(max-width:860px){
  .auth-gate{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .auth-brand{padding:32px 28px 26px;gap:20px}
  .auth-brand-head{margin-top:10px;font-size:22px;max-width:none}
  .auth-brand-list{display:none}
  .auth-panel{padding:36px 28px 44px;justify-content:flex-start}
  .auth-panel-inner{max-width:420px;margin:0 auto}
}
@media(max-width:560px){
  .auth-brand{padding:26px 22px 22px}
  .auth-brand-head{font-size:19px}
  .auth-panel{padding:30px 22px 36px}
}
/* A laptop window shorter than the panel's content: the list goes rather than
   the sign-in column being pushed below the fold. */
@media(max-height:620px){.auth-brand-list{display:none}}
@media(prefers-reduced-motion:reduce){.auth-button .auth-spinner,.spinner,.spinner-inline{animation-duration:2.4s}}


/* Phase 3 — durable document generation workspace */
.wizard-panel{overflow:hidden}.wizard-steps{list-style:none;display:grid;grid-template-columns:repeat(7,1fr);padding:0;margin:0;border-bottom:1px solid var(--border);background:var(--surface-2)}.wizard-steps li{position:relative;text-align:center;padding:15px 6px;color:var(--muted)}.wizard-steps li:not(:last-child)::after{content:"";position:absolute;top:29px;left:62%;right:-38%;height:2px;background:var(--border)}.wizard-steps li.done:not(:last-child)::after{background:var(--mvta-green)}.wizard-steps span{position:relative;z-index:1;width:28px;height:28px;border-radius:50%;border:2px solid var(--border);background:var(--surface);display:grid;place-items:center;margin:0 auto 6px;font-size:11px;font-weight:800}.wizard-steps small{font-size:9px;font-weight:700}.wizard-steps li.active{color:var(--mvta-green)}.wizard-steps li.active span,.wizard-steps li.done span{border-color:var(--mvta-green);background:var(--mvta-green);color:#fff}.wizard-body{padding:24px;min-height:470px}.wizard-actions{display:flex;align-items:center;gap:12px;padding:16px 22px;border-top:1px solid var(--border);background:var(--surface-2)}.wizard-actions .primary{margin-left:auto}.wizard-save-state{font-size:10px;color:var(--muted)}.form-grid label small,.field small{font-weight:400;line-height:1.4}.check-field{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:9px!important;color:var(--text)!important}.check-field input{width:auto!important}.review-grid{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr);gap:20px}.review-grid h3{margin:0 0 8px}.review-grid p{color:var(--muted);font-size:12px;line-height:1.5}.summary-list{display:grid;grid-template-columns:130px 1fr;gap:8px 12px;font-size:12px;margin-top:22px}.summary-list dt{color:var(--muted)}.summary-list dd{margin:0;font-weight:650}.payload-preview,.generated-output pre{margin:0;background:#15201c;color:#d8eee6;border-radius:12px;padding:18px;overflow:auto;max-height:520px;font:11px/1.55 "SFMono-Regular",Consolas,monospace;white-space:pre-wrap}.generation-run,.completion-card{text-align:center;padding:48px 24px}.run-orb,.completion-mark{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;margin:0 auto 18px;font-size:31px;font-weight:800;background:var(--warning-soft);color:var(--warning)}.run-orb.success,.completion-mark{background:var(--success-soft);color:var(--success)}.run-orb.danger{background:var(--danger-soft);color:var(--danger)}
.generation-run h2,.completion-card h2{margin:0 0 8px}.generation-run p,.completion-card p{max-width:720px;margin:0 auto 14px;color:var(--muted);line-height:1.55}.generation-run .action-row,.completion-card .action-row{justify-content:center;margin-top:22px}.inline-alert{padding:11px 13px;border-radius:9px;margin:15px auto;font-size:12px;max-width:760px}.inline-alert.compact{padding:7px 11px;margin:8px 0;font-size:11.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.inline-alert.compact .text-button{padding:0}.inline-alert.danger{background:var(--danger-soft);color:var(--danger);font-weight:650}.inline-alert textarea{display:block;width:100%;margin-top:6px}.lib-views{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:14px}.lib-view{border:0;background:transparent;color:var(--muted);padding:10px 12px 8px;font-weight:800;font-size:12px;border-bottom:2px solid transparent;cursor:pointer}.lib-view:hover{color:var(--text)}.lib-view.active{color:var(--mvta-green);border-bottom-color:var(--mvta-green)}.lib-matrix{margin-bottom:18px}.lib-matrix h4{margin:0 0 8px;font-size:13px;display:flex;align-items:center;gap:8px}.lib-matrix-table{table-layout:fixed}.lib-matrix-table th:first-child{width:22%}.lib-matrix-table td{vertical-align:top}.lib-matrix-table td small{display:block;font-weight:400;margin-top:3px}.lib-cell{font-size:11px}.lib-cell.filled{background:var(--success-soft)}.lib-cell.blocked{background:var(--warning-soft)}.lib-cell.gap{background:var(--danger-soft)}.lib-cell .lib-cell-name{display:block;font-weight:700;overflow-wrap:anywhere}.lib-cell em{display:block;margin-top:3px;font-style:normal;font-weight:800;font-size:10px;color:var(--warning)}.lib-cell .lib-gap{color:var(--danger)}.lib-cell .lib-na{color:var(--muted);opacity:.5}.lib-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:11px;color:var(--muted);padding-top:6px}.lib-legend span{display:flex;align-items:center;gap:6px}.lib-swatch{width:13px;height:13px;border-radius:4px;display:inline-block;border:1px solid var(--border)}.lib-swatch.filled{background:var(--success-soft)}.lib-swatch.blocked{background:var(--warning-soft)}.lib-swatch.gap{background:var(--danger-soft)}.lib-swatch.none{background:var(--surface-2)}.lib-trace small,.lib-dest-list small{display:block;margin-top:2px}.inline-alert .alert-rows small{display:block;margin-top:2px}.lib-dest-list strong{display:block}.lib-trace-head{margin:18px 0 7px;font-size:13px}.lib-trace{list-style:none;padding:0;margin:0}.lib-trace li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:11px;padding:9px 0;border-bottom:1px solid var(--border);align-items:start}.lib-trace li:last-child{border-bottom:0}.lib-trace b{display:grid;place-items:center;width:30px;height:24px;border-radius:7px;background:var(--success-soft);color:var(--success);font-size:11px}.lib-trace li.out b{background:var(--danger-soft);color:var(--danger)}.lib-dest-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.lib-dest-list li{border:1px solid var(--border);border-radius:9px;padding:9px 11px;font-size:12px}.lib-group{border:1px solid var(--border);border-radius:11px;margin-bottom:10px;overflow:hidden}.lib-group-head{width:100%;border:0;background:var(--surface-2);display:flex;align-items:center;gap:10px;padding:11px 13px;text-align:left;cursor:pointer;color:var(--text);flex-wrap:wrap}.lib-group-head:hover{background:var(--border)}.lib-group-head strong{font-size:12.5px}.lib-caret{color:var(--muted);width:11px;flex:0 0 11px}.lib-group .table-wrap{border-top:1px solid var(--border)}#lib-panel .filter-row{flex-wrap:wrap;margin-bottom:12px}#lib-chips:empty{display:none}.inline-alert .alert-rows{margin:9px 0 0;padding-left:17px}.inline-alert .alert-rows li{margin:5px 0}.inline-alert .alert-rows small{color:inherit;opacity:.8}.inline-alert textarea+button{margin-top:6px}.output-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:16px}.output-toolbar h3{margin:0 0 5px}.output-toolbar p{margin:0;color:var(--muted);font-size:11px}.generated-output{display:grid;gap:14px}.generated-output section{border:1px solid var(--border);border-radius:11px;overflow:hidden}.generated-output section h3{margin:0;padding:11px 14px;background:var(--surface-2);font-size:12px}.generated-output section pre{border-radius:0;background:var(--surface);color:var(--text);max-height:none}.modal-backdrop{position:fixed;inset:0;z-index:80;background:rgba(8,18,14,.62);display:grid;place-items:center;padding:20px}.modal-card{width:min(760px,100%);max-height:80vh;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 25px 80px rgba(0,0,0,.3)}.modal-card header{display:flex;justify-content:space-between;align-items:center;padding:17px 19px;border-bottom:1px solid var(--border)}.modal-card header h3{margin:0 0 4px}.modal-card header p{margin:0;color:var(--muted);font-size:10px}.modal-card header button{border:0;background:transparent;color:var(--text);font-size:25px;cursor:pointer}.modal-body{padding:14px}.draft-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:13px;border:1px solid var(--border);border-radius:10px;margin-bottom:9px}.draft-row small{display:block;color:var(--muted);margin-top:5px}.danger-text{color:var(--danger)}
@media(max-width:900px){.wizard-steps{grid-template-columns:repeat(4,1fr)}.wizard-steps li::after{display:none}.review-grid{grid-template-columns:1fr}.output-toolbar{align-items:flex-start;flex-direction:column}}@media(max-width:600px){.wizard-steps{grid-template-columns:repeat(2,1fr)}.wizard-body{padding:17px}.wizard-save-state{display:none}.draft-row{align-items:flex-start;flex-direction:column}}

/* Phase 4 — AI processing pipeline */
.pipeline-rail{margin-bottom:18px}.pipeline-rail ol{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;list-style:none;padding:0;margin:0}.pipeline-node{min-width:0}.pipeline-node>button,.pipeline-node>span{display:flex;align-items:center;gap:8px;width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--muted);font:inherit;text-align:left}.pipeline-node>button{cursor:pointer}.pipeline-node>button:hover{border-color:var(--brand)}.pipeline-node span span,.pipeline-node button span{width:24px;height:24px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:11px;font-weight:800}.pipeline-node b{font-size:11px}.pipeline-node.active>button{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 12%,transparent)}.pipeline-node.active span span,.pipeline-node.active button span,.pipeline-node.done span span,.pipeline-node.done button span{background:var(--brand);color:#fff}.pipeline-node.done{color:var(--text)}.pipeline-node small{display:block;font-size:9px;font-weight:800;color:var(--warning);margin-left:auto}
.pipe-context-bar{display:flex;gap:24px;padding:10px 16px;margin-bottom:14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);flex-wrap:wrap}
.pipe-context-bar>div{display:flex;flex-direction:column;gap:1px}
.pipe-context-bar span{font-size:9px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.pipe-context-bar strong{font-size:12.5px;font-weight:600}
.pipeline-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,310px);gap:18px;align-items:start}.pipeline-layout>*{min-width:0}.pipeline-card,.pipeline-timeline{min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:22px}.pipeline-card h2,.pipeline-timeline h3{margin:0 0 6px}.pipeline-card>p{color:var(--muted);margin-bottom:18px}.pipeline-timeline{position:sticky;top:82px}
.timeline-feed{position:relative;padding-left:4px;margin-top:14px}
.timeline-entry{position:relative;min-width:0;padding:0 0 18px 22px}.timeline-entry>div{min-width:0}
.timeline-entry:last-child{padding-bottom:0}
.timeline-entry::before{content:'';position:absolute;left:5px;top:16px;bottom:-2px;width:1px;background:var(--border)}
.timeline-entry:last-child::before{display:none}
.timeline-dot{position:absolute;left:0;top:2px;width:11px;height:11px;border-radius:50%;background:var(--muted);border:2px solid var(--surface)}
.timeline-entry.done .timeline-dot{background:var(--success)}
/* A step still running wears the shared AI ring (see .ai-ring). */
.timeline-entry.pending .timeline-dot{background:transparent;border:2px solid var(--run-track);border-top-color:var(--run-ink);animation:ai-spin 1s linear infinite}
@media(prefers-reduced-motion:reduce){.timeline-entry.pending .timeline-dot{animation:none;border-color:var(--run-ink);background:var(--run-soft)}}
.timeline-entry.milestone .timeline-dot{background:var(--brand)}
.timeline-entry strong{display:block;font-size:12.5px}
.timeline-entry strong em{font-style:normal;color:var(--muted);font-weight:600}
.timeline-entry small{display:block;color:var(--muted);margin-top:2px;font-size:11px;line-height:1.4;overflow-wrap:anywhere}.similarity-row>div{min-width:0}.similarity-row strong{overflow-wrap:anywhere}
/* padding + overflow:hidden because the label holds a FILENAME, and a Word
   document's name is typically one unbreakable token — underscores are not
   break opportunities. Centred flex items do not shrink below their content
   without min-width:0, so a name like
   SOP_OPR-077-00_Blackhawk_Park_Ride_Fixed_Route_Operations_DRAFT.docx pushed
   out of the dashed box in BOTH directions, across the sidebar on one side and
   past the panel edge on the other. Same failure as the canvas overflow: a
   centred flex child with nothing telling it to wrap or shrink. */
.drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:130px;margin-top:16px;padding:14px;border:2px dashed var(--border);border-radius:12px;background:var(--surface-2);cursor:pointer;text-align:center;overflow:hidden}.drop-zone input{position:absolute;opacity:0;pointer-events:none}.drop-zone span{font-weight:800;max-width:100%;min-width:0;overflow-wrap:anywhere;line-height:1.35}.drop-zone small{color:var(--muted);margin-top:6px;max-width:100%;min-width:0;overflow-wrap:anywhere}.analysis-report{white-space:pre-wrap;max-height:520px;overflow:auto;padding:18px;border-radius:10px;background:var(--surface-2);font:12px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace}.card-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.similarity-list{display:grid;gap:10px}.similarity-row{display:grid;grid-template-columns:auto 52px minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid var(--border);border-radius:10px;padding:12px;cursor:pointer}.similarity-row:hover{border-color:var(--brand)}.similarity-row small,.similarity-row strong{display:block}.similarity-row small{color:var(--muted);margin-top:3px}/* Score ring: the fill is a conic-gradient sweep of --pct (set inline from the
   real match score), with an inner disc punched out via ::before to leave a
   ring rather than a filled pie. Falls back to the flat soft fill if --pct is
   ever missing. */
.score-ring{position:relative;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--brand) calc(var(--pct,0)*1%),var(--brand-soft) 0);color:var(--brand);font-weight:900;font-size:12px}
.score-ring::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--surface)}
.score-ring>span{position:relative}.no-match{display:flex;gap:8px;align-items:center;margin-top:12px}.qa-check-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-bottom:18px}.qa-check{display:flex;gap:10px;border:1px solid var(--border);border-radius:10px;padding:12px}.qa-check>span{width:24px;height:24px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900}.qa-check.pass>span{background:var(--success)}.qa-check.fail>span{background:var(--danger)}.qa-check.warn>span{background:var(--warning)}.qa-check strong,.qa-check small{display:block}.qa-check small{color:var(--muted);margin-top:3px}.qa-conversation{display:grid;gap:12px}.qa-turn{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;padding:14px;border-radius:12px;background:var(--surface-2)}.ai-avatar{width:38px;height:38px;border-radius:10px;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:900}.qa-turn p{color:var(--muted);margin:4px 0 10px}.qa-turn textarea{width:100%;min-height:80px}
/* These sit outside .form-grid, so the shared control sizing never reaches
   them. A <select>'s min-content width is its longest option string, which
   is what pushed the answer column past the page and under the timeline. */
.qa-turn select,.qa-turn textarea,.qa-turn input{max-width:100%;box-sizing:border-box}
.qa-turn select{width:100%}
.qa-turn .qa-other-answer{width:100%;margin-top:8px}
/* flex items default to min-width:auto, same failure by a different route */
.qa-check>div{min-width:0}.pipeline-job{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;margin-bottom:14px;border:1px solid var(--brand);border-radius:12px;background:var(--brand-soft)}.pipeline-job.failed{border-color:var(--danger);background:var(--danger-soft)}.pipeline-job-icon{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-size:10px;font-weight:800}.pipeline-job.failed .pipeline-job-icon{background:var(--danger)}.pipeline-job-body{min-width:0;flex:1}.pipeline-job-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pipeline-job-heading strong{font-size:13px}.pipeline-job-body p{margin:4px 0 7px;color:var(--muted);font-size:12px;line-height:1.45}.pipeline-job-error{display:block;overflow-wrap:anywhere;color:var(--danger);font-size:11px}.pipeline-job-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}.pipeline-job-actions small{font-size:11px}.generation-contract{margin:18px 0;padding:14px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}.generation-contract h3{margin:0 0 3px;font-size:14px}.generation-contract p{margin:0;color:var(--muted);font-size:11px}.generation-contract dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 0}.generation-contract dl div{min-width:0;padding:9px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.generation-contract dt{font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}.generation-contract dd{margin:4px 0 0;font-size:12px;font-weight:700;overflow-wrap:anywhere}@media(max-width:650px){.generation-contract dl{grid-template-columns:1fr}}.label-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.label-row .text-button{text-transform:none;letter-spacing:0}.suggest-note{color:var(--accent);font-weight:600}
.source-upload-step{margin-top:22px;padding-top:20px;border-top:1px solid var(--border)}.source-upload-step .section-heading{margin-bottom:12px}.source-upload-step .section-heading>span,.pipeline-card>.section-heading>span{width:26px;height:26px;border-radius:8px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:11px;font-weight:800}.source-upload-step .section-heading h3,.pipeline-card>.section-heading h2{margin:1px 0 3px;font-size:15px}.source-upload-step .section-heading p,.pipeline-card>.section-heading p{margin:0;color:var(--muted);font-size:11px}.source-upload-hint,.source-notes-hint{display:block;margin-top:6px;color:var(--muted);font-size:11px}.source-upload-step .drop-zone{margin-top:0}
.source-status{margin-top:8px;padding:8px 10px;border-radius:8px;font-size:11px}.source-status.ready{background:var(--success-soft);color:var(--success)}.source-status.warning{background:var(--warning-soft);color:var(--warning)}.source-status.danger{background:var(--danger-soft);color:var(--danger)}.intake-field-group{display:flex;gap:8px;align-items:baseline;margin:0 0 12px;padding:9px 11px;border-radius:8px;background:var(--surface-2);font-size:11px}.intake-field-group strong{color:var(--text)}.intake-field-group span{color:var(--muted)}.source-context-heading{margin-top:18px}.notes-field{display:grid;gap:6px;font-size:11px;font-weight:700;color:var(--muted)}.notes-field textarea{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:9px 11px;resize:vertical;font:inherit}.intake-readiness{margin-top:18px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);font-size:11px}.intake-readiness strong{font-size:12px}.intake-readiness ul{display:flex;gap:14px;flex-wrap:wrap;list-style:none;padding:0;margin:8px 0}.intake-readiness li{color:var(--muted)}.intake-readiness li span{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:5px;border-radius:50%;background:var(--warning-soft);color:var(--warning);font-weight:800}.intake-readiness li.ready span{background:var(--success-soft);color:var(--success)}.intake-readiness p{margin:0;color:var(--muted)}.category-proposal{margin-bottom:0}.category-proposal.accepted{border-color:var(--success)}
.guided-intake-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;list-style:none;padding:0 0 18px;margin:0 0 20px;border-bottom:1px solid var(--border)}.guided-intake-steps li{display:flex;align-items:center;gap:7px;min-width:0;color:var(--muted);font-size:11px}.guided-intake-steps li span,.guided-intake-help-steps li span{display:grid;place-items:center;flex:0 0 25px;width:25px;height:25px;border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:11px;font-weight:800}.guided-intake-steps li.active{color:var(--brand);font-weight:800}.guided-intake-steps li.active span,.guided-intake-help-steps li.active span{background:var(--brand);color:#fff}.guided-intake-steps b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guided-intake-aside{position:sticky;top:82px}.guided-intake-aside>p{margin:18px 0 0;font-size:12px;line-height:1.5}.guided-intake-help-steps{display:grid;gap:0;list-style:none;padding:0;margin:14px 0 0}.guided-intake-help-steps li{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--border);color:var(--muted);font-size:12px}.guided-intake-help-steps li:last-child{border-bottom:0}.guided-intake-help-steps li.active{color:var(--brand);font-weight:800}
.source-analyze-row{margin-top:24px}.decomp-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:18px}.decomp-card{border:1px solid var(--border);border-radius:10px;padding:14px}
.decomp-card textarea{display:block;width:100%;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:9px 11px;outline:none;font:inherit;resize:vertical;line-height:1.5;margin-top:6px}
.decomp-card label small{display:block;margin-top:6px;color:var(--muted);font-size:11px}
.field-view>.label-row{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:6px}
.source-rendered{white-space:pre-wrap;max-height:340px;overflow:auto;padding:14px 16px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);font-size:13px;line-height:1.6;color:var(--text)}
.rendered-report{display:grid;gap:10px;max-height:520px;overflow:auto}
.rendered-report pre{white-space:pre-wrap;margin:0;font:12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text)}
.rr-section{border:1px solid var(--border);border-radius:9px;padding:10px 13px;background:var(--surface)}
.rr-section h4{margin:0 0 5px;font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--brand)}
.rr-body{font-size:12.5px;line-height:1.55;white-space:pre-wrap;color:var(--text)}.decomp-card.two{grid-column:1/-1}.decomp-card.warn{border-color:var(--status-warning-border);background:var(--status-warning-bg)}.decomp-card>span{display:block;font-size:11.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.decomp-card p{margin:0;font-size:13px;line-height:1.5}.decomp-card ul{margin:0;padding-left:18px;font-size:13px;line-height:1.6}.decomp-pills{display:flex;gap:8px;flex-wrap:wrap}.mini-table{width:100%;border-collapse:collapse;font-size:12px}.mini-table td{padding:6px 4px;border-bottom:1px solid var(--border);vertical-align:top}.companion-row{padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}.companion-row:last-child{border-bottom:0}.companion-row small{display:block;color:var(--muted);margin-top:2px}.qa-topic-group{margin-bottom:20px}.qa-topic-group h4{margin:0 0 10px;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}.qa-summary-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.qa-passed-details{margin-bottom:18px}.qa-passed-details summary{cursor:pointer;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--success);padding:4px 0}.qa-passed-details[open] summary{margin-bottom:10px}.qa-questions-heading{display:flex;align-items:center;gap:10px;margin:22px 0 12px}.qa-questions-heading h3{margin:0;font-size:15px}.chip-input{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:8px;background:var(--surface)}.chip-input input{border:0;outline:0;flex:1;min-width:180px;background:transparent;padding:4px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--brand-soft);color:var(--brand);border-radius:999px;padding:4px 6px 4px 10px;font-size:12px;font-weight:650}.chip button{border:0;background:none;color:inherit;cursor:pointer;font-size:14px;line-height:1;padding:0 2px}.check-inline{display:flex;align-items:flex-start;gap:8px;margin-top:8px;font-size:12.5px;line-height:1.45;cursor:pointer}.check-inline input{margin-top:2px;flex-shrink:0}.qa-turn.answered{box-shadow:inset 3px 0 0 var(--success)}.qa-turn.answered .ai-avatar{background:var(--success)}.qa-turn.compact{grid-template-columns:38px minmax(0,1fr) auto;align-items:center;padding:10px 14px}.qa-compact-text{min-width:0}.qa-compact-text strong{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.qa-compact-text small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
/* .qa-turn.compact is a 3-column grid; every trailing badge/button used to be
   a direct grid child, so a 4th one wrapped onto a second row and landed in
   the 38px avatar column. Collecting them into one flex cell keeps the row at
   exactly three children however many badges a question carries. */
.qa-compact-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:100%}
/* Cross-reference chip: Missing Information ⇄ Interactive QA. Deliberately
   low-contrast — it is a pointer to the same gap on the other screen, not a
   finding of its own. */
.badge.cross-ref-chip{font-weight:650;white-space:normal;cursor:help}
.badge.cross-ref-chip.addressed{background:var(--success-soft,var(--surface-muted));color:var(--success)}#qa-continue-note{color:var(--muted);align-self:center}.readiness-list{list-style:none;margin:20px 0;padding:0;display:grid;gap:2px;text-align:left}.readiness-list li{display:grid;grid-template-columns:26px 1fr;gap:12px;padding:12px 4px;border-bottom:1px solid var(--border)}.readiness-list li:last-child{border-bottom:0}.readiness-list li>span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff}.readiness-list li.ready>span{background:var(--success)}.readiness-list li.not-ready>span{background:var(--warning)}.readiness-list strong,.readiness-list small{display:block}.readiness-list small{color:var(--muted);margin-top:2px}.completion-mark.warn{background:var(--warning-soft);color:var(--warning)}
/* Readiness rows gained a third child (the "Go to step" deep-link on a failing
   check), so the grid needs an auto track — without it the button wraps onto
   its own line. Declared after the base rule so it wins on source order. */
.readiness-list li{grid-template-columns:26px 1fr auto;align-items:center}
.readiness-list li>button{justify-self:end}
/* Similarity match count + strongest-score hint above the results list. */
.similarity-count{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
/* Generate step 1 — the setup form's fields grouped into labelled cards.
   Presentation only: each card still contains a plain .form-grid, so every
   existing label/input/select rule applies unchanged. */
.setup-groups{display:grid;gap:14px}
/* Generate → Setup lays its four cards out 2x2 (design). Scoped to the wizard
   form on purpose: the Documents "Manage document" dialog reuses .setup-groups
   but its design keeps Classification and Approvals stacked full width. */
#generation-form .setup-groups{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
@media(max-width:900px){#generation-form .setup-groups{grid-template-columns:1fr}}
.setup-card{border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:14px 16px}
/* The Source card on the unified Generate stage: wide text panels, so it takes
   the whole row of the two-column grid rather than one narrow cell. */
#generation-form .setup-groups>.setup-card.span-all{grid-column:1/-1}
.setup-card>h4{margin:0 0 12px;font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
/* Read-only metric strips: Decomposition summary and Review & Confirm counts. */
.stat-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.stat-strip .pill{display:inline-flex;align-items:baseline;gap:6px;border:1px solid var(--border);background:var(--surface-2);border-radius:999px;padding:5px 12px;font-size:12px;color:var(--muted)}
.stat-strip .pill b{font-size:13px;font-weight:800;color:var(--text)}
.stat-strip .pill.warn b{color:var(--status-warning-text)}
/* Review & Confirm — tri-state Core / Companion / Exclude segmented control,
   replacing the old Include + Companion checkbox pair. Same underlying state;
   "Advanced…" still sits alongside it as the reason-capturing path. */
.tri-toggle{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.tri-toggle button{border:0;background:var(--surface);color:var(--muted);font-size:11.5px;font-weight:700;padding:6px 12px;cursor:pointer;border-right:1px solid var(--border)}
.tri-toggle button:last-child{border-right:0}
.tri-toggle button:hover{background:var(--surface-2);color:var(--text)}
.tri-toggle button.on{background:var(--brand-soft);color:var(--brand)}
.tri-toggle button.on:last-child{background:var(--status-warning-bg);color:var(--status-warning-text)}
/* "Changed" chip on a section the operator has moved off the AI's plan. */
.badge.changed{background:var(--status-pending-bg);color:var(--status-pending-text)}
/* Similarity: "Continue as a new document" is now the pinned first option, so
   it reads as a real choice rather than a footnote under the match list. */
.no-match{margin:0 0 10px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);cursor:pointer}
/* ── Review & Confirm, per the design screenshot ───────────────────────── */
/* Context bar keeps its field group left, pushes the actions right. */
.pipe-context-bar{justify-content:space-between;align-items:center}
.pipe-context-actions{margin-left:auto}
/* Inline muted qualifier next to the stage title. */
.h2-sub{font-size:12px;font-weight:600;color:var(--muted);margin-left:8px}
/* Destination keywords colour-keyed to the tri-toggle below them. */
.k-core{color:var(--brand)}
.k-comp{color:var(--status-pending-text)}
.k-excl{color:var(--muted)}
.review-contract{grid-column:1/-1;display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:14px 16px;border:1px solid var(--brand);border-radius:10px;background:var(--brand-soft)}
.review-contract strong{font-size:13px}.review-contract p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.review-progress{flex:none;padding:6px 9px;border-radius:999px;background:var(--surface);color:var(--brand);font-size:11px;font-weight:800;white-space:nowrap}
.review-counts{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.review-counts>div{padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2)}.review-counts b{display:block;font-size:20px}.review-counts span{display:block;margin-top:2px;color:var(--muted);font-size:10.5px;font-weight:700}
/* Open-required-gaps summary; points at the panel below, never navigates. */
.gaps-banner{grid-column:1/-1;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:12px 14px;border:1px solid var(--border);border-left:3px solid var(--status-warning-border);border-radius:10px;background:var(--surface-2)}
.gaps-banner p{margin:0;flex:1;min-width:220px;font-size:12.5px;line-height:1.5;color:var(--text)}
.gaps-banner strong{color:var(--status-warning-text)}
/* What the AI originally proposed, shown inline on each section row. */
.ai-hint{font-size:11px;color:var(--muted);white-space:nowrap}
/* Right column now stacks the timeline and the session card. */
.pipeline-aside{display:grid;min-width:0;gap:14px;align-content:start;position:sticky;top:82px}
/* The session card reuses .pipeline-timeline for its chrome, so neutralise
   that rule's sticky here — the aside as a whole is what sticks now. */
.pipeline-aside .pipeline-timeline{position:static;top:auto}
.session-card h3{margin:0 0 12px;font-size:14px}
.session-actions{display:grid;gap:8px;justify-items:stretch}
.session-actions button{width:100%;text-align:left}
/* Audit Stream day separators — a full-width row inside the same table so
   column alignment is untouched and the CSV export (which reads data, not the
   DOM) is unaffected. Mirrors the Activity Stream's day grouping. */
.day-group-row td{background:var(--surface-2);font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);padding:8px 10px}
.data-table tbody tr.day-group-row:hover td{background:var(--surface-2)}
/* ── Publish Document, per the design ─────────────────────────────────── */
/* Sections / Characters / Review markers / Companions, replacing the old
   definition list so the counts read at a glance. */
.pub-stats{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.pub-stat{flex:1 1 120px;min-width:110px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);padding:10px 14px}
.pub-stat span{display:block;font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.pub-stat b{display:block;font-size:22px;font-weight:800;margin-top:2px;color:var(--text)}
.pub-stat.warn b{color:var(--status-warning-text)}
/* Repeat count on a grouped review marker. */
.marker-count{flex:none;min-width:26px;text-align:center;font-size:10px;font-weight:800;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:2px 6px}
/* Publishing-pipeline completion bar above the checklist. */
.pub-progress{height:5px;border-radius:999px;background:var(--surface-3);overflow:hidden;margin-top:10px}
.pub-progress>div{height:100%;background:var(--accent);border-radius:999px;transition:width .2s ease}
/* A-Z jump strip for alphabetical reference tables (Glossary Terms). Letters
   with no entries are disabled rather than hidden, so the row doesn't reflow
   as the data changes. */
.letter-strip{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 12px}
.letter-btn{border:1px solid var(--border);background:var(--surface);color:var(--muted);border-radius:7px;min-width:26px;padding:4px 6px;font-size:11px;font-weight:700;cursor:pointer}
.letter-btn:hover:not(:disabled){border-color:var(--accent);color:var(--text)}
.letter-btn.active{background:var(--brand-soft);color:var(--brand);border-color:var(--brand-soft)}
.letter-btn:disabled{opacity:.35;cursor:default}
/* Inline reference-row editor. Rendered as a full-width row under the row it
   edits (refTableHtml emits a real table, so a card can't live in the tbody).
   Reuses .section-edit-form's label/control styling from the AI Pipeline. */
.ref-edit-row>td{background:var(--surface-2);padding:12px 10px}
.ref-edit-row .section-edit-form{display:grid;gap:10px}
.data-table tbody tr.ref-edit-row:hover>td{background:var(--surface-2)}
/* Manage-document cards lay their fields out three across, per the design.
   .full still spans the row, so the Comments textarea stays full width. */
.form-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.form-grid.cols-3>label.full,.form-grid.cols-3>label:has(textarea){grid-column:1/-1}
@media(max-width:900px){.form-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.form-grid.cols-3{grid-template-columns:1fr}}
/* "Changes are logged to the Audit Stream." sits left of the footer actions. */
/* No margin-right:auto here — the footer already has a .footer-spacer that
   pushes Cancel/Save right; adding a second push would split the row oddly. */
.doc-manage-footer .footer-note{font-size:11.5px;color:var(--muted)}
/* SharePoint folder picker in the Document Libraries dialog. */
.folder-picker{margin-top:-4px}
.folder-crumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 0}
.folder-crumbs code{flex:1;min-width:120px;font-size:11.5px;color:var(--muted)}
.folder-items{display:flex;flex-wrap:wrap;gap:6px;max-height:180px;overflow:auto;padding:8px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2)}
/* Publishing-pipeline phase tag (Render / Register / Publish / Finalize). */
.pipeline-list li{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
.step-group{font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
/* Review-marker rows: repeat count, the marker plus its cause, then Copy. */
.marker-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px 0;border-bottom:1px solid var(--border)}
.marker-row:last-child{border-bottom:0}
.marker-body code{display:block;font-size:11.5px;line-height:1.5;word-break:break-word}
.marker-body small{display:block;margin-top:4px;font-size:11px;color:var(--muted)}
/* Inline resolve editor. Reuses .section-edit-form (shared with the pipeline's
   missing-info and the glossary row editors) so all three inline editors stay
   visually identical; this only gives it room inside the marker row. */
.marker-body .section-edit-form{margin-top:8px}
.marker-row>.action-row{flex:none;align-items:flex-start}
/* Figure caption rows: thumbnail, the caption and where it came from, then the
   edit controls. Same three-column shape as .marker-row above, because they are
   the same kind of thing — a list of gaps with an inline editor each — but the
   first column holds a picture rather than a count, so it is sized rather than
   auto. The thumbnail is deliberately small and object-fit:contain: it is there
   to say WHICH figure, not to be looked at, and a screenshot cropped to fill
   would defeat that. */
.fig-caption-row{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--border)}
.fig-caption-row:last-child{border-bottom:0}
.fig-caption-thumb{width:96px;height:72px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:6px}
.fig-caption-body>small{display:block;margin-top:4px;font-size:11px;color:var(--muted)}
.fig-caption-current{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--text)}
.fig-caption-current.warn{color:var(--muted);font-style:italic}
.fig-caption-body .section-edit-form{margin-top:8px}
.fig-caption-row>.action-row{flex:none;align-items:flex-start}
.status-badge.tiny{font-size:10px;padding:1px 7px;vertical-align:middle}
@media (max-width:720px){
  .fig-caption-row{grid-template-columns:64px minmax(0,1fr)}
  .fig-caption-thumb{width:64px;height:48px}
  .fig-caption-row>.action-row{grid-column:2}
}
/* Companion APPs multi-select. */
.companion-picks{display:grid;gap:8px}
.companion-pick{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);cursor:pointer}
.companion-pick:hover{border-color:var(--accent)}
.companion-pick.on{border-color:var(--accent);background:var(--brand-soft)}
/* The parent's banner, following companions generated together (services/companion-batch.js). */
.companion-runs{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.companion-run{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;border-top:1px solid var(--border)}
.companion-run:first-child{border-top:0}
.companion-run .muted{color:var(--muted);font-variant-numeric:tabular-nums}
.companion-run.ready > span{color:var(--success)}
.companion-run.failed > span{color:var(--danger)}
.companion-pick strong{display:block;font-size:13px}
.companion-pick small{display:block;color:var(--muted);margin-top:2px;font-size:11.5px}
/* Publish rail: pipeline, then Publish, then Finalize — the real order of
   operations. Was a single .panel aside; now a plain stack of sibling panels
   so they don't nest borders inside one another. */
.publish-aside{display:grid;gap:14px;align-content:start}
.publish-aside .panel-body>.action-row{margin:0}
.publish-aside button[data-pub="publish"],.publish-aside button[data-pub="finalize"]{width:100%}
/* Which tokens actually drove a similarity score — shown under the department
   so the percentage beside it is explainable rather than opaque. */
.shared-terms{display:block;margin-top:2px;color:var(--muted);font-size:11px}
/* Generate provenance: inline chips on the toolbar row, replacing the
   full-width banner. Only the AI-Pipeline origin uses chips; the companion and
   intake-request variants stay as alerts since they carry a longer sentence. */
.prov-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.prov-label{font-size:12px;font-weight:800;color:var(--accent)}
.prov-chip{display:inline-flex;align-items:center;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:600}
.override-panel{text-align:left;border:1px solid var(--border);border-left:3px solid var(--status-warning-border);background:var(--surface-2);border-radius:12px;padding:16px;margin:16px 0}
.override-panel h4{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:var(--status-warning-text)}
.override-blocker-list{list-style:none;margin:0 0 14px;padding:0}
.override-blocker-list li{padding:6px 0;border-bottom:1px solid var(--border);font-size:12.5px}
.override-blocker-list li:last-child{border-bottom:0}
.override-blocker-list small{display:block;color:var(--muted);margin-top:2px}
.override-panel label{display:block;margin-bottom:12px;font-size:11px;font-weight:700;color:var(--muted)}
.override-panel select,.override-panel textarea{width:100%;margin-top:6px;border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:12.5px}
.sections-list,.missing-info-list{display:flex;flex-direction:column;gap:2px}
.section-row,.missing-info-row{border-bottom:1px solid var(--border);padding:12px 0}
.section-row:last-child,.missing-info-row:last-child{border-bottom:0}
.decision-key{margin:2px 0 12px;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);font-size:11.5px}.decision-key>strong{display:block;margin-bottom:6px;color:var(--text)}.decision-key>div{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);line-height:1.45}.decision-key b{color:var(--text)}.decision-key small{display:block;margin-top:7px;color:var(--muted);font-size:10.5px}
.section-row-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:4px}
.section-badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.section-meta-details{position:relative;color:var(--muted);font-size:10px}.section-meta-details summary{cursor:pointer;font-weight:700;list-style:none}.section-meta-details summary::-webkit-details-marker{display:none}.section-meta-details summary::before{content:'Info ';color:var(--brand)}.section-meta-details>div{position:absolute;right:0;top:22px;z-index:2;display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end;min-width:180px;padding:8px;border:1px solid var(--border);border-radius:8px;background:var(--surface);box-shadow:var(--shadow)}
.tri-toggle button[data-mode="core"],.tri-toggle button[data-mode="companion"],.tri-toggle button[data-mode="exclude"]{font-size:0}.tri-toggle button[data-mode="core"]::after{content:'Main document';font-size:11.5px}.tri-toggle button[data-mode="companion"]::after{content:'Companion';font-size:11.5px}.tri-toggle button[data-mode="exclude"]::after{content:'Exclude';font-size:11.5px}
.reorder-cell{display:flex;align-items:center;gap:2px}
.reorder-cell .text-button{padding:2px 6px;font-size:14px;line-height:1}
.reorder-cell .text-button:disabled{opacity:.3;cursor:default}
.section-gate-badge{font-size:10px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;border-radius:999px;padding:3px 8px;white-space:nowrap;background:var(--surface-2);color:var(--muted)}
.section-gate-badge.mismatch{background:var(--warning-soft);color:var(--warning)}
.badge.core{background:var(--surface-2);color:var(--muted)}
.badge.companion{background:var(--warning-soft);color:var(--warning)}
.estimate-badge{grid-column:1/-1;font-size:12px;font-weight:700;border-radius:8px;padding:8px 12px;border:1px solid var(--border);background:var(--surface-2);color:var(--muted)}
.estimate-badge.ok{background:var(--success-soft);color:var(--success);border-color:transparent}
.estimate-badge.warning{background:var(--warning-soft);color:var(--warning);border-color:transparent}
.tier-tag{display:inline-block;margin-left:8px;font-size:9px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:2px 7px}
.tier-tag.suggested{color:var(--mvta-orange-ink);border-color:var(--mvta-orange-ink);background:var(--surface)}/* On --surface Burnt Orange measures 4.84:1; on the page background it is
   4.44:1 and misses the floor. The fill is the fix — darkening the ink
   would mean inventing a colour the style guide does not have. */
.section-status-badge{font-size:10px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;border-radius:999px;padding:3px 9px;white-space:nowrap}
.section-row.applicable .section-status-badge{background:var(--status-approved-bg);color:var(--status-approved-text)}
.section-row.not-applicable .section-status-badge{background:var(--status-draft-bg);color:var(--status-draft-text)}
.section-row.suggested .section-status-badge{background:var(--status-pending-bg);color:var(--status-pending-text)}
.missing-info-row.resolved .section-status-badge{background:var(--status-approved-bg);color:var(--status-approved-text)}
.missing-info-row.flagged .section-status-badge{background:var(--status-pending-bg);color:var(--status-pending-text)}
.missing-info-row.open-required .section-status-badge{background:var(--status-warning-bg);color:var(--status-warning-text)}
.missing-info-row.open-optional .section-status-badge{background:var(--status-draft-bg);color:var(--status-draft-text)}
.section-row p,.missing-info-row p{margin:0 0 8px;font-size:12.5px;color:var(--muted);line-height:1.5}
.section-override-note{font-size:11.5px;color:var(--status-warning-text);background:var(--status-warning-bg);border-radius:8px;padding:8px 10px;margin-bottom:6px}
.section-edit-form{border:1px solid var(--border);border-radius:10px;padding:12px;margin-top:8px;background:var(--surface-2)}
.section-edit-form label{display:block;margin-bottom:10px;font-size:11px;font-weight:700;color:var(--muted)}
.section-edit-form select,.section-edit-form textarea{width:100%;margin-top:6px;border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:12.5px}
.missing-info-resolution{font-size:12px;background:var(--status-approved-bg);color:var(--status-approved-text);border-radius:8px;padding:8px 10px}
.missing-info-card{overflow:visible}
.missing-info-heading{position:sticky;top:76px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:4px 0 12px;background:var(--status-warning-bg)}
.missing-info-heading>div>span{font-size:11px;font-weight:800;letter-spacing:.35px;text-transform:uppercase;color:var(--status-warning-text)}
.missing-info-summary{margin:4px 0 0;font-size:11px;color:var(--status-warning-text)}
.missing-info-row{padding:10px 0}
.missing-info-row .action-row{gap:10px}
.missing-info-row .text-button{font-weight:700}
@media(max-width:700px){.missing-info-heading{top:58px;align-items:flex-start;flex-direction:column;gap:8px}}
.inline-alert.warning{background:var(--status-warning-bg);color:var(--status-warning-text)}
.inline-alert.success{background:var(--success-soft);color:var(--success)}
/* Neutral variant. For statements of fact that need no action — an alert with
   no variant class had no background at all, so "N images detected, all fine"
   had to borrow the amber warning styling and read as a problem. */
.inline-alert.info{background:var(--surface-2);color:var(--muted);border:1px solid var(--border)}
.validation-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.validation-category h4{margin:0 0 6px;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.readiness-list.compact li{padding:8px 4px}
.readiness-list li.unknown>span{background:var(--muted)}
.decision-audit{margin-top:14px;padding-top:14px;border-top:1px solid var(--border);text-align:left}.decision-audit h3{margin:0 0 3px;font-size:14px}.decision-audit .card-heading p{margin:0;color:var(--muted);font-size:11px}.decision-audit-grid{display:grid;grid-template-columns:1.25fr 1fr 1.25fr;gap:10px;margin-top:12px}.decision-audit-grid>div{min-width:0;padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.decision-audit-grid strong{display:block;font-size:11px}.decision-audit-grid strong span{float:right;color:var(--brand);font-size:16px}.decision-audit-grid ul{margin:7px 0 0;padding-left:17px;font-size:11px;line-height:1.45}.decision-audit-grid li{margin-bottom:4px}.decision-audit-grid li:last-child{margin-bottom:0}.audit-empty{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.45}.handoff-output{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.handoff-output h4{margin:0;color:var(--muted);font-size:10px;letter-spacing:.4px;text-transform:uppercase}
@media(max-width:760px){.decision-audit-grid{grid-template-columns:1fr}}

/* AI Pipeline hardening: keep the decision surface compact and make the
   similarity rows valid independent controls instead of nesting a link inside
   a radio label. */
.similarity-row{grid-template-columns:minmax(0,1fr) auto;cursor:default}
.similarity-choice{display:grid;grid-template-columns:auto 52px minmax(0,1fr);align-items:center;gap:12px;min-width:0;cursor:pointer}
.similarity-choice>span:last-child{min-width:0}
.similarity-row a{font-size:11px;white-space:nowrap}
.similarity-explainer{margin:0 0 12px!important;font-size:12px!important}
.qa-focus-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);font-size:12px}
.qa-focus-strip span{color:var(--muted)}
.qa-conversation{gap:10px}
.qa-turn.qa-cross-reference{background:var(--surface);border:1px dashed var(--border)}
.qa-linked-note{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:10px 12px;border:1px dashed var(--border);border-radius:9px;background:var(--surface-2);font-size:12px}.qa-linked-note strong{font-size:12px}.qa-linked-note span{color:var(--muted);flex:1;min-width:220px}.qa-check-addressed{background:var(--surface-2);border-style:dashed}.qa-check-addressed>span{background:var(--success)!important}.qa-check-addressed strong{color:var(--muted)}
.completion-mark.blocked,.completion-mark.advisory{background:var(--warning-soft);color:var(--warning)}
@media(max-width:650px){.similarity-row{grid-template-columns:minmax(0,1fr)}.similarity-row a{justify-self:start;margin-left:64px}.similarity-choice{grid-template-columns:auto 44px minmax(0,1fr);gap:8px}}
.doc-preview{border:1px solid var(--border);border-radius:12px;padding:24px;background:var(--surface);max-height:640px;overflow:auto}
/* Output step (design handoff): a header row carrying the ID, the facts and the
   three available actions, then the draft in its own scroll area. Replaces the
   earlier two-column draft+rail; .doc-preview stays because Publish Document
   still uses it. */
/* Files in SharePoint panel — the DOCX/PDF links, moved out of the Publishing
   Pipeline checklist so that list stays a progress list. Stacked so each link is
   its own row target rather than two links running together. */
/* Narrative callout (MVTA-STY-001 §2.6) in the reading preview. Mirrors the DOCX:
   colored left border, light fill, bold colored lead-in. Uses the guide's own hex
   values rather than theme tokens on purpose — the preview's job is to show what
   the printed document will look like, so it should not follow the app's theme.
   The border is 0.75pt because that is the DOCX's own w:sz="6" written in the same
   unit, not an approximation of it: at 2px the preview drew a rule about twice the
   weight Word prints, so the screen and the file disagreed about the one thing this
   element is made of. Every other rule line in the document system is 0.75pt too. */
.preview-callout{border-left:0.75pt solid #417B68;background:#F2F2F2;color:#3B3B3B;padding:8px 12px;margin:6px 0 10px}
.preview-callout strong{color:#417B68}
.preview-callout.caution{border-left-color:#C34B18}
.preview-callout.caution strong{color:#C34B18}
/* Required (§2.6, published to the governing rows 2026-09-27) — a mandatory
   action that is easy to miss, where missing it is NOT a safety, compliance or
   operational hazard. Dark Gray is also the table-border and secondary-label
   colour; §2.6 distinguishes a callout from that ordinary use by the shading,
   the border and the bold lead-in together. */
.preview-callout.required{border-left-color:#4F4F4F}
.preview-callout.required strong{color:#4F4F4F}
/* A variant nobody defined. Amber is this app's "unresolved" colour, and the
   point is that it can never be mistaken for a Note: the DOCX refuses to render
   this at all, so seeing it here means the draft cannot be uploaded until it
   is fixed. */
.preview-callout.unknown{border-left-color:#f5a623;border-left-style:dashed;border-left-width:2pt}
.preview-callout.unknown strong{color:#b06d00}
/* Governing document viewer, diff, and editor (Administration → Governing Documents).
   The diff colors are semantic rather than brand: red/green is what a reader expects
   from a diff, and using Brand Teal for "added" would be actively confusing next to
   teal headings. Backgrounds are tinted rather than solid so the text stays legible
   in both themes. */
/* Governing-document editor — per the approved Administration design: controls on
   the left, content on the right, actions pinned in a footer. Two columns because
   the content pane needs the height; stacking them pushed the actions off-screen
   on a 407 KB document. */
.modal-card.xwide{width:min(1060px,100%);max-width:1060px}
/* Confirmation dialog. Narrow on purpose: it asks one question, and a wide card
   makes a short question look like a form. */
/* The destructive variant lives with the other .primary theme rules further
   down — it has to out-specify `.primary:not(.hero button)`. */
.gd-subtitle{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0}
.gd-subtitle .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--muted)}
.gd-docname{font-size:13px;color:var(--text)}
.pill.gd-version{font-size:11px;padding:1px 8px;color:var(--brand);border-color:var(--brand)}
/* Brand-tinted rather than the grey .info default: this banner is reassurance
   ("nothing is written yet"), and the design treats it as such. Scoped to .gd-banner
   so .inline-alert.info keeps its neutral look everywhere else. */
.inline-alert.gd-banner{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px;background:var(--brand-soft);color:var(--text);border:1px solid color-mix(in srgb,var(--brand) 35%,transparent)}
.inline-alert.gd-banner strong{color:var(--brand)}
.gd-banner-icon{color:var(--brand)}
.gd-banner-icon{flex:0 0 auto;font-size:14px;line-height:1.4;opacity:.85}
.gd-split{display:grid;grid-template-columns:minmax(280px,1fr) minmax(0,1.35fr);gap:18px;align-items:start}
.gd-controls{display:grid;gap:14px;align-content:start}
.gd-content{display:grid;gap:6px;min-width:0}
.gd-content-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12px;font-weight:650}
.gd-textarea{width:100%;min-height:300px;resize:vertical}
/* Segmented scope control. Two mutually exclusive choices whose consequences differ
   a lot — a <select> hides that behind a click. */
.gd-seg{display:flex;gap:0;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--surface-2,rgba(127,127,127,.06))}
.gd-seg-btn{flex:1 1 0;padding:9px 12px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.gd-seg-btn:hover:not(:disabled):not(.active){color:var(--text)}
.gd-seg-btn.active{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--border)}
.gd-seg-btn:disabled{opacity:.45;cursor:not-allowed}
.gd-required{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#b3261e;background:rgba(179,38,30,.12);border-radius:4px;padding:1px 6px;margin-left:6px}
/* Actions pinned below the body so they never scroll away from a long document. */
.modal-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 19px;border-top:1px solid var(--border);background:var(--surface)}
.modal-actions .muted{font-size:12px}
@media (max-width:820px){ .gd-split{grid-template-columns:1fr} .gd-textarea{min-height:220px} }
@media (prefers-color-scheme: dark){ .gd-required{color:#ff7b72;background:rgba(255,123,114,.14)} }
:root[data-theme="dark"] .gd-required{color:#ff7b72;background:rgba(255,123,114,.14)}
:root[data-theme="light"] .gd-required{color:#b3261e;background:rgba(179,38,30,.12)}
/* Print/PDF document surface — the source html2canvas captures for renderPdfFromHtml.
   Deliberately NOT theme-aware: this is what gets filed in SharePoint, so it is always
   the §2.6 palette on white regardless of the operator's theme. Values restated from
   MVTA-STY-001 §2.6 rather than pulled from tokens, for the same reason. */
.doc-print-root,.doc-page{background:#fff;color:#3B3B3B;font-family:Arial,Helvetica,sans-serif;font-size:11pt;line-height:1.4}
.doc-page{padding:0 8px}
.doc-runhead{display:flex;justify-content:space-between;align-items:baseline;border-bottom:0.75pt solid #417B68;padding-bottom:4px;margin-bottom:14px;font-size:8pt;gap:12px}
.doc-runhead .doc-org{color:#417B68;font-weight:700;flex:none}
.doc-runhead .doc-runtitle{color:#4F4F4F;text-align:right;min-width:0}
/* §2.6 Rev 41: type line 18pt bold teal with 0pt after; title line 16pt #262626 with 10pt after. */
.doc-type-line{font-size:18pt;font-weight:700;color:#417B68;margin:0}
.doc-title-line{font-size:16pt;font-weight:700;color:#262626;margin:0 0 10pt}
/* A runbook's title block (RUNBOOK-RULES §3.0, runbookFront()): the companion
   line, audience pills and "What this covers" between the title and the metadata
   table. §2.6's palette only — body charcoal, Brand Teal, Light Gray. */
.doc-title-block:has(.doc-companion,.doc-pills,.doc-covers) .doc-title-line{margin-bottom:4pt}
.doc-companion{font-size:11pt;color:#3B3B3B;margin:0 0 4pt}
.doc-pills{display:flex;flex-wrap:wrap;gap:5pt;margin:0 0 5pt}
.doc-pill{display:inline-block;font-size:9pt;font-weight:700;color:#417B68;border:0.75pt solid #417B68;border-radius:999px;padding:1.5pt 7pt;line-height:1.3}
.doc-covers{font-size:11pt;color:#3B3B3B;margin:0 0 10pt;line-height:1.4}
.doc-covers-label{font-weight:700}
/* §4.0: the SOP section a step-group covers, under its heading. Dark Gray 9pt. */
.doc-source{font-size:9pt;color:#4F4F4F;margin:-6px 0 8px}
.doc-meta{border-collapse:collapse;width:100%;margin-bottom:12px;font-size:10pt}
.doc-meta th,.doc-meta td{border:0.25pt solid #4F4F4F;padding:3px 6px;text-align:left;vertical-align:top}
.doc-meta th{width:30%;font-weight:700;color:#424242;background:#fff}
.doc-meta td{color:#4F4F4F}
.doc-meta tr:nth-child(even) th,.doc-meta tr:nth-child(even) td{background:#F2F2F2}
/* §2.6 Table of Contents. No heading label above it — the guide is explicit that
   it needs none. Entries 10pt Gray (#4F4F4F), no hyperlink blue or underline; the
   three levels differ only in left indent, mirroring the DOCX's TOC1/TOC2/TOC3
   (0 / 220 / 440 twips = 0 / 11 / 22pt) so a subsection nests visibly under its
   parent instead of sitting flush with it.
   The dot leader is a bottom border on a flexed spacer rather than a repeated "."
   glyph: html2canvas rasterises this block, and a border renders identically at
   any capture scale where a run of periods reflows. .doc-toc-num is an EMPTY
   reserved gutter — only the PDF knows page numbers, and renderPdfFromHtml()
   draws them into this exact width (TOC_PAGE_COLUMN_CSS). */
.doc-toc{margin:0 0 14px}
.doc-toc ol{list-style:none;margin:0;padding:0}
.doc-toc li{display:flex;align-items:baseline;gap:4px;font-size:10pt;color:#4F4F4F;line-height:1.5}
.doc-toc li::after{content:"";flex:1 1 auto;border-bottom:0.75pt dotted #4F4F4F;transform:translateY(-3px)}
.doc-toc .doc-toc-label{flex:0 1 auto}
.doc-toc .doc-toc-num{flex:0 0 34px;order:3;text-align:right}
.doc-toc .doc-toc-l2{padding-left:11pt}
.doc-toc .doc-toc-l3{padding-left:22pt}
.doc-body h2{font-size:16pt}
.doc-body h3{font-size:14pt}
.doc-body h4{font-size:12pt}
.doc-body h2,.doc-body h3,.doc-body h4{color:#417B68;border-bottom:0.5pt solid #417B68;padding-bottom:2px;margin:10pt 0 5pt}
.doc-page table{border-collapse:collapse;width:100%;font-size:10pt;margin:6px 0}
.doc-page table th,.doc-page table td{border:0.125pt solid #4F4F4F;padding:3px 6px;text-align:left;vertical-align:top}
.doc-page table thead th{background:#417B68;color:#fff;font-weight:700;font-size:12pt}
.doc-page table tbody tr:nth-child(even) td{background:#F2F2F2}
.doc-page table tbody td:first-child{font-weight:700}
.doc-runfoot{display:flex;justify-content:space-between;border-top:0.75pt solid #417B68;padding-top:4px;margin-top:16px;font-size:8pt;color:#4F4F4F}
/* Figures in the DOCX are capped at 6in wide (MAX_IMAGE_WIDTH_IN); the PDF page is
   the same 6.5in text column, so cap at 100% and let height follow. break-inside
   keeps html2canvas's page slicing from cutting an image away from its caption. */
.doc-figure{margin:8pt 0 10pt;break-inside:avoid;page-break-inside:avoid}
.doc-figure img{display:block;max-width:100%;height:auto}
.doc-figure figcaption{font-size:10pt;font-style:italic;color:#4F4F4F;margin-top:3pt}
.govdoc-meta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:12px;color:var(--muted);font-size:12px}
.govdoc-content{max-height:52vh;overflow:auto;background:var(--surface-2,rgba(127,127,127,.08));border:1px solid var(--border);border-radius:6px;padding:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.mono-input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.5}
.diff-summary{display:flex;gap:8px;margin:10px 0 6px}
.diff-badge{font-family:ui-monospace,monospace;font-size:12px;font-weight:650;padding:2px 8px;border-radius:4px}
.diff-badge.add{color:#1a7f37;background:rgba(26,127,55,.14)}
.diff-badge.del{color:#b3261e;background:rgba(179,38,30,.14)}
.diff-view{max-height:46vh;overflow:auto;border:1px solid var(--border);border-radius:6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55}
.diff-row{display:flex;gap:8px;padding:0 8px;white-space:pre-wrap;word-break:break-word}
.diff-row.add{background:rgba(26,127,55,.12)}
.diff-row.del{background:rgba(179,38,30,.12)}
.diff-sign{flex:0 0 12px;color:var(--muted);user-select:none}
.diff-row.add .diff-sign{color:#1a7f37}
.diff-row.del .diff-sign{color:#b3261e}
.diff-text{flex:1 1 auto;min-width:0}
.diff-gap{padding:3px 8px;color:var(--muted);background:rgba(127,127,127,.07);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.hist-diff:empty{display:none}
.hist-diff{margin-top:8px}
@media (prefers-color-scheme: dark){
  .diff-badge.add,.diff-row.add .diff-sign{color:#4ac26b}
  .diff-badge.del,.diff-row.del .diff-sign{color:#ff7b72}
}
:root[data-theme="dark"] .diff-badge.add,:root[data-theme="dark"] .diff-row.add .diff-sign{color:#4ac26b}
:root[data-theme="dark"] .diff-badge.del,:root[data-theme="dark"] .diff-row.del .diff-sign{color:#ff7b72}
:root[data-theme="light"] .diff-badge.add,:root[data-theme="light"] .diff-row.add .diff-sign{color:#1a7f37}
:root[data-theme="light"] .diff-badge.del,:root[data-theme="light"] .diff-row.del .diff-sign{color:#b3261e}
.sharepoint-files{display:grid;gap:8px}
/* .file-link carries its own margin-top for the inline contexts it was written
   for; inside this grid the gap already spaces them, so it would double up. */
.sharepoint-files .file-link{margin-top:0}
.gen-output{display:grid;gap:14px}
.gen-output-head{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:flex-start}
.gen-output-head h3{margin:0;font-size:16px}
.gen-output-head small{display:block;margin-top:3px;color:var(--muted);font-size:11.5px}
.gen-output-doc{border:1px solid var(--border);border-radius:12px;padding:24px 26px;background:var(--surface);max-height:560px;overflow:auto}
/* The global .inline-alert centres itself in a 760px column, which is right for
   a page-level message but leaves this one floating mid-row. Here it belongs to
   the draft below it, so it runs the full width with a severity edge. */
.gen-output>.inline-alert{margin:0;max-width:none;border-left:3px solid currentColor}
/* Source step: the two large carried-over payloads collapse to a summary row so
   the fields that are actually editable on this step aren't buried under them. */
.source-panels{display:grid;gap:10px}
.source-panel{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.source-panel-head{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;padding:14px 16px}
.source-panel-title{min-width:0}
.source-panel-title strong{display:block;font-size:13px}
.source-panel-title small{display:block;margin-top:2px;color:var(--muted);font-size:11.5px}
.source-panel.open .source-panel-head{border-bottom:1px solid var(--border)}
.source-panel-body{padding:14px 16px;max-height:420px;overflow:auto}
.source-panel-body textarea{width:100%;box-sizing:border-box}
/* QA override reads as a decision that changes the document, not a neutral
   card — it writes explicit placeholders into the generated output. */
.decomp-card.qa-override-card{border-color:var(--status-warning-border);background:var(--status-warning-bg)}
.decomp-card.qa-override-card>span{color:var(--warning)}
/* Provenance pill, right edge of the page toolbar. */
.prov-pill-row{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px}
.prov-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:999px;background:var(--success-soft);color:var(--success);font-size:11.5px;font-weight:650}
.prov-pill-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:800}
.prov-pill-sub{color:var(--muted);font-weight:600}
@media(max-width:900px){.prov-pill-row{justify-content:flex-start}}
.preview-section{margin-bottom:16px}
.preview-section h2{font-size:18px;margin:22px 0 10px}
.preview-section h3{font-size:15px;margin:18px 0 8px}
.preview-section h4{font-size:13px;margin:14px 0 6px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.preview-section p{margin:0 0 10px;line-height:1.6;font-size:13px}
.preview-section ul,.preview-section ol{margin:0 0 10px;padding-left:22px;line-height:1.6;font-size:13px}
.preview-section.level-2,.preview-section.level-3{padding-left:16px;border-left:2px solid var(--border)}
.preview-flagged{background:var(--status-warning-bg);color:var(--status-warning-text);padding:1px 3px;border-radius:3px;font-weight:600}
.preview-resolved{color:var(--muted);font-style:italic}
/* A web or email address in the draft (inline-links.js). Body colour and underlined, as the DOCX's Hyperlink style and the PDF draw it. */
/* MVTA-STY-001 §2.6 "Hyperlinks": Brand Teal, as the DOCX and the PDF print it. */
.doc-link{color:#417B68;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
/* A phone number is never broken across two lines (phone-numbers.js). */
.doc-link[href^="tel:"]{white-space:nowrap}
.preview-table{width:100%;border-collapse:collapse;margin:0 0 14px;font-size:12px}
.preview-table th{background:var(--mvta-green);color:#fff;text-align:left;padding:8px 10px}
.preview-table td{padding:8px 10px;border-bottom:1px solid var(--border)}
.preview-table .preview-pending{background:var(--mvta-orange);color:var(--accent-on-orange);font-weight:700}
/* MVTA-STY-001 §2.6: a PENDING callout is an Orange label cell paired with an
   explanatory cell in Light Gray #F2F2F2 — no header row. Literal, like the
   other document-preview fills above: this is paper, not app chrome. */
.preview-table.preview-pending-callout td{background:#F2F2F2}
.preview-table.preview-pending-callout td.preview-pending{background:var(--mvta-orange);white-space:nowrap;width:1%}
.ai-review-body{padding:18px 20px}
.ai-review-note{margin:0 0 16px;color:var(--muted);font-size:12.5px;line-height:1.5}
.ai-review-section{margin-bottom:18px}
.ai-review-section h4{margin:0 0 10px;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.ai-review-list{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:2px}
.ai-review-list li{display:flex;justify-content:space-between;gap:12px;padding:8px 4px;border-bottom:1px solid var(--border);font-size:12.5px}
.ai-review-list li span{color:var(--muted)}
.ai-review-blocks{display:grid;gap:2px;margin-bottom:10px}
.ai-review-block{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--border)}
.ai-review-block small{display:block;color:var(--muted);margin-top:2px}
.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.template-card{text-align:left;border:1px solid var(--border);border-radius:10px;padding:14px;background:var(--surface);cursor:pointer}
.template-card:hover{border-color:var(--mvta-green);background:var(--mvta-green-soft)}
.template-card strong{display:block;margin-bottom:4px}
.template-card small{display:block;color:var(--muted);line-height:1.4}
.panel-note{color:var(--muted);font-size:12.5px;line-height:1.5;margin:0 0 6px}
.finalize-section h4{margin:0 0 12px;font-size:12px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}
.finalize-section select{width:100%;margin-top:6px;border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:13px}
.qrg-landing-cta{display:flex;align-items:center;gap:16px;width:100%;height:100%;text-align:left;padding:22px 24px;border:2px dashed var(--mvta-green);border-radius:14px;background:var(--mvta-green-soft);cursor:pointer}
.qrg-landing-cta:hover{background:var(--accent-soft)}
.qrg-landing-cta-icon{width:44px;height:44px;flex:none;border-radius:12px;background:var(--mvta-green);color:#fff;font-size:22px;font-weight:800;display:grid;place-items:center}
.qrg-landing-cta strong{display:block;font-size:15px}
.qrg-landing-cta small{display:block;color:var(--muted);margin-top:2px}
.qrg-landing-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.qrg-landing-item:last-child{border-bottom:0}
.qrg-landing-item strong{display:block;font-size:13px}
.qrg-landing-item small{display:block;color:var(--muted);margin-top:2px}
.page-heading .text-button{display:block;margin-bottom:8px}
@media(max-width:1050px){.pipeline-layout{grid-template-columns:1fr}.pipeline-timeline{position:static}.pipeline-aside{position:static;top:auto}.pipeline-rail ol{grid-template-columns:1fr 1fr}.qa-check-grid{grid-template-columns:1fr}}@media(max-width:650px){.pipeline-rail ol{grid-template-columns:1fr}.pipeline-card,.pipeline-timeline{padding:16px}.similarity-row{grid-template-columns:minmax(0,1fr)}.similarity-choice{grid-template-columns:auto 44px minmax(0,1fr);gap:8px}.similarity-row a{justify-self:start;margin-left:52px}}

/* Phase 5 — Publishing Pipeline */
.publish-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:18px;align-items:start}.summary-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}.summary-list div{padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-subtle)}.summary-list dt{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.summary-list dd{margin:5px 0 0;font-weight:700}.pipeline-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}.pipeline-list li{display:flex;align-items:center;gap:10px}.pipeline-dot{width:26px;height:26px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:var(--surface-subtle);border:1px solid var(--border);font-weight:700}.pipeline-dot.done{background:var(--success-soft);color:var(--success);border-color:transparent}.file-link{display:block;margin-top:14px;color:var(--brand);font-weight:650;text-decoration:none}.file-link.small{display:inline-block;margin-top:4px;font-size:12px}.action-row.wrap{flex-wrap:wrap}@media(max-width:900px){.publish-grid{grid-template-columns:1fr}.summary-list{grid-template-columns:1fr}}

/* Phase 6 — QRG Builder */
.qrg-workspace{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:18px;align-items:start}.qrg-builder-sidebar,.qrg-builder-main{display:flex;flex-direction:column;gap:18px}.qrg-meta-form{display:grid;gap:10px}.qrg-block-list{display:flex;flex-direction:column;gap:7px;max-height:370px;overflow:auto;margin-bottom:12px}.qrg-block-item{position:relative;display:grid;grid-template-columns:26px auto minmax(0,1fr);gap:8px;align-items:center;width:100%;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:8px;color:var(--text);cursor:grab}.qrg-block-item.selected{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 18%,transparent);background:var(--brand-soft)}.qrg-block-item strong,.qrg-block-item small{display:block}.qrg-block-item small{color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}.block-order{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--surface-muted);font-size:11px}.block-controls{display:flex;gap:4px}.block-controls i{font-style:normal;padding:3px 5px;border-radius:4px;background:var(--surface-muted)}.qrg-add-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.compact{padding:6px 8px;font-size:11px}.qrg-editor{min-height:150px}.editor-title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.ghost{background:transparent;border:0}.editor-image-preview{max-width:100%;max-height:220px;object-fit:contain;border:1px solid var(--border);border-radius:8px}/* `safe center` centres the page when it fits and falls back to start when it
   does not. Plain `center` on an overflowing flex item pushes it equally past
   BOTH edges, and scrollLeft cannot go negative — so the left 16px of the page
   was clipped and unreachable at any preview width under 612px + padding.
   The flex-start line first is the fallback for engines that drop `safe`, and
   left-aligned is the correct degradation anyway. The stylesheet already uses
   color-mix(), so modern-browser syntax is established here. */
.qrg-canvas-outer{background:#dfe4e2;padding:18px;overflow:auto;display:flex;justify-content:flex-start;justify-content:safe center}.qrg-page{--qrg-page-mark:#1f9d6c;/* editing marks drawn ON the page; one literal because v6.13.94 retired --mvta-green's old value and these five marks must stay one colour */width:612px;min-height:792px;background:#fff;color:#333;font-family:Arial,sans-serif;box-shadow:0 3px 18px rgba(0,0,0,.18);flex:none;display:flex;flex-direction:column}.qrg-c-header{background:#1B4D3E;color:#fff;padding:6px 12px;display:flex;justify-content:space-between;font-size:8px;font-weight:700}.qrg-c-title{background:#1B4D3E;color:#fff;padding:10px 12px}.qrg-c-title h2{font-size:18px;margin:0 0 7px}.qrg-c-pills{display:flex;gap:6px;flex-wrap:wrap}.qrg-c-pill{background:#2D6A4F;color:#fff;border-radius:12px;padding:3px 8px;font-size:7px;font-weight:700}.qrg-c-body{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px;flex:1 1 auto;min-height:0}.qrg-c-col{display:flex;flex-direction:column;gap:7px;min-width:0}.qrg-c-section{background:#1B4D3E;color:#fff;padding:4px 8px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.4px}.qrg-c-body-text,.qrg-c-bullet,.qrg-c-num-item{font-size:8px;line-height:1.45}/* pre-line, not pre: newlines in a body block must show as line breaks (a
   salvaged list joined with \n was collapsing into one run-on sentence), but
   long lines must still wrap inside the narrow column. */
.qrg-c-body-text{padding:0 4px;white-space:pre-line}.qrg-c-bullet{padding-left:14px;position:relative}.qrg-c-bullet:before{content:'•';position:absolute;left:5px}.qrg-c-numbered{counter-reset:qrgnum}.qrg-c-num-item{padding:2px 4px 2px 22px;position:relative}.qrg-c-num-item:before{counter-increment:qrgnum;content:counter(qrgnum);position:absolute;left:3px;top:1px;width:14px;height:14px;border-radius:50%;display:grid;place-items:center;background:#1B4D3E;color:#fff;font-size:7px;font-weight:700}.qrg-c-warning{background:#fffbea;border:1.5px solid #f5a623;border-radius:4px;padding:5px 8px}.warn-label{font-size:7px;color:#d27a00;font-weight:700;text-transform:uppercase}.warn-body{font-size:7.5px}.qrg-c-never{background:#fdecea;border-top:3px solid #7b1d1d;padding:5px 8px}.never-label{font-size:7px;font-weight:700;color:#7b1d1d}.never-item{font-size:7.5px;padding-left:12px;position:relative;color:#7b1d1d}.never-item:before{content:'✕';position:absolute;left:0}.qrg-c-info{background:#f0f7f5;border:1.5px solid #417b68;border-radius:4px;padding:5px 8px}.info-label{font-size:7px;font-weight:700;color:#1b4d3e}.info-item{font-size:7.5px}.qrg-c-quote{background:#f7faf8;border-left:3px solid #417b68;padding:6px 8px}.quote-text{font-size:8px;font-style:italic}.quote-attribution{font-size:6.5px;text-align:right;color:#666}.qrg-c-data{display:grid;grid-template-columns:1fr 1fr;gap:3px}.qrg-c-data-cell{background:#e8f4f0;padding:4px 6px}.dc-label{font-size:6px;font-weight:700;color:#1b4d3e}.dc-val{font-size:9px;font-weight:700}.qrg-c-table{width:100%;border-collapse:collapse;font-size:7px}.qrg-c-table th{background:#1b4d3e;color:#fff;padding:3px 5px}.qrg-c-table td{padding:3px 5px;border-bottom:1px solid #dbe9e4}.qrg-c-image img{display:block;width:100%;max-height:250px;object-fit:contain}.qrg-c-image-caption{font-size:6.5px;color:#666;font-style:italic}.qrg-c-image-empty{border:1px dashed #bbb;padding:12px;text-align:center;font-size:7px;color:#999}.qrg-c-footer{background:#417b68;color:#fff;padding:6px 10px;display:flex;justify-content:space-between;font-size:7px;font-weight:600}@media(max-width:1024px){.qrg-workspace{grid-template-columns:1fr}.qrg-builder-sidebar{display:grid;grid-template-columns:1fr 1fr}}@media(max-width:720px){.qrg-builder-sidebar{display:flex}.qrg-add-grid{grid-template-columns:1fr}.qrg-canvas-outer{justify-content:flex-start}}

/* Phase 7: administration, governance, batch, and audit */
.metric-grid.compact{grid-template-columns:repeat(4,minmax(150px,1fr));margin-bottom:16px}.subtab-bar{display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding-bottom:12px;margin-bottom:16px}.subtab{background:transparent;border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:7px 14px;font-weight:700}.subtab.active{background:var(--brand);border-color:var(--brand);color:#fff}
.admin-layout{display:grid;grid-template-columns:248px minmax(0,1fr);gap:0;align-items:stretch;overflow:hidden;padding:0}
.admin-rail{display:flex;flex-direction:column;gap:16px;border-right:1px solid var(--border);padding:22px 16px 24px 20px;background:var(--surface-2);min-height:660px}
.admin-rail:before{content:'Administration';display:block;order:-2;font-size:16px;font-weight:850;letter-spacing:-.02em;color:var(--text);margin:0 10px -8px}
.admin-rail:after{content:'Choose a control area. Actions and evidence stay together in the workbench.';display:block;order:-1;color:var(--muted);font-size:11px;line-height:1.45;margin:0 10px 2px}
.admin-rail-group{display:flex;flex-direction:column;gap:2px}
.admin-rail-group>span{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding:4px 10px;margin-top:4px}
.admin-rail-item{text-align:left;background:transparent;border:0;border-radius:8px;padding:8px 10px;font-size:13px;font-weight:650;color:var(--text);cursor:pointer}
.admin-rail-item:hover{background:var(--surface-2)}
.admin-rail-item.active{background:var(--brand);color:var(--accent-text);font-weight:800}
.admin-rail-item:focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 35%,transparent);outline-offset:2px}
#admin-content{min-width:0;padding:24px;background:var(--surface)}
#admin-content>.table-wrap{margin-top:2px}
@media(max-width:820px){.admin-layout{grid-template-columns:1fr}.admin-rail{flex-direction:row;flex-wrap:wrap;align-content:flex-start;border-right:0;border-bottom:1px solid var(--border);padding:16px;min-height:0}.admin-rail:before,.admin-rail:after{width:100%;margin-left:10px}.admin-rail-group{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px}.admin-rail-group>span{width:100%;margin-top:0}}.panel-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}.panel-toolbar.reftable-head{justify-content:space-between;align-items:center;margin-top:22px}.action-row.compact{gap:5px}.small{padding:5px 9px;font-size:11px}.danger{background:var(--danger,#b42318);color:#fff}.wrap-cell{white-space:normal;min-width:220px;max-width:520px}.modal-card.wide{max-width:900px}
.history-panel{padding:18px 20px}
.history-list{display:flex;flex-direction:column;gap:2px}
.history-row{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:12px 4px;border-bottom:1px solid var(--border)}
.history-row:last-child{border-bottom:0}
.history-row.current .history-version{color:var(--accent,var(--mvta-green))}
.history-version{font-family:"SFMono-Regular",Consolas,monospace;font-size:12.5px;font-weight:700;color:var(--muted)}
.history-detail div{font-size:12.5px}
.history-detail p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.4}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.detail-grid div{background:var(--surface-muted);border:1px solid var(--border);border-radius:10px;padding:12px}.detail-grid span{display:block;color:var(--text-muted);font-size:11px;text-transform:uppercase}.detail-grid strong{display:block;margin-top:5px}.admin-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.summary-card{border:1px solid var(--border);border-radius:14px;padding:18px;background:var(--surface)}.summary-card span{color:var(--text-muted)}.summary-card strong{display:block;font-size:30px;margin:10px 0}.health-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.health-card{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--border);border-radius:12px;padding:16px}.health-dot{width:11px;height:11px;border-radius:50%;margin-top:5px;background:#999}.health-dot.good{background:#2e7d32}.health-dot.warn{background:#ed7d31}.health-card p{color:var(--text-muted);margin-top:4px}.badge.neutral{background:var(--surface-muted);color:var(--text)}@media(max-width:900px){.metric-grid.compact,.detail-grid,.admin-card-grid,.health-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.metric-grid.compact,.detail-grid,.admin-card-grid,.health-grid{grid-template-columns:1fr}}
/* Decomposition help legend + suggested-section decisions + decomp report viewer (v6.9.56) */
.decomp-help{margin:2px 0 12px}
.decomp-help summary{cursor:pointer;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);padding:4px 0}
.decomp-help[open] summary{margin-bottom:8px}
.decomp-help ul{margin:0;padding-left:18px;font-size:12.5px;line-height:1.6;color:var(--text)}
.decomp-help li{margin-bottom:5px}
.decomp-help.gated-out-sections summary{color:var(--warning)}
.decomp-help.gated-out-sections p.muted{font-size:12.5px;line-height:1.6;margin:0 0 8px}
.section-meta-details{margin-left:2px}
@media(max-width:650px){.review-contract{display:block}.review-progress{display:inline-block;margin-top:10px}.review-counts{grid-template-columns:repeat(2,minmax(0,1fr))}.section-row-head{align-items:flex-start;flex-direction:column}.section-badges{justify-content:flex-start}.section-meta-details>div{left:0;right:auto;justify-content:flex-start}}
.section-row.suggested-rejected{opacity:.55}.section-row.needs-decision{border-left:3px solid var(--status-pending-text);padding-left:10px}.section-decision-prompt{margin:6px 0 0;font-size:12.5px}.review-counts>div.hot{border-color:var(--status-pending-text)}.review-counts>div.hot b{color:var(--status-pending-text)}
.modal-card .rendered-report{max-height:60vh;overflow:auto;padding:14px}
.doc-suggested-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--border);font-size:12.5px}
.doc-suggested-row:last-child{border-bottom:0}
.doc-suggested-row small{display:block;color:var(--muted);margin-top:2px}
/* The Resolve picker takes the whole width below its row rather than squeezing
   in beside the buttons — it carries a document list, so at the row's own width
   the IDs truncate to nothing. flex-basis over a block child because the row is
   a flex container and the picker is its third item. */
.doc-suggested-existing{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.doc-suggested-existing small{display:inline;margin:0;color:var(--text)}
.doc-suggested-resolve{flex-basis:100%;display:flex;gap:8px;align-items:center;margin-top:8px}
.doc-suggested-resolve select{flex:1;min-width:0}
/* Activity Stream quick-filter chips (added with the chip bar, but never
   given layout rules) — the container had no flex/gap, so the chip buttons
   and counts rendered cramped with only default browser spacing. Scoped to
   .activity-chips so the unrelated glossary tag-input .chip pill stays as-is. */
.activity-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.activity-chips .chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:6px 12px;border-radius:999px;font-size:12px;font-weight:650;cursor:pointer}
.activity-chips .chip.active{border-color:var(--mvta-green);color:var(--mvta-green)}
.activity-chips .chip-count{opacity:.65;margin-left:2px}
.subtab-row{display:flex;flex-wrap:wrap;gap:6px;padding:14px 16px;border-bottom:1px solid var(--border)}
.subtab-item{border:1px solid var(--border);background:var(--surface);color:var(--text);padding:7px 13px;border-radius:999px;font-size:12px;font-weight:650;cursor:pointer}
.subtab-item.active{background:var(--mvta-green);border-color:var(--mvta-green);color:#fff}
.reftable-search{padding:14px 16px 0}

/* Administration workbench: clearer navigation and editing affordances without
   changing the shared operational vocabulary used by the rest of the app. */
.admin-layout{border-radius:16px;background:var(--surface);box-shadow:var(--shadow)}
.admin-rail{background:var(--surface-2);gap:18px;padding:24px 16px 26px 20px}
.admin-rail:before{font-size:17px;letter-spacing:-.025em;margin-bottom:-6px}
.admin-rail:after{max-width:190px;margin-bottom:4px}
.admin-rail-group{gap:3px}
.admin-rail-group>span{margin-top:8px;padding:5px 10px;color:var(--muted)}
.admin-rail-item{position:relative;padding:9px 11px;border:1px solid transparent;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.admin-rail-item:hover{background:var(--surface);border-color:var(--border);transform:translateX(2px)}
.admin-rail-item.active{box-shadow:0 8px 18px color-mix(in srgb,var(--brand) 20%,transparent)}
.admin-rail-item[data-admin-tab="overridereasons"]{display:none}
#admin-content{padding:26px 28px;background:var(--surface)}
.panel-toolbar.filter-head{justify-content:space-between;align-items:center;gap:12px}.panel-toolbar.filter-head label{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;color:var(--muted)}.panel-toolbar.filter-head select{padding:5px 9px;font-size:12px}.panel-toolbar.filter-head .muted{font-size:12px;color:var(--muted)}
#admin-content .panel-toolbar.reftable-head{position:relative;margin:4px 0 14px;padding:0 0 12px;border-bottom:1px solid var(--border)}
#admin-content .panel-toolbar.reftable-head strong{font-size:15px;letter-spacing:-.01em}
#admin-content .data-table{border:1px solid var(--border);border-radius:12px;overflow:hidden}
#admin-content .data-table th{padding:12px 14px;background:var(--surface-3)}
#admin-content .data-table td{padding:14px}
#admin-content .data-table td:last-child{white-space:nowrap}
.admin-ref-modal{width:min(800px,100%);overflow:hidden}
.admin-ref-modal header{padding:20px 22px;background:var(--surface-2)}
.admin-ref-modal header h3{font-size:16px}
.admin-ref-modal header p{max-width:510px;line-height:1.45}
.admin-ref-modal .form-grid{padding:22px;gap:16px}
.admin-ref-modal .field-state{display:inline-flex;margin-left:7px;padding:2px 6px;border-radius:999px;background:var(--surface-3);color:var(--muted);font-size:9px;letter-spacing:.35px;text-transform:uppercase;vertical-align:middle}
.admin-ref-modal .locked-field input[readonly]{background:var(--surface-2);border-style:dashed;color:var(--muted);cursor:not-allowed}
.admin-ref-modal .field-help{font-size:10.5px;font-weight:500;line-height:1.45;color:var(--muted)}
.admin-ref-modal .admin-change-reason{padding-top:4px;border-top:1px solid var(--border)}
.admin-ref-modal .admin-change-reason textarea{min-height:68px}
.admin-form-error{margin:0;padding:10px 12px;border-radius:9px;background:var(--danger-soft);color:var(--danger);font-size:12px;line-height:1.45}
.admin-ref-modal footer{display:flex;align-items:center;gap:10px;padding:15px 22px;border-top:1px solid var(--border);background:var(--surface-2)}
.admin-ref-modal footer small{margin-right:auto;color:var(--muted);font-size:10.5px}
@media(max-width:820px){#admin-content{padding:20px}.admin-rail{padding:16px}.admin-rail-item:hover{transform:none}.admin-ref-modal .form-grid{padding:18px}.admin-ref-modal footer{align-items:flex-start;flex-wrap:wrap}.admin-ref-modal footer small{width:100%;margin-right:0}}

/* ── QRG block drag-and-drop (sidebar list + page preview) ────────────────────
   The reorder handlers previously added a .dragging class that had NO rule at
   all, so a drag produced zero visual feedback and read as broken. These rules
   supply the missing feedback plus an insertion indicator.
   Export safety: everything inside #qrg-canvas below is either :hover-only
   (html2canvas renders a detached clone and does not reproduce :hover) or
   carries data-export-hide (excluded via capture()'s ignoreElements). Neither
   can reach the exported PNG/PDF or the published SharePoint file. */
.qrg-block-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px}
.qrg-grip{color:var(--muted);font-size:13px;line-height:1;cursor:grab;user-select:none}
.qrg-block-item:active{cursor:grabbing}
.qrg-block-item.dragging{opacity:.45;border-style:dashed;background:var(--surface-2)}
/* Insertion line as a pseudo-element on the target row, not a floating node —
   the list is a max-height:370px scroller, so an absolutely positioned element
   would need scroll-aware measurement to stay put. */
.qrg-block-item.drop-before::before,.qrg-block-item.drop-after::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--drop-line);border-radius:2px}
.qrg-block-item.drop-before::before{top:-5px}
.qrg-block-item.drop-after::after{bottom:-5px}
/* Trailing drop zone — without it there is no way to drag a block to the end. */
.qrg-drop-end{min-height:10px;border-radius:8px;transition:min-height .12s ease,background .12s ease}
.qrg-drop-end.drop-into{min-height:34px;background:var(--brand-soft);border:1px dashed var(--drop-line)}
.qrg-move{font-style:normal;padding:3px 6px;border-radius:4px;background:var(--surface-muted);border:1px solid transparent;color:var(--text);font-size:12px;line-height:1;cursor:pointer}
.qrg-move:hover:not(:disabled){border-color:var(--border)}
.qrg-move:disabled{opacity:.35;cursor:default}
/* Canvas wrapper. Repeats .qrg-c-col's own flex/column/gap:7px exactly so it
   adds ZERO height — measureOverflow() divides #qrg-canvas scrollHeight by 792
   to compute the page count, and any extra height would corrupt the warning. */
.qrg-c-block{display:flex;flex-direction:column;gap:7px;position:relative}
.qrg-c-block:empty{min-height:10px}
.qrg-c-block:hover{outline:1px dashed color-mix(in srgb,var(--qrg-page-mark) 55%,transparent);outline-offset:2px}
.qrg-c-block.dragging{opacity:.45}
.qrg-c-block.drop-before::before,.qrg-c-block.drop-after::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--qrg-page-mark);border-radius:2px}
.qrg-c-block.drop-before::before{top:-5px}
.qrg-c-block.drop-after::after{bottom:-5px}
/* A divider renders nothing in the page itself, so it needs a visible proxy to
   be grabbable. data-export-hide keeps it out of the exported image. */
.qrg-c-colbreak{align-items:center;justify-content:center;padding:4px 8px;border:1px dashed color-mix(in srgb,var(--qrg-page-mark) 50%,transparent);border-radius:6px;color:var(--qrg-page-mark);font-size:9px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;cursor:grab}
.qrg-c-coldrop{display:grid;place-items:center;min-height:56px;padding:8px;border:1px dashed rgba(13,35,26,.18);border-radius:8px;color:#84968c;font-size:10px;text-align:center}
.qrg-c-coldrop.drop-into{border-color:var(--qrg-page-mark);color:var(--qrg-page-mark);background:color-mix(in srgb,var(--qrg-page-mark) 8%,transparent)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Motion is additive only — the dashed outline and insertion line above stay
   unconditional so the affordance never depends on animation being allowed. */
@media (prefers-reduced-motion: no-preference){
  .qrg-block-item{transition:opacity .12s ease,border-color .12s ease}
  .qrg-c-block{transition:opacity .12s ease}
}

/* ---- QRG builder UI pass (v6.9.118) --------------------------------------
   Helper text under a field, so the LABEL can stay short instead of carrying
   its own explanation ("Audience — comma separated"). */
.field-help{display:block;margin-top:4px;color:var(--muted);font-size:11px}
/* Effective date + Issued by sit side by side; collapses on narrow sidebars. */
.qrg-field-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* Column Break is structural, not content — full width, below the type grid. */
.qrg-add-break{grid-column:1/-1;width:100%;margin-top:6px}
/* Sidebar rows now lead with the block's CONTENT, which can be long. small
   already ellipsised; strong needs the same or a long summary breaks the grid. */
.qrg-block-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
/* The "add content to this section" nudge is a hint, not a drop target: no
   min-height, so it adds as little to the canvas as possible. Layout height
   still feeds measureOverflow()/fillPercent, which the tests re-baseline. */
.qrg-c-coldrop.compact{min-height:0;padding:4px 8px;font-size:9px}
.qrg-split-panel>.panel-body{display:grid;gap:12px}
.qrg-split-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.qrg-split-card h4{margin:6px 0 4px}.qrg-split-card p{margin:0 0 6px}.qrg-split-card small{display:block;color:var(--muted)}
.qrg-split-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:430px}
.qrg-split-existing{flex-basis:100%;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
@media(max-width:820px){.qrg-split-card{grid-template-columns:1fr}.qrg-split-actions,.qrg-split-existing{justify-content:flex-start}}
.qrg-empty-icon{font-size:26px;margin-bottom:6px}
.empty-inline.large strong{display:block;color:var(--text);font-size:14px;margin-bottom:4px}
.empty-inline.large p{margin:0}

/* Landing entry points sit side by side, as in the design. Single column on
   narrow viewports so neither card gets squeezed. */
.qrg-landing-ctas{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;align-items:stretch}
@media(max-width:820px){.qrg-landing-ctas{grid-template-columns:1fr}}

/* ---- QRG full-width bands (v6.9.125) -------------------------------------
   A band spans both columns. Same flex/column/gap:7px as .qrg-c-col so a
   block's own height is identical whether it sits in a band or a column. */
.qrg-c-band{display:flex;flex-direction:column;gap:7px;padding:10px 10px 0}
.qrg-c-band+.qrg-c-body{padding-top:7px}
.qrg-c-body+.qrg-c-band{padding:0 10px 10px}
/* Overview-style info band: bulleted, matching the reference guide. */
.qrg-c-band .info-item{padding-left:10px;position:relative}
.qrg-c-band .info-item:before{content:'\2022';position:absolute;left:0}
/* NEVER DO as a full-width strip: solid header bar over a two-up grid of
   pills, rather than the single-column list used inside a column. */
.qrg-c-band .qrg-c-never{background:transparent;border-top:0;padding:0}
.qrg-c-band .never-label{background:#7b1d1d;color:#fff;padding:4px 8px;font-size:8.5px;text-transform:uppercase;letter-spacing:.4px}
.qrg-c-band .never-items{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-top:6px}
.qrg-c-band .never-item{background:#fdecea;border:1px solid #f0c9c4;border-radius:4px;padding:5px 8px 5px 20px;font-weight:700}
.qrg-c-band .never-item:before{content:'\25cf';left:8px}
/* Span toggle in the block editor. */
.qrg-span-toggle{display:flex;align-items:flex-start;gap:8px;margin-bottom:10px;font-size:12px;color:var(--muted)}
/* The checkbox aligns to the first line of the label, not to the centre of a
   label that has grown a help line beneath it. */
.qrg-span-toggle input{margin-top:2px;flex:none}
.qrg-span-toggle>span{min-width:0}
.qrg-span-toggle input{accent-color:var(--brand)}

/* ---- QRG form fields (v6.9.125) ------------------------------------------
   `.field` is used only by qrg.js's field()/fieldBtn()/area() helpers and had
   NO rule anywhere, so it fell back to a default display:inline <label> --
   label and input rendered side by side, and the pair grid then overflowed the
   sidebar and clipped the Suggest buttons. Only the fields built with
   .label-row stacked, and only because that class happens to be flex.
   Mirrors the existing .form-grid label convention rather than inventing one. */
.field{display:grid;gap:6px;font-size:11px;font-weight:700;color:var(--muted);min-width:0}
/* min-width:0 on the controls too: grid and flex items default to min-content,
   which is what let a long value push past the panel edge instead of shrinking. */
.field>input,.field>select,.field>textarea{width:100%;min-width:0;font-weight:400;color:var(--text)}
.field>.field-help{font-weight:400;margin-top:0}
.qrg-field-pair>*{min-width:0}
.qrg-readiness{border:1px solid var(--border);border-radius:9px;background:var(--surface-2);padding:9px 12px;margin:10px 0;font-size:12px}.qrg-readiness summary{display:flex;align-items:center;gap:9px;cursor:pointer;list-style:none}.qrg-readiness summary::-webkit-details-marker{display:none}.qrg-readiness-body{padding:8px 2px 0;color:var(--muted);line-height:1.45}.qrg-readiness-body ul{margin:0;padding-left:20px}.qrg-readiness-body li+li{margin-top:4px}
.qrg-workspace{grid-template-columns:minmax(230px,280px) minmax(0,1fr) minmax(250px,310px)}
.qrg-issuance-rail{display:flex;flex-direction:column;gap:14px;position:sticky;top:18px;min-width:0}
.qrg-rail-heading{display:grid;gap:2px;padding:2px 4px 0;text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--text-muted)}
.qrg-rail-heading strong{font-size:13px;color:var(--text)}
.qrg-issuance-rail .qrg-readiness{margin:0}
.qrg-issuance-rail .panel{margin:0}
.qrg-builder-main .qrg-live-preview-panel{order:-1}
/* 1025-1200px: stay THREE columns so the Block editor keeps sitting beside the
   live preview. This band used to collapse to two and send the rail full width
   BELOW the preview — measured at 1150px, the editor landed 1818px down, a
   page and a half from the page it edits, and 1200px is an ordinary laptop
   width. The columns tighten instead; the canvas is a fixed 612px Letter page
   in an overflow-x:auto container, so a narrower preview column scrolls rather
   than breaking, which it already did at 1280px.
   The sidebar floor stays at 250px: below that the Content blocks region rows
   overflow their own column (measured — 110px columns collapsed a row to 18px
   around 51px of content). */
@media(max-width:1200px){.qrg-workspace{grid-template-columns:minmax(250px,280px) minmax(0,1fr) minmax(230px,270px)}}
/* Below 1025px there is no room for three; the rail returns to a full-width row
   and the sidebar goes two-up. Was 1100px, which cut into the three-column
   range above. */
@media(max-width:1024px){.qrg-workspace{grid-template-columns:1fr}.qrg-builder-sidebar{display:grid;grid-template-columns:1fr 1fr}.qrg-issuance-rail{grid-column:auto;display:grid;grid-template-columns:1fr 1fr;align-items:start}.qrg-rail-heading{grid-column:1/-1}
  /* Stacked, the editor lands after the preview, and a full 792px Letter page
     put it ~1018px down — a page away from the thing it edits. Capping the
     page's WINDOW (not the page) brings it within one screen; the container
     already scrolls, so nothing is hidden, and 320px is a floor so a short
     viewport does not reduce the preview to a sliver. This caps the container
     only: capture() renders #qrg-canvas itself, which keeps its full height,
     so PNG, PDF and Publish are unaffected. */
  .qrg-canvas-outer{max-height:max(320px,60vh);overscroll-behavior:contain}}
@media(max-width:720px){.qrg-builder-sidebar{display:flex}.qrg-issuance-rail{display:flex;position:static}.qrg-rail-heading{padding-left:0}}
@media print{
  /* Printing the BUILDER screen (not the guide — that goes through capture()).
   This was a 34%/1fr split, which left the main column narrower than the fixed
   612px Letter canvas, and print sets overflow:visible, so the preview bled off
   the right edge of the sheet instead of scrolling. One column gives the page
   the full printable width: 612px canvas + 20px container padding = 632px,
   inside the ~739px a Letter sheet leaves at default margins. */
.qrg-workspace{grid-template-columns:1fr!important;align-items:start}
  .qrg-builder-sidebar{grid-column:1;display:flex!important}
  .qrg-builder-main{grid-column:2;min-width:0}
  .qrg-issuance-rail{grid-column:1/-1;position:static;display:grid;grid-template-columns:1fr 1fr;order:3}
  .qrg-rail-heading{grid-column:1/-1}
  .qrg-canvas-outer{overflow:visible;padding:10px;max-height:none}
  .qrg-builder-main .qrg-live-preview-panel{order:-1}
}
/* A long Suggest label wraps under its field name rather than being clipped. */
.label-row{flex-wrap:wrap}

/* ---- QRG "Generate with AI" picker (v6.9.126) ----------------------------
   Replaces an unfiltered list that showed only ID + title. The registry grows
   without bound, so search and a live count are the difference between usable
   and not. */
.modal-sub{margin:2px 0 0;color:var(--muted);font-size:12px;font-weight:400}
.qrg-pick-tabs{display:flex;gap:8px;margin-bottom:14px}
.qrg-pick-tab{padding:8px 16px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);font-size:12.5px;font-weight:700;cursor:pointer}
.qrg-pick-tab.active{background:var(--brand);border-color:var(--brand);color:#fff}
.qrg-pick-searchrow{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.qrg-pick-searchrow input{flex:1;min-width:0}
.qrg-pick-searchrow .muted{flex:none;font-size:12px;color:var(--muted)}
/* Bounded so the footer CTA stays reachable without scrolling the modal. */
.qrg-pick-list{display:flex;flex-direction:column;gap:8px;max-height:min(46vh,420px);overflow:auto}
.qrg-pick-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;width:100%;text-align:left;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);cursor:pointer}
/* A group heading and its one-line rule for what is in it. The old list was one
   undifferentiated run of every SOP, which is the whole point of these. */
.qrg-pick-group{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.qrg-pick-group:last-child{margin-bottom:0}
.qrg-pick-group h4{display:flex;align-items:baseline;gap:8px;margin:0;font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--text)}
.qrg-pick-group h4 span{font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.qrg-pick-group:first-child h4{color:var(--brand)}
.qrg-pick-task{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--brand) 35%,transparent);background:var(--brand-soft);border-radius:10px}
.qrg-pick-task .qrg-pick-main{flex:1}
.qrg-pick-task button{flex:none}
.qrg-pick-chip{flex:none;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:700;background:var(--surface-2);color:var(--muted);white-space:nowrap}
.qrg-pick-chip.warn{background:var(--warning-soft);color:var(--warning)}
/* Offered, but it would ground nothing yet (ADR 0022 keeps it pickable). Muted
   rather than disabled: the row is a choice somebody may legitimately make. */
.qrg-pick-row.ungrounded .qrg-pick-main strong{color:var(--muted)}
.qrg-pick-row:hover{border-color:var(--brand)}
.qrg-pick-row.selected{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 20%,transparent)}
.qrg-pick-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700;color:var(--muted)}
.qrg-pick-main{min-width:0}
.qrg-pick-main strong{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrg-pick-main small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.qrg-pick-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 19px;border-top:1px solid var(--border)}
.qrg-pick-doc p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 14px}

/* ---- QRG AI review: grouped by proposed section (v6.9.128) ---------------
   The list used to be a flat wall where the TYPE was the headline and the
   content was small grey text. Content now leads and the type is a .badge. */
.ai-review-group{border:1px solid var(--border);border-radius:10px;margin-bottom:12px;overflow:hidden}
.ai-review-group-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--border)}
.ai-review-group-head.plain{background:transparent;border-bottom:0;padding-bottom:0}
.ai-review-group-head>div{display:flex;align-items:center;gap:8px;min-width:0}
.ai-review-group-head strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-review-group .ai-review-blocks{margin:0;padding:0 12px}
.ai-review-group .ai-review-block:last-child{border-bottom:0}
/* minmax(0,1fr) is what lets the text column shrink; a bare 1fr floors at
   min-content and forced the action button to wrap to "Add to / guide". */
.ai-review-block{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.ai-review-block-main{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
/* Clamp in CSS, not JS — the full text stays in the DOM and in the tooltip
   rather than being truncated away before it is ever rendered. */
.ai-review-block-main strong{font-weight:600;font-size:12.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-width:0}
.ai-review-block-actions{display:flex;align-items:center;gap:6px;white-space:nowrap}
.ai-review-block-actions .icon-button.small{width:26px;height:26px;font-size:14px;line-height:1;display:grid;place-items:center}
/* Document relationship workspace */
.relationship-workspace { padding: 24px; }
.relationship-upload { border: 1px dashed var(--border-strong, #aab8b2); border-radius: 10px; padding: 16px; background: var(--surface-2); }
.relationship-upload input { margin-top: 8px; }
.relationship-results { margin-top: 20px; padding: 24px; }
/* The workspace is laid out around the RESULTS once there are any (v6.15.x).
   Before this the form stayed full width and full height at the top — a 14-row
   textarea between the operator and the work they came to do — so the first
   card sat below the fold on every screen. The form is never removed, only
   narrowed and collapsed: readForm() reads it by FormData from
   #relationship-form, so a field out of the DOM is a lost draft identity. */
.rel-layout { display: grid; gap: 16px; align-items: start; }
.rel-layout.has-results { grid-template-columns: minmax(280px, 330px) minmax(0, 1fr); }
.rel-layout.has-results .relationship-workspace { padding: 18px; position: sticky; top: 16px; }
.rel-layout.has-results .form-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.rel-source-details > summary { cursor: pointer; font-size: 11px; font-weight: 700; color: var(--muted); padding: 6px 0; }
.rel-source-details[open] > summary { margin-bottom: 8px; }
.rel-results { display: grid; gap: 20px; min-width: 0; }
.rel-group { display: grid; gap: 10px; }
.rel-group-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; }
.rel-group-head h2 { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; }
.rel-group-count { font-size: 11px; font-weight: 700; color: var(--muted); background: var(--surface-3); border-radius: 999px; padding: 2px 8px; }
.rel-group-head small { color: var(--muted); font-size: 11.5px; }
/* The narrowing strip: registry -> candidates -> judged. */
.rel-pipeline { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; padding: 15px 20px; margin-bottom: 16px; }
.rel-step { display: flex; align-items: center; gap: 11px; }
.rel-step + .rel-step { border-left: 1px solid var(--border); padding-left: 22px; }
.rel-step-n { width: 21px; height: 21px; border-radius: 999px; background: var(--accent-strong, #00553D); color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.rel-step strong { display: block; font-size: 15px; font-weight: 750; line-height: 1.05; }
.rel-step small { display: block; font-size: 11px; color: var(--muted); margin-top: 3px; }
.rel-pipeline-note { margin: 0 0 0 auto; max-width: 270px; font-size: 11px; line-height: 1.45; color: var(--muted); border-left: 1px solid var(--border); padding-left: 18px; }
/* Shared terms as chips rather than a run-on sentence. */
.rel-terms { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.rel-terms span { border: 1px solid var(--border); background: var(--surface-2); color: var(--muted); border-radius: 6px; padding: 3px 7px; font-size: 10.5px; font-weight: 600; }
/* Where a card that cannot be cited actually goes. */
.rel-exit { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--border); }
.rel-exit p { margin: 0 0 9px; font-size: 11.5px; color: var(--muted); line-height: 1.5; }
.relationship-actions.panel { margin-top: 16px; padding: 16px 20px; }
/* The landing state (canvas: Start with the draft). The identity fields with a
   note beside them, three doors for the draft's text, the source fields folded
   under them, and a bar that says what is loaded. */
.rel-landing { display: grid; gap: 16px; }
.rel-landing-head { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 28px; align-items: start; }
.rel-landing-identity h2 { margin: 0 0 8px; font-size: 19px; font-weight: 700; }
.rel-landing-identity > p { margin: 0 0 18px; max-width: 620px; line-height: 1.6; }
.rel-landing-aside { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; }
.rel-landing-aside h3 { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; color: var(--muted); }
.rel-landing-aside p { margin: 0; font-size: 12px; line-height: 1.55; color: var(--muted); }
.rel-doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.rel-door { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 20px; }
.rel-door-n { width: 26px; height: 26px; border-radius: 999px; background: var(--surface-3); color: var(--accent-strong, #00553D); display: grid; place-items: center; font-size: 12px; font-weight: 800; margin-bottom: 12px; }
.rel-door h3 { margin: 0 0 7px; font-size: 15px; font-weight: 700; }
.rel-door p { margin: 0 0 16px; font-size: 12.5px; color: var(--muted); line-height: 1.55; flex-grow: 1; }
.rel-door button:not(.text-button) { align-self: flex-start; }
.rel-door small { display: block; margin-top: 10px; font-size: 11px; color: var(--muted); }
.rel-landing-source > summary { padding: 8px 0; }
/* The rail beside the results (canvas: Relationship review): the draft under
   review as a summary, the citable-kinds legend, and the form folded away. */
.rel-rail-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.rel-rail-head h2 { margin: 0; font-size: 11px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; color: var(--muted); }
.rel-rail-code { display: block; margin-top: 10px; font-family: SFMono-Regular, Consolas, monospace; font-size: 12px; font-weight: 700; color: var(--accent-strong, #00553D); }
.rel-rail-title { display: block; margin-top: 3px; font-size: 14px; font-weight: 700; line-height: 1.3; }
.rel-rail-rows { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; margin: 12px 0 0; font-size: 12px; }
.rel-rail-rows dt { margin: 0; color: var(--muted); font-weight: 600; }
.rel-rail-rows dd { margin: 0; overflow-wrap: anywhere; }
.rel-rail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.rel-rail-edit { margin-top: 12px; }
.rel-rail-edit > summary { cursor: pointer; font-size: 11px; font-weight: 700; color: var(--muted); padding: 6px 0; }
.rel-rail-edit[open] > summary { margin-bottom: 8px; }
.rel-legend { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.rel-legend h3 { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; color: var(--muted); }
.rel-legend ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; font-size: 12px; }
.rel-legend li { display: flex; gap: 8px; align-items: baseline; }
.rel-legend li > span:first-child { width: 14px; flex-shrink: 0; text-align: center; font-weight: 800; }
.rel-legend li.is-citable > span:first-child { color: var(--accent-strong, #00553D); }
.rel-legend li:not(.is-citable) { color: var(--muted); }
.rel-complete { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
/* The two-column layout is decided by the width the workspace actually HAS,
   not the viewport: with the sidebar open, an 800px window leaves the results
   column about 240px wide, and the viewport query at 760px never fired. */
.rel-frame { container-type: inline-size; }
@container (max-width: 880px) {
  .rel-layout.has-results { grid-template-columns: minmax(0, 1fr); }
  .rel-layout.has-results .relationship-workspace { position: static; }
}
.rel-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; }
.rel-bar strong { display: block; font-size: 14px; }
.rel-bar p { margin: 4px 0 0; font-size: 11.5px; line-height: 1.45; }
/* What is happening while the analysis runs. The judging step is the only slow
   one; the deterministic steps land almost at once and that is the point — the
   operator sees the slow part is the part that should be slow. */
.rel-progress { padding: 22px 24px; }
.rel-progress h2 { margin: 0 0 4px; font-size: 15px; }
.rel-stages { list-style: none; margin: 10px 0 0; padding: 0; }
.rel-stage { display: flex; align-items: flex-start; gap: 13px; padding: 15px 0; border-bottom: 1px solid var(--border); }
.rel-stage:last-child { border-bottom: 0; }
.rel-stage strong { display: block; font-size: 14px; font-weight: 700; }
.rel-stage small { display: block; margin-top: 5px; font-size: 12px; color: var(--muted); line-height: 1.5; max-width: 60ch; }
.rel-stage.waiting strong, .rel-stage.waiting small { color: var(--muted); }
.rel-stage > div { flex-grow: 1; min-width: 0; }
.rel-stage-state { flex-shrink: 0; font-size: 11px; font-weight: 650; color: var(--muted); padding-top: 3px; }
.rel-stage-mark { width: 22px; height: 22px; border-radius: 999px; background: var(--surface-3); flex-shrink: 0; display: grid; place-items: center; font-size: 12px; font-weight: 800; margin-top: 1px; }
.rel-stage.done .rel-stage-mark { background: var(--success-soft); color: var(--success); }
.rel-stage-mark.running { background: transparent; }
.rel-progress .ai-run-card { margin-bottom: 4px; }
.rel-progress-note { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--border); font-size: 12px; color: var(--muted); line-height: 1.6; max-width: 70ch; }
.rel-layout.has-results .relationship-workspace .action-row { flex-direction: column; align-items: stretch; gap: 8px; }
.rel-layout.has-results .relationship-workspace .action-row .primary { width: 100%; }
.rel-layout.has-results .relationship-workspace .action-row .muted { font-size: 11px; }
/* No checkbox at all on a card that is not a citation — see resultCard(). */
.rel-nobox { width: 16px; height: 16px; margin-top: 4px; border-radius: 4px; border: 1px dashed var(--border); background: var(--surface-3); display: block; }
.relationship-result.not-citable { background: var(--surface-2); cursor: default; }
.relationship-result.not-citable:hover { border-color: var(--border); }
.relationship-results .section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.relationship-results .section-heading h2 { margin: 0 0 4px; }
.relationship-results .section-heading p { margin: 0; color: var(--muted); }
.relationship-result-list { display: grid; gap: 10px; }
.relationship-result { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: flex-start; gap: 14px; border: 1px solid var(--border); border-radius: 10px; padding: 16px; background: var(--surface); cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.relationship-result:hover { border-color: var(--brand); }
.relationship-result.selected { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, var(--surface)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 35%, transparent); }
.relationship-result > input { margin-top: 4px; }
.relationship-result-main p { margin: 8px 0; }
.relationship-result-main ul { margin: 6px 0 8px 18px; color: var(--muted); }
.relationship-confidence { min-width: 72px; text-align: right; }
.relationship-confidence strong { display: block; color: var(--brand); font-size: 1.15rem; }
.relationship-confidence small { color: var(--muted); }
.relationship-actions { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--border); margin-top: 18px; padding-top: 18px; }
.relationship-actions small { display: block; margin-top: 3px; color: var(--muted); }
@media (max-width: 760px) {
  .relationship-results .section-heading, .relationship-actions { align-items: stretch; flex-direction: column; }
  .rel-layout.has-results { grid-template-columns: minmax(0, 1fr); }
  .rel-layout.has-results .relationship-workspace { position: static; }
  .rel-landing-head, .rel-doors { grid-template-columns: minmax(0, 1fr); }
  .rel-bar { flex-direction: column; align-items: stretch; }
  .rel-pipeline { gap: 14px; }
  .rel-step + .rel-step { border-left: 0; padding-left: 0; }
  .rel-pipeline-note { margin: 0; border-left: 0; padding-left: 0; max-width: none; }
  .relationship-result { grid-template-columns: auto minmax(0, 1fr); }
  .relationship-confidence { grid-column: 2; text-align: left; }
}

/* Reference browser (v6.11.0) — replaces the <datalist> in Generate Document.
   A scrolling, grouped, information-carrying list: the point of the change was
   that the old control showed nothing but an ID, so the row has room for type,
   revision and the grounding/link markers. */
.reference-browser{margin-top:8px;border:1px solid var(--border);border-radius:10px;background:var(--surface);max-height:320px;overflow-y:auto;padding:8px}
.reference-group{margin-bottom:10px}
.reference-group:last-child{margin-bottom:0}
.reference-group h5{margin:0 0 6px;font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.reference-row{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;border:0;border-radius:8px;background:none;cursor:pointer;padding:7px 8px;font:inherit;color:inherit}
.reference-row:hover,.reference-row:focus-visible{background:var(--brand-soft);outline:0}
.reference-row strong{display:block;font-size:12.5px}
.reference-row small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.reference-marks{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;flex-shrink:0}
.reference-marks .badge{font-size:10px}
/* Contractor review comments reuse .marker-row from the review-markers panel —
   same shape, same interaction, different source of truth. */
.review-comment-note{color:var(--muted);font-size:11.5px;margin-top:4px}

/* QRG AI run counter — shown while a generation is in flight.
   Reuses .pub-progress for the bar (already token-based and contrast-checked in
   both themes) rather than inventing a second progress style. The canvas hexes
   nearby are tuned for the always-white printed page and would fail in dark
   mode, which is why nothing here borrows from them. */
#qrg-ai-run .ai-run-card{margin-bottom:12px}

/* Global keyboard focus: every interactive control gets one predictable ring. */
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
input:user-invalid,select:user-invalid,textarea:user-invalid{border-color:var(--danger)}

/* QRG preview surfaces use explicit semantic tokens instead of scattering
   theme-sensitive literals through component rules. The sign-in gate did too and
   still does, in its own block above; it left this heading behind. */
.nav-icon svg,.empty-icon svg{width:1.2em;height:1.2em;display:block;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.qrg-canvas-outer{background:var(--surface-3)}
.qrg-page{background:var(--qrg-paper);color:var(--qrg-ink)}
/* The library thumbnail is the printed page, and the printed page is white in
   every theme — it must look like the PNG the guide exports as. */
.qrg-page.is-static{background:#fff;color:#333}
.qrg-c-header,.qrg-c-title,.qrg-c-section,.qrg-c-table th{background:var(--qrg-green)}
.qrg-c-pill{background:var(--qrg-green-2)}
.qrg-c-warning{background:var(--qrg-warning)}
.qrg-c-never{background:var(--qrg-danger)}
.qrg-c-info{background:var(--qrg-info)}
.qrg-c-footer{background:var(--qrg-green-2)}

/* QRG printed content must remain readable. Page Fit blocks issuance when the
   Letter canvas overflows; these rules deliberately never shrink content to fit. */
.qrg-c-body-text,.qrg-c-bullet,.qrg-c-num-item{font-size:8.5px}
.qrg-c-section{font-size:8.5px}
.warn-body{font-size:8.5px}
.never-item{font-size:8.5px}
.info-item{font-size:8.5px}
.quote-text{font-size:8.5px}
.qrg-c-table{font-size:8.5px}
.qrg-c-image-empty{font-size:8.5px}
.qrg-c-header{font-size:8.5px}
.qrg-c-pill{font-size:8.5px}
.warn-label{font-size:8.5px}
.never-label{font-size:8.5px}
.info-label{font-size:8.5px}
.quote-attribution{font-size:8.5px}
.dc-label{font-size:8.5px}
.qrg-c-image-caption{font-size:8.5px}
.qrg-c-footer{font-size:8.5px}
.qrg-c-num-item:before{font-size:8.5px}

/* Pipeline polish: make lightweight AI actions and step state legible at a
   glance without competing with the primary Analyze action. */
.pipeline-card .label-row{align-items:center;gap:10px}
.pipeline-card .label-row .text-button{border:1px solid var(--brand);border-radius:999px;padding:5px 10px;color:var(--brand);font-weight:750;background:var(--surface)}
.pipeline-card .label-row .text-button:hover,.pipeline-card .label-row .text-button:focus-visible{background:var(--brand-soft);text-decoration:none}
.pipeline-card .suggest-note{display:block;margin-top:6px;line-height:1.45}
.pipeline-card label>small,.pipeline-card .form-grid label small{font-size:11px}
.wizard-steps li.active{font-weight:800;box-shadow:inset 0 -3px 0 var(--mvta-green)}
.wizard-steps li.done{color:var(--text)}
.prov-row{align-items:center;flex-wrap:wrap}
.prov-readiness{flex-basis:100%;margin-top:5px;font-size:11px;color:var(--muted)}
.handoff-receipt{margin-bottom:16px;border-color:color-mix(in srgb,var(--mvta-green) 35%,var(--border))}
.handoff-receipt h2{margin:0 0 4px;font-size:17px}
.handoff-receipt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.handoff-receipt-grid>div{display:grid;gap:5px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.handoff-receipt-grid strong{font-size:11px}
.handoff-receipt-grid small{color:var(--muted);line-height:1.45}
.handoff-receipt .panel-note{margin-bottom:10px}
/* The Handoff Receipt on the confirmed-plan panel. Each fact is labelled: the
   version, the lifecycle status and the source filename used to run together in
   one grey sentence, so the status read as a footnote. The identifiers sit in a
   closed <details> because they are for quoting to support, not for reading. */
.receipt{border-top:1px solid var(--border);margin-top:14px;padding-top:12px}
.receipt h4{margin:0 0 8px;font-size:11px;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.receipt-facts{margin:0;display:grid;gap:6px}
.receipt-facts>div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;align-items:baseline}
.receipt-facts dt{font-size:11px;font-weight:700;color:var(--muted)}
.receipt-facts dd{margin:0;font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}
.receipt-facts.mono dd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px}
/* Generate's identity facts on a run that came through Start (generation/identity-ownership.js):
   the six Start asked for, shown once, with the way back to Start beside them. Two columns
   where the card is wide enough; a required fact still blank on Start is marked. */
.identity-facts{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px 24px}
.identity-facts>div{grid-template-columns:110px minmax(0,1fr)}
.identity-facts dd{font-size:13px}
.identity-facts dd.identity-missing{color:var(--danger,#b42318);font-weight:600}
.identity-facts-card .action-row{margin-top:12px}
.identity-facts-card>small{display:block;margin-top:8px}
.receipt-support{margin-top:12px}
.receipt-support>summary{cursor:pointer;font-size:11.5px;font-weight:700;color:var(--muted);list-style:none}
.receipt-support>summary::-webkit-details-marker{display:none}
.receipt-support>summary::before{content:"\25b8";display:inline-block;margin-right:5px}
.receipt-support[open]>summary::before{content:"\25be"}
.receipt-support>summary:hover{color:var(--mvta-green)}
.receipt-support .receipt-facts{margin-top:10px}
.receipt-support .panel-note{margin:8px 0 8px;font-size:11.5px}
.output-review-ack{align-items:flex-start!important;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);line-height:1.45}
.output-review-ack input{margin-top:2px}
@media(max-width:700px){.handoff-receipt-grid{grid-template-columns:1fr}}
#generation-form .label-row .text-button{border:1px solid var(--brand);border-radius:999px;padding:4px 9px;color:var(--brand);font-weight:750;background:var(--surface)}
#generation-form .label-row .text-button:hover,#generation-form .label-row .text-button:focus-visible{background:var(--brand-soft);text-decoration:none}
#generation-form .setup-card label small{line-height:1.45}
.wizard-steps small{font-size:10px}
.wizard-steps.handoff-rail{grid-template-columns:repeat(6,1fr)}

/* The active wizard step pulses gently; the AI's own work is shown by the
   shared indicator (.ai-run), not here. */
@keyframes pipeline-step-pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mvta-green) 0%,transparent)}50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--mvta-green) 18%,transparent)}}
.wizard-steps li.active span{animation:pipeline-step-pulse 2.4s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){.wizard-steps li.active span{animation:none}}

/* Mobile adaptation: keep the desktop workspace dense, but make touch,
   safe-area insets, zoom, and long labels resilient on narrow screens. */
@media (pointer: coarse) {
  button, a, select, input[type="checkbox"], input[type="radio"] { min-height: 44px; }
  .nav-button { min-height: 44px; }
  .small { min-height: 44px; padding-block: 10px; }
  .chip button { min-width: 32px; min-height: 32px; }
}
@media (max-width: 760px) {
  body { padding-inline: env(safe-area-inset-left) env(safe-area-inset-right); }
  .sidebar { padding-top: max(20px, env(safe-area-inset-top)); padding-bottom: max(20px, env(safe-area-inset-bottom)); }
  .topbar { padding-inline: max(18px, env(safe-area-inset-left)) max(18px, env(safe-area-inset-right)); }
  .page-toolbar, .panel-header, .output-toolbar { gap: 12px; flex-wrap: wrap; }
  .action-row.wrap > button, .hero-actions > button { flex: 1 1 180px; }
  .data-table { min-width: 640px; }
  .table-wrap { position: relative; padding-bottom: 18px; }
  .table-wrap::after { content: 'Swipe horizontally to see more'; position: absolute; right: 8px; bottom: 0; color: var(--muted); font-size: 10px; pointer-events: none; }
}
@media (max-width: 390px) {
  .content { padding-inline: 14px; }
  .topbar h1 { font-size: 19px; }
  .hero { padding: 20px 18px; }
  .hero h2 { font-size: 20px; }
  .wizard-body { padding-inline: 14px; }
  .summary-list { grid-template-columns: 1fr; }
}

/* Publish readiness: keep operational guidance scannable without exposing raw
   SharePoint paths as the primary message. */
.technical-detail{margin-top:8px;font-size:.82rem;color:var(--text-muted)}
.technical-detail summary{cursor:pointer;font-weight:650;color:var(--text-muted)}
.technical-detail p{margin:6px 0 0;overflow-wrap:anywhere}
.inline-alert.danger .technical-detail code{white-space:normal;word-break:break-word}
.publish-grid > .panel:first-child{min-width:0}
/* The Finalize-only cursor:not-allowed override this rule used to need is
   gone — the shared :disabled rule above is now correct for every disabled
   button on the page, not just this one. */
.finalize-blockers{margin:0 0 12px;padding:10px 11px;border-radius:9px;background:var(--status-warning-bg);color:var(--status-warning-text);font-size:12px}
.finalize-blockers strong{display:block;margin-bottom:5px}
.finalize-blockers ul{margin:0 0 6px;padding-left:18px}
.finalize-blockers li{margin:3px 0}
.finalize-blockers a{color:inherit;font-weight:750}
.finalize-blockers p{margin:0}
/* Finalize destination picker (finalize-choices.js) — one radio per folder,
   the real SharePoint path underneath. Shared by Publishing and QRG. */
.finalize-choices{border:0;margin:0 0 10px;padding:0;min-width:0}
.finalize-choices legend{font-size:11px;font-weight:700;color:var(--muted);padding:0;margin-bottom:6px}
.finalize-choice{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface);cursor:pointer;margin-bottom:6px}
.finalize-choice:hover{border-color:var(--mvta-green)}
.finalize-choice.selected{border-color:var(--mvta-green);box-shadow:0 0 0 3px color-mix(in srgb,var(--mvta-green) 16%,transparent)}
.finalize-choice.unreachable{opacity:.6;cursor:not-allowed}
.finalize-choice input{margin-top:3px;flex-shrink:0;min-height:0}
.finalize-choice-body{display:grid;gap:3px;min-width:0}
.finalize-choice-title{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px}
.finalize-choice-path{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.finalize-choice-note{font-size:11px;color:var(--warning)}
.finalize-override{margin-top:4px}
.finalize-override .field-help{font-weight:400}
/* A disabled reason that used to live only in a hover title=. Always breaks
   onto its own full-width line under the button row it explains, so it is
   readable without hovering — on touch, with a screen reader, or at a glance. */
.button-hint{flex-basis:100%;color:var(--muted);font-size:11.5px;margin-top:2px}
.action-row.wrap+.panel-note{margin-top:10px}
#publish-review-markers{scroll-margin-top:var(--publish-rail-top,90px)}
.publish-grid{grid-template-columns:minmax(0,1.25fr) minmax(330px,.85fr)}
.publish-grid>.panel:first-child{display:flex;flex-direction:column}
.publish-grid>.panel:first-child>.panel-body{flex:1;display:flex;flex-direction:column}
.publish-grid>.panel:first-child>.panel-body>.action-row{margin-top:auto;padding-top:20px}
.draft-companions{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--border)}
.draft-companions>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.draft-companions>.action-row{margin-top:12px;justify-content:flex-end;flex-wrap:wrap}
.draft-companions h3{margin:0;font-size:14px}
.draft-companions header p{margin:3px 0 0;color:var(--muted);font-size:11px}
.draft-companions .panel-note{margin:0 0 12px;line-height:1.45}
.companion-pick:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 16%,transparent)}
.publish-grid>.panel:first-child [data-pub="render"]{background:var(--surface);border:1px solid var(--border);color:var(--text)}
.publish-grid>.panel:first-child [data-pub="render"]:hover:not(:disabled){border-color:var(--brand);color:var(--brand)}
.publish-stagebar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:0 0 18px}
.publish-stage{display:flex;align-items:center;gap:9px;min-width:0;padding:11px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);color:var(--muted)}
.publish-stage>span{display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px;border-radius:50%;background:var(--surface-muted);font-size:11px;font-weight:800}
.publish-stage strong,.publish-stage small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.publish-stage strong{font-size:12px;color:var(--text)}
.publish-stage small{font-size:10.5px;margin-top:2px}
.publish-stage.is-done>span{background:var(--success-soft);color:var(--success)}
.publish-stage.is-current{border-color:var(--brand);background:var(--brand-soft);color:var(--text)}
.publish-stage.is-current>span{background:var(--brand);color:var(--accent-strong)}
.publish-workbench{grid-template-columns:minmax(0,1fr) minmax(320px,.42fr);align-items:start}
.publish-workspace{display:grid;gap:18px;min-width:0}
.publish-attention{min-width:0;position:sticky;top:18px}
.publish-attention #publish-review-markers{margin:0;border-color:var(--warning)}
.publish-attention #publish-review-markers .panel-header{background:var(--status-warning-bg)}
.publish-inspection{overflow:hidden;box-shadow:none}
.publish-inspection-tabs{display:flex;gap:4px;padding:0 16px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.publish-inspection-tab{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);padding:12px 10px 10px;font:inherit;font-size:12px;font-weight:750;cursor:pointer}
.publish-inspection-tab:hover,.publish-inspection-tab.is-active{color:var(--brand)}
.publish-inspection-tab.is-active{border-bottom-color:var(--brand)}
.publish-inspection>.panel{border:0;border-radius:0;box-shadow:none;margin:0}
.publish-inspection>.panel[hidden]{display:none}
.publish-inspection>.panel .panel-header{background:var(--surface)}
.publish-inspection>.publish-validation-panel .panel-body{padding-top:14px}
@media(max-width:900px){.publish-workbench{grid-template-columns:1fr}.publish-attention{position:static}.publish-stagebar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.publish-stagebar{grid-template-columns:1fr}.publish-inspection-tabs{padding-inline:10px}.publish-inspection-tab{flex:1}}
@media(max-width:600px){.draft-companions>header{align-items:flex-start;flex-direction:column}.draft-companions>.action-row{width:100%;justify-content:flex-start}.draft-companions>.action-row button{flex:1 1 auto}}
.page-stack>.inline-alert{max-width:none}
.pipeline-dot.pending{background:var(--surface-2);color:var(--muted)}
.marker-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:start;gap:10px}
.companion-pick small{line-height:1.4}
.empty-inline.large{padding:18px 8px;font-size:12px}
.qrg-editor-wait{min-height:180px;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;color:var(--muted)}
.qrg-editor-wait strong{color:var(--text)}
.qrg-editor-wait p{max-width:420px;margin:0;font-size:12px;line-height:1.5}
@media(max-width:900px){.publish-grid{grid-template-columns:1fr}}
.decision-audit-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.audit-note{padding-top:7px;border-top:1px solid var(--border)}.pipeline-history{margin-top:14px;border-top:1px solid var(--border);padding-top:10px}.pipeline-history summary{cursor:pointer;color:var(--muted);font-size:11px;font-weight:700}
@media(max-width:760px){.decision-audit-grid{grid-template-columns:1fr}}

/* AI Pipeline — a task in progress is the shared AI indicator (.ai-run); only
   a failed attempt keeps .pipeline-job, which is a problem to act on. */
.pipeline-job-running{margin-bottom:14px}

/* AI Pipeline — Missing Information. The card painted every row with the same
   warning wash (.decomp-card.warn), so the one gap that blocks generation sat
   in the identical field of color as four optional ones, and the REQUIRED
   badge — warning ink on a warning-tinted panel — was nearly invisible
   against its own background. Color now encodes severity instead of mood:
   the card returns to a neutral surface with a warning border, and warm tint
   is spent ONLY on unresolved required gaps, which makes it forceful by
   rarity. When nothing required is open the panel is entirely neutral, which
   is itself the signal. Scoped to .missing-info-card so .decomp-card.warn
   keeps its meaning elsewhere. */
.missing-info-card.warn{background:var(--surface);border-color:var(--status-warning-border)}
.missing-info-card .missing-info-heading{background:var(--surface)}
.missing-info-card .missing-info-row.open-required{padding:12px;margin:4px 0;border-bottom:0;border-radius:10px;background:var(--status-warning-bg)}
/* Filled, not tinted: the required chip has to survive on the warm row it
   sits in. --bg as the ink tracks the theme, dark on amber in light mode and
   near-black on the lighter dark-theme amber. */
.missing-info-card .missing-info-row.open-required .section-status-badge{background:var(--warning);color:var(--bg)}
/* The draft ramp's #84968c on #f8faf8 is 2.9:1 — under the 4.5:1 floor for a
   10px label. Muted on surface-2 with a hairline reads as deliberately quiet
   rather than faded out. */
.missing-info-card .missing-info-row.open-optional .section-status-badge{background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1px var(--border)}
.missing-info-card .missing-info-row.resolved,.missing-info-card .missing-info-row.flagged{padding-left:12px;padding-right:12px}

/* Progressive disclosure for supporting prose (AI narrative, rationale,
   feature explainers). The AI Pipeline explained itself in full paragraphs
   above every decision — a ~120-word QA recap, a rationale under each
   clarification question, and 30-70 word primers on the companion cards —
   so the operator read an essay before reaching the control. The text is
   preserved verbatim, one click away, in the same collapse convention the
   passed-check groups already use. Quiet by construction: the summary reads
   as a label, not an action. */
.inline-details{margin:0 0 10px}
.inline-details>summary{cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:3px 0;color:var(--muted);font-size:11px;font-weight:700;list-style:none}
.inline-details>summary::-webkit-details-marker{display:none}
.inline-details>summary::before{content:"▸";font-size:9px;line-height:1;transition:transform .15s ease}
.inline-details[open]>summary::before{transform:rotate(90deg)}
.inline-details>summary:hover{color:var(--text)}
/* A 3px --accent-soft halo measured 1.09:1 against the row it sits on — a
   focus indicator that is technically present and practically invisible.
   Solid accent at 3.28:1 clears the 3:1 non-text floor. */
.inline-details>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.inline-details>p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55;max-width:72ch}
@media (prefers-reduced-motion:reduce){.inline-details>summary::before{transition:none}}

/* ── Critique remediation (Interactive QA + app-wide contrast/typography) ──
   Findings from the dual-agent critique of the Clarification Questions
   surface. Ordered P0 → P2. */

/* P0 contrast. White ink on brand green measured 3.44:1 (2.02:1 on the dark
   theme's brighter green) — every .primary button and the AI avatar, in both
   themes. --accent-strong is the tokenized safe pairing; see tokens.css. */
.primary:not(.hero button){background:var(--accent-strong);color:var(--accent-text)}
.primary:not(.hero button):hover{background:var(--accent-hover);color:var(--accent-text)}
html[data-theme="dark"] .primary:not(.hero button):hover{color:#04140d}
/* Destructive confirmation button. A safe action and an irreversible one must
   not look identical — the native confirm() gave both the same anonymous
   button, which is half of why it was easy to mis-click. Mirrors the
   `:not(.hero button)` shape of the rules above deliberately: without it this
   loses on specificity and silently renders green, which is the exact failure
   this comment exists to prevent recurring. */
.primary.is-danger:not(.hero button){background:var(--danger);color:#fff}
.primary.is-danger:not(.hero button):hover{background:var(--danger);color:#fff;filter:brightness(1.1)}
.ai-avatar{background:var(--accent-strong);color:var(--accent-text)}
.qa-turn.answered .ai-avatar{background:var(--accent-strong)}
/* Green-on-light text buttons measured 3.28:1 against surface-2. */
.text-button{color:var(--accent-strong)}
html[data-theme="dark"] .text-button{color:var(--mvta-green)}

/* P1 base typography. Nothing in the stylesheets set a base font-size or
   line-height, so every unstyled paragraph inherited the UA default 16px at
   ~1.125 leading — against DESIGN.md's documented body of 13px/1.55. That is
   why prose on these surfaces read as walls: oversized type on a long measure
   with tight leading. Components that set their own size are unaffected. */
body{font-size:13px;line-height:1.55}
.pipeline-card>p,.decomp-card p,.qa-check small{max-width:70ch}
/* The question is the surface's primary content: hold it at the title step
   rather than letting it fall to body size with everything else. */
.qa-question-label>strong{font-size:14px;line-height:1.4}
.qa-question-label{cursor:pointer;min-width:0}

/* P1 touch targets. Measured 19-28px tall against a 44px floor the codebase
   already enforces on checkboxes. The buttons stay visually light — the hit
   area grows, the ink does not. */
.qa-turn .action-row .text-button.small,.qa-turn .action-row .secondary.small{min-height:44px;display:inline-flex;align-items:center}
.inline-details>summary{min-height:24px}

/* P2 signal economy. Required-ness was painted in the warning ramp, the same
   amber as "Looks incomplete" and "Flagged for review" — three meanings, one
   color. An ordinary obligation is structural, not an anomaly. */
.badge.qa-required{background:var(--surface-3);color:var(--text);box-shadow:inset 0 0 0 1px var(--border)}
html[data-theme="dark"] .badge.qa-required{background:var(--surface-3);color:var(--text)}
/* P2 dark-theme containers. .qa-turn separated from its card by 1.05:1 with
   no border, so the question blocks were effectively invisible at night. */
.qa-turn{border:1px solid var(--border)}
/* P2 the answer control is the most important input in the pipeline and was
   the only one in the app wearing UA defaults — 0px radius, 2px padding, grey
   border, and a UA dark form background in dark theme. */
.qa-turn textarea,.qa-turn select{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:9px 11px;font:inherit;outline:none}
.qa-turn textarea:focus,.qa-turn select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.qa-turn select{min-height:38px}
.qa-action-note{display:block;color:var(--muted);font-size:11px;line-height:1.4;margin-top:2px}

/* ── Run / readiness status header (bolder) ───────────────────────────────
   Was a 72px pastel medallion floating above centered text: the state of the
   whole run — "Not Ready Yet", "Ready to Generate" — announced in a 12% tint
   with a text glyph standing in for an icon, detached from the page's own
   left-aligned rhythm. The mark now sits INLINE with the headline it
   qualifies, at full semantic strength rather than a wash, using the same
   filled-ink pairing the Required chip and the AI task banner already use.
   The state is legible from the skeleton alone: filled green = clear to
   proceed, filled amber = blocked. Copy, actions, and behavior unchanged. */
.generation-run,.completion-card{text-align:left;padding:24px}
.completion-head{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.run-orb,.completion-mark{flex:0 0 44px;width:44px;height:44px;border-radius:var(--radius);margin:0;font-size:0}
/* No font-size here on purpose: the heading keeps whatever step it had before
   this block existed, so the status header borrows the page's scale instead of
   introducing one of its own. */
.generation-run h2,.completion-card h2{margin:0}
/* Ready. */
.completion-mark.ready,.run-orb.success{background:var(--accent-strong);color:var(--accent-text)}
/* Blocked, and ready-with-advisories: both want the warning ramp at full
   strength, with --bg as the ink so it tracks the theme (dark ink on amber in
   light, near-black on the brighter dark-theme amber). */
.completion-mark,.completion-mark.warn,.completion-mark.blocked,.completion-mark.advisory,.run-orb,.run-orb.warning{background:var(--warning);color:var(--bg)}
.run-orb.danger{background:var(--danger);color:#fff}
.generation-run p,.completion-card p{margin:0 0 14px;max-width:58ch}
.generation-run .action-row,.completion-card .action-row{justify-content:flex-start;margin-top:18px}
@media(max-width:650px){.completion-head{gap:11px}}
/* ADR 0012 — the coordinator owns the visible lifecycle while embedded phase
   views keep their domain controls and side effects. */
.document-workflow{display:grid;gap:18px}.document-workflow-banner{display:flex;gap:10px;align-items:baseline;padding:12px 16px;border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:10px;background:var(--surface);font-size:12px;color:var(--muted)}.document-workflow-banner strong{color:var(--text)}.document-workflow-rail ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;list-style:none;padding:0;margin:0}.document-workflow-step button{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;width:100%;min-height:58px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--muted);text-align:left;cursor:pointer}.document-workflow-step button>span{grid-row:span 2;width:23px;height:23px;display:grid;place-items:center;border-radius:50%;background:var(--surface-2);font-size:11px;font-weight:800}.document-workflow-step strong{font-size:12px;color:var(--text)}.document-workflow-step small{font-size:10px}.document-workflow-step.active button{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 12%,transparent)}.document-workflow-step.active button>span{background:var(--brand);color:#fff}.document-workflow-step.done button>span{background:var(--brand-soft);color:var(--brand)}.document-workflow-step.stale button{border-color:var(--danger);background:var(--danger-soft)}.document-workflow-step.stale small{color:var(--danger);font-weight:800}.document-workflow-heading{display:flex;justify-content:space-between;gap:18px;align-items:start}.document-workflow-heading h2{margin:5px 0;font-size:20px}.document-workflow-heading p{margin:0;color:var(--muted);font-size:12px}.document-workflow-content{min-width:0}.document-workflow-collapsed{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px dashed var(--border-strong);border-radius:10px;background:var(--surface-2)}.document-workflow-collapsed.stale{border-style:solid;border-color:var(--danger);background:var(--danger-soft)}.document-workflow-collapsed strong{font-size:13px}.document-workflow-collapsed p{margin:3px 0 0;color:var(--muted);font-size:12px}.document-workflow-embedded .pipeline-rail,.document-workflow-embedded .wizard-steps,.document-workflow-embedded .publish-stagebar{display:none}.document-workflow-embedded .pipeline-layout{grid-template-columns:minmax(0,1fr) minmax(250px,310px)}@media(max-width:800px){.document-workflow-rail ol{grid-template-columns:repeat(2,minmax(0,1fr))}.document-workflow-banner{display:block}.document-workflow-banner span{display:block;margin-top:3px}.document-workflow-embedded .pipeline-layout{grid-template-columns:1fr}}

/* ADR 0012 wave 2 — unified workflow screen components.
   Ported from v6deploy/prototypes/consolidated-workflow.prototype.html, which
   ADR 0012 names as the normative design for these five screens. Every rule
   reads existing tokens rather than introducing a palette, so dark mode and
   any future token refresh keep working without touching this block. */

/* Review the plan — four counted, collapsible decision groups. Replaces four
   always-expanded stacked cards; the row markup inside each body is unchanged. */
.uw-group{border:1px solid var(--border);border-radius:11px;margin-bottom:8px;background:var(--surface);overflow:hidden;transition:border-color .16s,box-shadow .16s}
.uw-group:hover{border-color:color-mix(in srgb,var(--border) 60%,var(--text))}
.uw-group.open{border-color:color-mix(in srgb,var(--brand) 34%,transparent);box-shadow:0 1px 2px rgba(16,40,30,.05)}
.uw-ghead{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:13px 16px;border:0;background:transparent;color:var(--text);text-align:left;cursor:pointer;transition:background .16s}
.uw-ghead:hover{background:var(--surface-2)}
.uw-group.open .uw-ghead{background:var(--brand-soft,var(--mvta-green-soft))}
.uw-gtitle{font-weight:640;font-size:14px;display:flex;gap:9px;align-items:center;flex-wrap:wrap;min-width:0}
.uw-caret{color:var(--muted);transition:transform .2s cubic-bezier(.4,0,.2,1);flex:none;font-size:12px}
.uw-group.open .uw-caret{transform:rotate(90deg);color:var(--brand)}
.uw-gbody{padding:6px 16px 16px;border-top:1px solid var(--border);display:none}
.uw-group.open .uw-gbody{display:block;animation:uw-reveal .22s cubic-bezier(.16,1,.3,1)}
@keyframes uw-reveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* The group bodies host the existing decomp cards; strip their duplicate
   chrome so the accordion supplies the frame instead of nesting two. */
.uw-gbody>.decomp-card,.uw-gbody>.decomp-card.two{border:0;padding:0;background:transparent;box-shadow:none;margin:0}
.uw-gbody>.decomp-card>span:first-child{display:none}

/* Stat tiles — the four-figure strip above the groups. */
.uw-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px;margin-bottom:16px}
.uw-stat{border:1px solid var(--border);border-radius:11px;padding:10px 13px;background:var(--surface-2)}
.uw-stat b{display:block;font-size:20px;font-weight:680;letter-spacing:-.025em;line-height:1.2;font-variant-numeric:tabular-nums}
.uw-stat b i{font-style:normal;font-size:12px;font-weight:500;color:var(--muted)}
.uw-stat span{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:650}
.uw-stat.hot{background:var(--danger-soft);border-color:color-mix(in srgb,var(--danger) 26%,transparent)}
.uw-stat.hot b{color:var(--danger)}

/* Collapsed Step strip — dashed, never asserts a review happened. */
.uw-strip{display:flex;gap:11px;align-items:center;background:var(--surface-2);border:1px dashed color-mix(in srgb,var(--brand) 34%,transparent);border-radius:11px;padding:11px 16px;margin-bottom:12px;font-size:13.5px;color:var(--muted)}
.uw-strip.stale{border-style:solid;border-color:var(--danger);background:var(--danger-soft);color:var(--danger)}
.uw-strip b{color:var(--text);font-weight:640}
.uw-strip.stale b{color:var(--danger)}
.uw-strip-mark{flex:none;color:var(--brand);font-weight:800}
.uw-strip.stale .uw-strip-mark{color:var(--danger)}
.uw-strip button{margin-left:auto}
.uw-group.stale>.uw-ghead{border-color:var(--danger);background:var(--danger-soft)}
/* Batch results: one row per document sent, generated or failed. */
.batch-result-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.batch-result-list li{display:flex;gap:11px;align-items:center;padding:9px 12px;border:1px solid var(--border);border-radius:9px}
.batch-result-list li.ready>span:first-child{color:var(--success);font-weight:800}
.batch-result-list li.not-ready{border-color:var(--danger);background:var(--danger-soft)}
.batch-result-list li.not-ready>span:first-child{color:var(--danger);font-weight:800}
.batch-result-list li>div{flex:1;display:grid}
.batch-result-list small{color:var(--muted)}
/* Two handoff versions, and the choice between them. Each option states its
   consequence beside it; nothing is preselected. */
.version-compare{border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-bottom:14px;display:grid;gap:10px;font-size:13.5px}
.version-compare ul{margin:4px 0 0;padding-left:18px;display:grid;gap:3px;color:var(--muted)}
.version-choice{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--border)}
.version-choice button{flex:none;min-width:210px}
.version-choice span{color:var(--muted);font-size:12.5px;padding-top:6px}
/* Stale-handoff recovery: the decisions that went out of date, the one step to
   return to, and — only where policy permits — Explicit Reconfirmation. Amber,
   not red: work has been invalidated, nothing has failed. */
.uw-recovery{border:1px solid var(--warning);background:var(--warning-soft);border-radius:11px;padding:13px 16px;margin-bottom:14px;font-size:13.5px}
.uw-recovery>p{margin:0 0 8px}
.uw-recovery ul{margin:0 0 10px;padding-left:18px;display:grid;gap:4px}
.uw-recovery li{color:var(--text)}
.uw-recovery .uw-recovery-draft{margin:0 0 10px;color:var(--muted)}
.uw-recovery .action-row{align-items:center;flex-wrap:wrap;gap:10px}
.uw-recovery-consequence{color:var(--muted);font-size:12.5px;flex:1 1 260px}
.document-workflow-notice:empty{display:none}
.document-workflow-notice .inline-alert{margin:0}

/* Rail — segments join into one bar; the current step lifts out of it. */
.uw-rail{display:flex;align-items:stretch;flex-wrap:wrap;margin-bottom:18px}
.uw-rail button{position:relative;flex:1 1 0;min-width:132px;display:flex;gap:10px;align-items:center;margin-right:-1px;padding:11px 13px;border:1px solid var(--border);background:var(--surface);color:var(--text);text-align:left;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s}
.uw-rail li:first-child button{border-radius:11px 0 0 11px}
.uw-rail li:last-child button{border-radius:0 11px 11px 0;margin-right:0}
.uw-rail button:hover{background:var(--surface-2);z-index:1}
.uw-rail li{list-style:none;display:flex;flex:1 1 0;min-width:0}
.uw-rail li.active button{border-color:var(--brand);z-index:2;border-radius:11px;box-shadow:0 0 0 3px var(--brand-soft,var(--mvta-green-soft))}
.uw-rail li.skip{flex:0 1 auto}
.uw-rail li.skip button{background:var(--surface-2);border-style:dashed;min-width:0}
.uw-rail li.stale button{border-color:var(--warn-gate-line);background:var(--surface)}
.uw-dot{width:23px;height:23px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--surface-3);color:var(--muted);font-size:11px;font-weight:700}
.uw-rail li.active .uw-dot{background:var(--brand);color:#fff}
.uw-rail li.done .uw-dot{background:var(--brand-soft,var(--mvta-green-soft));color:var(--brand)}
.uw-rail li.skip .uw-dot{background:transparent;color:var(--brand);width:16px}
.uw-rail li.stale .uw-dot{background:var(--warn-gate-ink);color:var(--surface)}
.uw-rtext{min-width:0}
.uw-rname{display:block;font-size:13px;font-weight:620;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uw-rmeta{display:block;font-size:11px;color:var(--muted);line-height:1.35;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Burnt Orange holds 4.5:1 on white and on --surface-2, but only to about 4%
   over a tint of its own hue — measured 3.88:1 against a 10% wash, which is
   why the stale stop's field stays clear and the colour lives in the border,
   the dot and this lead. Same rule tokens.css states for --warn-gate-*. */
.uw-rmeta.hot{color:var(--warn-gate-ink);font-weight:600}
/* Ordinary outstanding work. It used to share `.hot` — and through it --danger
   — with genuine invalidation, so "3 to decide" on a stop nobody had reached
   shouted as loudly as a failed check. Present and legible, not alarming. */
.uw-rmeta.todo{color:var(--gov-teal-mid);font-weight:600}

/* Marker resolution progress on Publish. */
.uw-bar{height:5px;border-radius:999px;background:var(--surface-3);overflow:hidden;margin-top:10px}
.uw-bar i{display:block;height:100%;background:var(--brand);border-radius:999px;transition:width .5s cubic-bezier(.4,0,.2,1)}
.uw-mk-count{font-size:10.5px;font-weight:700;color:var(--danger);background:var(--danger-soft);border:1px solid color-mix(in srgb,var(--danger) 26%,transparent);border-radius:999px;padding:2px 7px;flex:none}

@media(max-width:900px){.uw-rail li{flex:1 1 45%}.uw-rail li button,.uw-rail li:first-child button,.uw-rail li:last-child button{border-radius:11px;margin-right:0}.uw-rail{gap:6px}}
.uw-position{margin:4px 0 0;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand)}
/* Generate — one pre-flight screen: settings beside the confirmed plan. */
.unified-generate{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:14px;align-items:start}
.unified-generate>*{min-width:0}
.document-workflow-embedded .wizard-body{padding:0;min-height:0}
.document-workflow-embedded .wizard-panel{border:0;background:transparent;box-shadow:none;overflow:visible}
@media(max-width:1000px){.unified-generate{grid-template-columns:1fr}}
/* The intake card's own step numbers duplicated the rail's numbering with a
   different sequence once the guided strip above them was removed. */
.document-workflow-embedded .guided-intake-card .section-heading>span{display:none}
/* Marker cards in the attention column: actions sit below the placeholder, not
   beside it. In a 320px column the button group took 157px and left the marker
   text 77px, so every placeholder wrapped to roughly one word per line. */
.publish-attention .marker-row{grid-template-columns:28px minmax(0,1fr)}
.publish-attention .marker-row>.action-row{grid-column:2/-1;margin-top:8px}
.publish-attention .marker-body code{white-space:pre-wrap;overflow-wrap:anywhere}
/* Where each placeholder sits: section, kind of text, and the words either side.
   The marker itself is already printed above the list, so inside an excerpt it
   is a short highlighted token rather than the whole placeholder again. */
.marker-where{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.marker-where li{font-size:11px;line-height:1.45;color:var(--muted)}
.marker-where b{color:var(--text);font-weight:700}
.marker-field{margin-left:6px;font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase}
.marker-excerpt{display:block;margin-top:2px;font-style:italic;overflow-wrap:anywhere}
.marker-excerpt mark{background:var(--warning-soft);color:var(--text);border-radius:3px;padding:0 4px;font-style:normal;font-weight:700}
.marker-more{font-size:11px;color:var(--muted);margin:6px 0 0}
/* A contractor's Word comment left on this placeholder, offered as its answer. */
.marker-comments{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.marker-comments li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;padding:8px 10px;border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:8px;background:var(--surface-2);font-size:11.5px;line-height:1.45}
.marker-comments li q{quotes:"\201C" "\201D";color:var(--text)}
.marker-comments li small{display:block;margin-top:2px;font-size:10.5px;color:var(--muted)}
.marker-comments .text-button{white-space:nowrap;padding:0}
.marker-body .section-edit-form .form-hint{display:block;margin:6px 0 0;font-size:11px;font-weight:400;color:var(--muted);line-height:1.45}
/* Answered placeholders: who replaced what, with what, and when. */
.marker-settle .marker-mode{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 8px;font-size:12px}
.marker-settle .marker-mode label{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.marker-settle .marker-mode label.is-disabled{color:var(--muted)}
.marker-settle .marker-mode label:has(.marker-mode-why){flex-wrap:wrap;row-gap:0}
.marker-settle .marker-mode-why{flex-basis:100%;padding-left:19px;font-weight:400;font-size:11.5px;line-height:1.3;color:var(--muted)}
.marker-occurrences{border:1px solid var(--border);border-radius:8px;margin:0 0 10px;padding:6px 10px 8px;display:grid;gap:6px}
.marker-occurrences legend{font-size:11px;font-weight:700;color:var(--muted);padding:0 4px}
.marker-occurrences label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:start;font-size:11px;line-height:1.45;color:var(--muted)}
.marker-occurrences b{color:var(--text)}
.marker-preview li{display:grid;gap:3px}
.marker-preview-before{text-decoration:line-through;color:var(--muted);overflow-wrap:anywhere}
.marker-preview-after{color:var(--text);overflow-wrap:anywhere}
.marker-preview-deleted{color:var(--danger,#b42318);font-weight:700}
/* Removing only a placeholder: the placeholder struck out in its sentence, the
   rest of the text left as ordinary, unstruck text. */
.marker-preview-excerpt{display:grid;gap:4px;color:var(--text);overflow-wrap:anywhere}
.marker-preview-excerpt del{text-decoration:line-through;text-decoration-thickness:2px;color:var(--danger,#b42318);background:var(--danger-soft,rgba(180,35,24,.08));border-radius:3px;padding:0 3px}
.marker-preview-note{color:var(--muted);font-size:12px}
/* ── Publish Document: draft canvas + marker inbox (v6.14.138) ─────────────────
   One header (identity, where the document stands, one next action, ⋯ for the
   rest), the draft itself as the working surface, and the marker inbox beside
   it. Everything that is not the next action sits in a tab or the ⋯ menu. */
.publish-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px 24px;flex-wrap:wrap;margin:0 0 14px}
.publish-head-ident{min-width:0}
.publish-doc-id{display:inline-block;font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);padding:5px 8px;border-radius:6px}
.publish-head-ident h2{margin:8px 0 3px;font-size:22px;letter-spacing:-.01em;line-height:1.2;overflow-wrap:anywhere}
.publish-head-ident p{margin:0;color:var(--muted);font-size:12.5px}
.publish-head-side{display:grid;gap:10px;justify-items:end}
.publish-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted)}
.publish-steps li{display:flex;align-items:center;gap:6px}
.publish-steps i{width:9px;height:9px;border-radius:50%;border:2px solid var(--border);box-sizing:border-box;flex:none}
.publish-steps .is-done{color:var(--success)}
.publish-steps .is-done i{background:var(--success);border-color:var(--success)}
.publish-steps .is-warn{color:var(--mvta-orange-ink)}
.publish-steps .is-warn i{background:var(--mvta-orange);border-color:var(--mvta-orange)}
.publish-steps .is-optional i{border-style:dashed}
.publish-steps a,.publish-steps button{color:inherit;font:inherit;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.publish-head-actions{justify-content:flex-end;flex-wrap:wrap}
.publish-canvas-layout{--publish-rail-top:96px;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,380px);gap:18px;align-items:start}
.publish-main{min-width:0;display:grid;gap:14px}
.publish-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);overflow-x:auto}
.publish-tab{display:inline-flex;align-items:center;gap:7px;border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);padding:10px 12px 9px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;margin-bottom:-1px}
.publish-tab:hover{color:var(--text)}
.publish-tab.is-active{color:var(--text);border-bottom-color:var(--brand)}
.publish-tab .count{font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--surface-3);color:var(--muted)}
.publish-tab .count.warn{background:var(--warning-soft);color:var(--mvta-orange-ink)}
.publish-tab-panel{display:grid;gap:14px;min-width:0}
.publish-canvas{padding:0}
.publish-canvas-grid{display:grid;grid-template-columns:minmax(150px,190px) minmax(0,1fr)}
.publish-canvas-grid.no-outline{grid-template-columns:minmax(0,1fr)}
/* The topbar is sticky at 84px tall, so a rail pinned at top:12px puts its own
   first rows UNDER it — the operator scrolls the list and the top of it is
   simply not there. Both sticky columns on this screen clear the bar, and their
   max-height subtracts the same offset so the bottom stays on screen too.
   overscroll-behavior:contain stops the scroll CHAINING that loses the place in
   the other direction: reaching the end of the marker list used to hand the
   wheel to the page, which scrolled the draft out from under the reader
   (.qrg-issuance-rail already does this). */
.publish-outline{position:sticky;top:var(--publish-rail-top);align-self:start;display:grid;gap:1px;padding:16px 10px;border-right:1px solid var(--border);max-height:calc(100vh - var(--publish-rail-top) - 12px);overflow:auto;overscroll-behavior:contain}
.publish-outline-item{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;border-radius:7px;padding:6px 8px;text-align:left;font:inherit;font-size:12.5px;color:var(--text);cursor:pointer}
.publish-outline-item:hover{background:var(--surface-2)}
.publish-outline-item.level-2{padding-left:18px;font-size:12px;color:var(--muted)}
.publish-outline-item span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.publish-outline-item b{flex:none;font-size:10.5px;background:var(--warning-soft);color:var(--mvta-orange-ink);border-radius:999px;padding:1px 7px}
.publish-canvas-doc{padding:32px 44px 40px;min-width:0}
/* A jump from the outline or from a marker place scrolls with block:'start',
   so 16px landed the target behind the same 84px topbar — the operator clicked
   a section and arrived above it. Clear the bar, as #publish-review-markers
   already did with its own hand-tuned 90px. */
.publish-canvas-doc .preview-section{scroll-margin-top:var(--publish-rail-top)}
.publish-canvas-doc .preview-section p,.publish-canvas-doc .preview-section li{font-family:Georgia,'Times New Roman',serif;font-size:14.5px;line-height:1.7}
.publish-canvas-doc .preview-section.level-2,.publish-canvas-doc .preview-section.level-3{border-left:0;padding-left:0}
.canvas-marker{display:inline;font:650 12px/1.5 system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--mvta-orange-ink);background:var(--surface);border:0;border-radius:6px;padding:1px 7px;box-shadow:inset 0 0 0 1px currentColor;cursor:pointer;text-align:left;vertical-align:baseline}
/* A button is drawn inline-block whatever its display says, and a wrapped inline-block's
   baseline is its LAST line: in a list item holding only a long marker, the bullet sat
   beside the bottom line and read as an empty bullet under the marker. Top-aligned, the
   bullet sits beside the first line. */
.publish-canvas-doc li>.canvas-marker,.publish-canvas-doc li>.canvas-preview{vertical-align:top;margin-top:3px}
/* Settled markers on the draft (annotateSettledHtml): reworded text highlighted, a tag where a
   placeholder was removed, a note for an item deleted with its marker, and a plain answer. */
.publish-canvas-doc .canvas-settled{background:var(--success-soft);color:inherit;border-radius:3px;padding:0 2px;box-shadow:inset 0 -2px 0 var(--success);cursor:help}
.publish-canvas-doc .preview-resolved{background:var(--success-soft);color:inherit;font-style:normal;border-radius:3px;padding:0 2px;box-shadow:inset 0 -2px 0 var(--success)}
.canvas-settled-removed{display:inline-block;margin:0 3px;padding:0 6px;border-radius:6px;font:650 11px/1.6 system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--success);box-shadow:inset 0 0 0 1px currentColor;vertical-align:1px;cursor:help}
.publish-canvas-doc .preview-section p.canvas-settled-note{margin:0 0 10px;padding:4px 10px;border-left:3px solid var(--success);background:var(--success-soft);font:13px/1.5 system-ui,-apple-system,'Segoe UI',sans-serif;cursor:help}
.canvas-settled-tag{font-weight:650;color:var(--success);margin-right:4px}
.publish-canvas-doc .canvas-settled-note del{color:var(--muted)}
.canvas-marker::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:5px;vertical-align:1px}
.canvas-marker.cause-companion{color:var(--accent)}
.canvas-marker.cause-sign-off{color:var(--muted)}
.canvas-marker:hover,.canvas-marker:focus-visible{box-shadow:inset 0 0 0 2px currentColor;outline:none}
.canvas-marker.is-selected{background:var(--warning-soft);box-shadow:inset 0 0 0 2px currentColor}
.canvas-preview{text-decoration:none;color:var(--accent);border-bottom:2px dashed var(--accent)}
.canvas-marker.is-flash,.canvas-preview.is-flash{animation:canvas-flash 1.2s ease-out}
@keyframes canvas-flash{0%{box-shadow:0 0 0 6px color-mix(in srgb,var(--brand) 35%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.canvas-marker.is-flash,.canvas-preview.is-flash{animation:none}}
/* Quick actions on the draft: the bar a clicked marker floats, and the ⋯ a
   section heading carries. The bar is absolutely placed inside
   .publish-canvas-doc (which is position:relative for it) by placeQuickBar(),
   above the marker's line where there is room. */
.publish-canvas-doc{position:relative}
.qbar{position:absolute;z-index:5;display:flex;align-items:center;gap:6px;padding:5px 6px 5px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);box-shadow:0 10px 24px rgba(0,0,0,.14);font:13px/1.3 system-ui,-apple-system,'Segoe UI',sans-serif;max-width:100%}
.qbar[hidden]{display:none}
/* #522 inline text editing. The editable blocks are the draft's own <p>/<li>/<td>,
   so the affordance has to be quiet enough to read through: nothing at rest, a
   hairline on hover and a real focus ring for the keyboard. The editor itself is
   placed like .qbar, absolutely inside .publish-canvas-doc. */
.canvas-text{cursor:default;border-radius:4px;transition:background .12s ease,box-shadow .12s ease}
.canvas-text:hover{background:var(--surface-2,rgba(0,0,0,.035));box-shadow:0 0 0 4px var(--surface-2,rgba(0,0,0,.035))}
.canvas-text:focus-visible{outline:2px solid var(--mvta-blue,#005baa);outline-offset:3px}
.tedit{position:absolute;z-index:6;display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);box-shadow:0 12px 28px rgba(0,0,0,.16)}
.tedit[hidden]{display:none}
.tedit textarea{width:100%;box-sizing:border-box;resize:vertical;font:14px/1.5 system-ui,-apple-system,'Segoe UI',sans-serif;padding:8px;border:1px solid var(--border);border-radius:6px;background:var(--surface)}
.tedit-hint{margin:0;font-size:12px;color:var(--muted)}
.tedit-comment{margin:0;display:flex;flex-direction:column;gap:2px;padding:6px 8px;border-left:3px solid var(--mvta-teal,#00727a);background:var(--surface-2,rgba(0,0,0,.035));border-radius:0 6px 6px 0}
.tedit-comment small{font-size:12px;color:var(--muted)}
.tedit-comment q{font-size:13px}
.find-from-comments{margin:0 0 8px;display:flex;flex-direction:column;gap:2px;padding:6px 8px;border-left:3px solid var(--mvta-teal,#00727a);background:var(--surface-2,rgba(0,0,0,.035));border-radius:0 6px 6px 0}
.find-from-comments small{font-size:12px;color:var(--muted)}
.find-from-comments q{font-size:13px}
.tedit-refusal{margin:0;font-size:12px;font-weight:600;color:var(--mvta-orange-ink,#8a4b00)}
.tedit-tools{display:flex;align-items:center;gap:8px}
.tedit-bold{display:inline-flex;align-items:center;justify-content:center;width:28px;height:26px;padding:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text,inherit);font:700 14px/1 system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer}
.tedit-bold:hover,.tedit-bold:focus-visible{border-color:var(--brand);color:var(--brand)}
.tedit-tools-note{font-size:12px;color:var(--muted)}
.tedit-newrow-cell{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
.tedit-unsaved{margin:0;font-size:12px;font-weight:600;color:var(--mvta-orange-ink,#8a4b00)}
.tedit-unsaved[hidden]{display:none}
.tedit.is-flash{animation:canvas-flash 1.2s ease-out}
/* The ✎ beside a hovered or focused block: one button, moved to that block. */
.tedit-pencil{position:absolute;z-index:5;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--muted);cursor:pointer}
.tedit-pencil[hidden]{display:none}
.tedit-pencil:hover,.tedit-pencil:focus-visible{color:var(--brand);border-color:currentColor}
@media (prefers-reduced-motion:reduce){.tedit.is-flash{animation:none}}
.qbar>b{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:650}
.qbar-places{flex:none;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--warning-soft);color:var(--mvta-orange-ink)}
.qbar-menu{display:inline-flex}
.qbar-note{flex:0 1 auto;min-width:0;max-width:220px;font-size:11.5px;line-height:1.25;color:var(--muted)}
.qbar-close{flex:none;border:0;background:none;color:var(--muted);font-size:17px;line-height:1;padding:2px 5px;border-radius:6px;cursor:pointer}
.qbar-close:hover{background:var(--surface-2);color:var(--text)}
/* Low contrast until it is wanted, but never hidden: a control that appears
   only on hover cannot be reached by keyboard or on a touch screen. */
.qsec{display:inline-block;vertical-align:middle;margin-left:8px}
.qsec-dots{opacity:.35;border:1px solid transparent;border-radius:7px;background:none;color:var(--muted);padding:1px 4px;cursor:pointer}
.qsec-dots svg{width:15px;height:15px;fill:currentColor;display:block}
.preview-section:hover>h2>.qsec>.qsec-dots,.preview-section:hover>h3>.qsec>.qsec-dots,.preview-section:hover>h4>.qsec>.qsec-dots,.qsec-dots:hover,.qsec-dots:focus-visible,.qsec-dots[aria-expanded="true"]{opacity:1;border-color:var(--border);background:var(--surface-2);color:var(--text)}
@media (max-width:1100px){.qbar{flex-wrap:wrap;max-width:min(100%,320px)}}
.publish-rail{position:sticky;top:var(--publish-rail-top);display:grid;gap:14px;max-height:calc(100vh - var(--publish-rail-top) - 12px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;min-width:0}
.inbox-group{margin:0 0 6px}
.inbox-group>h4{margin:8px 0 4px;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.inbox-item{display:flex;align-items:center;gap:9px;width:100%;background:none;border:0;border-radius:9px;padding:8px;text-align:left;font:inherit;font-size:13px;color:var(--text);cursor:pointer}
.inbox-item:hover{background:var(--surface-2)}
.inbox-item.is-open{display:block;background:var(--surface-2);cursor:default;padding:10px 10px 12px;margin:2px 0 6px}
.inbox-item-head{display:flex;align-items:center;gap:9px;font-weight:700}
.inbox-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--mvta-orange-ink)}
.inbox-dot.cause-companion{background:var(--accent)}
.inbox-dot.cause-sign-off{background:var(--muted)}
.inbox-label{flex:1;min-width:0;overflow-wrap:anywhere}
.inbox-count{flex:none;font-size:11px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.inbox-marker{display:block;margin:6px 0 2px;font-size:11px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}
.inbox-hint{display:block;font-size:11.5px;color:var(--muted);line-height:1.45;margin:2px 0 8px}
.inbox-item .marker-settle{margin-top:8px}
.marker-place-go{margin-left:6px;padding:0}
@media(max-width:1100px){.publish-canvas-layout{grid-template-columns:minmax(0,1fr)}.publish-rail{position:static;max-height:none;overflow:visible;order:-1}.publish-head-side{justify-items:start}.publish-head-actions{justify-content:flex-start}}
@media(max-width:700px){.publish-canvas-grid{grid-template-columns:minmax(0,1fr)}.publish-outline{display:none}.publish-canvas-doc{padding:20px 18px}}
.proposal-card{margin-top:8px;padding:8px 10px;display:grid;gap:4px;border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:8px;background:var(--surface-2);font-size:12px;line-height:1.45}
.proposal-card.needs-you{border-left-color:var(--warning,#b54708)}
.proposal-card small{display:block;font-size:11px;color:var(--muted)}
.proposal-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
/* Glossary Suggestions on Publish: one card per undefined acronym. */
.gloss-suggestion{margin-top:8px;padding:8px 10px;display:grid;gap:6px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);font-size:12px;line-height:1.45}
.gloss-suggestion-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.gloss-suggestion textarea{width:100%;box-sizing:border-box;font:inherit}
.gloss-suggestion small{display:block;font-size:11px}
.gloss-rejected{margin-top:10px;font-size:12px}
.gloss-rejected ul{margin:6px 0 0;padding-left:18px}
.gloss-def{display:grid;gap:4px;font-size:10.5px;font-weight:700;color:var(--muted)}
.proposal-outcome{display:grid;gap:4px;font-size:11px;font-weight:600}
.marker-audit{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.marker-audit summary{cursor:pointer;font-size:11.5px;font-weight:700;color:var(--muted)}
.marker-audit ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:10px}
.marker-audit li{font-size:12px;line-height:1.45}
.marker-audit li code{display:block;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.marker-audit li strong{display:block;margin-top:2px}
.marker-audit li small{display:block;margin-top:2px;font-size:10.5px;color:var(--muted)}
/* Resolved review markers: a group of the SAME inbox list, collapsed by default.
   Styled to the approved mockup (2026-09-21): a tick rather than a cause dot, the
   decision as a tinted chip in sentence case, and each row on its own card. This
   panel therefore reads differently from the flat rows elsewhere in the app —
   that was the decision, and a wider pass is what would settle the difference. */
.resolved-group{margin-top:14px;padding-top:10px;border-top:1px solid var(--border)}
.resolved-group>h4{margin:0 0 6px}
.resolved-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:none;border:0;padding:2px 0;font:inherit;font-size:12px;font-weight:700;color:var(--text);cursor:pointer;text-transform:none;letter-spacing:0}
.resolved-toggle:hover .resolved-toggle-state{color:var(--text)}
.resolved-toggle-state{font-size:11px;font-weight:600;color:var(--muted)}
.inbox-item.is-resolved{display:flex;align-items:flex-start;gap:9px;cursor:default;padding:10px 11px;margin:0 0 6px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.inbox-item.is-resolved:hover{background:var(--surface)}
.inbox-mark{flex:none;display:grid;place-items:center;width:13px;height:13px;margin-top:2px;color:var(--success)}
.inbox-mark.is-undone{color:var(--muted)}
.resolved-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.resolution-chip{flex:none;font-size:10.5px;font-weight:650;padding:2px 8px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.resolution-chip.kind-answered,.resolution-chip.kind-rewritten{background:var(--success-soft);color:var(--success)}
.resolution-chip.kind-filled{background:var(--brand-soft);color:var(--brand)}
.resolution-chip.kind-reopened{background:var(--warning-soft);color:var(--warning)}
.inbox-item.is-resolved .resolved-value{display:block;margin-top:3px;font-size:12.5px;color:var(--text);line-height:1.45}
.inbox-item.is-resolved .muted{display:block;margin-top:3px;font-size:11px;color:var(--muted)}
.resolution-chip.is-undone{text-decoration:line-through;opacity:.65}
/* Nothing left to answer: the panel stays (it anchors the attention column) and
   turns from warning to success so the column reads as done, not empty. */
.publish-attention #publish-review-markers.is-clear{border-color:var(--success)}
.publish-attention #publish-review-markers.is-clear .panel-header{background:var(--success-soft)}

/* ── Warning alerts, and the indeterminate run indicator ──────────────────
   Brand colours only. The amber these carried is on no MVTA palette, and the
   copy failed contrast on its own tinted field (3.66:1 against a 4.5:1 floor).
   Tinting the field a brand orange does not fix that — Burnt Orange holds
   4.5:1 only to ~4% opacity — so the colour lives in the icon, the rule and
   the lead, and the copy sits on a clean field. See tokens.css.

   GATING IS THE DEFAULT, deliberately. A warning that blocks something and was
   never classified then looks exactly as loud as it does today; only an
   explicit .advisory quietens one. Defaulting the other way would let an
   unclassified blocker go quiet, which is the failure that actually costs. */
.inline-alert.warning{
  position:relative;padding-left:36px;
  border-left:0;                      /* replaces the 3px currentColor rule */
  background:var(--surface);
  border:1px solid var(--warn-gate-line);
  color:var(--warn-gate-ink);
}
.inline-alert.warning strong{color:var(--warn-gate-ink)}
.inline-alert.warning::before{
  content:"";position:absolute;left:12px;top:11px;width:16px;height:16px;
  background-color:currentColor;
  -webkit-mask:var(--warn-icon) center/16px 16px no-repeat;
          mask:var(--warn-icon) center/16px 16px no-repeat;
}
.inline-alert.warning.compact{padding-left:31px}
.inline-alert.warning.compact::before{left:10px;top:7px;width:14px;height:14px}
/* Advisory: no warm colour at all. This is most warnings, and the case where
   the amber was loudest for the least reason. */
.inline-alert.warning.advisory{
  background:var(--warn-adv-field);
  border-color:var(--warn-adv-line);
  color:var(--warn-adv-ink);
}
.inline-alert.warning.advisory strong{color:var(--warn-adv-ink)}
/* An alert already showing a spinner is reporting progress, not a warning;
   a second mark beside the spinner would be two icons saying different things. */
.inline-alert.warning:has(.spinner-inline){padding-left:13px}
.inline-alert.warning:has(.spinner-inline)::before{content:none}

/* The ONE "AI is working" indicator (services/ai-activity.js): every AI call
   on every screen draws one of three sizes of it — a card (ring, label,
   detail, clock, track), an inline wait, or a button's busy label — and the
   topbar pill (#ai-activity) repeats it on every page. It replaced six
   separate treatments (a spinner, a conic ring with a sweep, a sliding bar,
   spinning stage marks, an orbiting "AI" disc and a pulsing orb). The track is
   indeterminate unless the caller knows a real fraction; it is NOT .uw-bar,
   which stays a determinate marker-resolution bar. */
.ai-ring{--ai-ring:16px;display:inline-block;flex:0 0 var(--ai-ring);width:var(--ai-ring);height:var(--ai-ring);border-radius:50%;
  border:2px solid var(--run-track);border-top-color:var(--run-ink);box-sizing:border-box;vertical-align:-3px;animation:ai-spin 1s linear infinite}
@keyframes ai-spin{to{transform:rotate(1turn)}}
.ai-run-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:13px 15px;box-shadow:var(--shadow);text-align:left}
.ai-run-card .ai-ring{--ai-ring:20px}
.ai-run-card.is-warning{border-color:var(--warning)}
.ai-run-card.is-warning .ai-ring{animation:none;border-color:var(--warning)}
.ai-run-card.is-flash{animation:canvas-flash 1.2s ease-out}
.ai-run-head{display:flex;align-items:center;gap:12px}
.ai-run-text{flex:1;min-width:0;display:grid;gap:3px}
.ai-run-text b{font-size:13px;color:var(--text)}
.ai-run-text small{font-size:12px;color:var(--muted);line-height:1.45}
.ai-run-clock{flex:none;font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.ai-run-clock:empty{display:none}
.ai-run-track{height:4px;border-radius:999px;margin-top:11px;overflow:hidden;position:relative;background:var(--run-track)}
.ai-run-track::after{content:"";position:absolute;inset:0;width:40%;border-radius:999px;background:var(--run-ink);animation:ai-sweep 1.8s cubic-bezier(.65,0,.35,1) infinite}
.ai-run-track.is-determinate::after{content:none}
.ai-run-track.is-determinate i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--run-ink);transition:width .3s ease}
.ai-run-card.is-warning .ai-run-track i{background:var(--warning)}
@keyframes ai-sweep{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
.ai-run-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.ai-run-actions:empty{display:none}
.ai-run-inline{display:inline-flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}
.ai-run-inline .ai-run-label{color:var(--text);font-weight:600}
/* In a button the ring takes the button's own ink, so it reads on a filled
   primary button as well as on a text button. */
button .ai-ring{--ai-ring:12px;border-width:1.5px;margin-right:6px;vertical-align:-2px;border-color:color-mix(in srgb,currentColor 30%,transparent);border-top-color:currentColor}
/* The topbar pill: always in view, whatever the page has scrolled to. */
.ai-activity[hidden]{display:none}
.ai-pill{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 13px 0 11px;border-radius:999px;cursor:pointer;
  background:var(--run-soft);border:1px solid color-mix(in srgb,var(--run-ink) 30%,transparent);color:var(--run-ink);font-size:12px;font-weight:700}
.ai-pill .ai-ring{--ai-ring:14px;margin:0;border-width:2px}
.ai-pill-clock{font-variant-numeric:tabular-nums;opacity:.85}
.ai-pill:focus-visible{outline:2px solid var(--run-ink);outline-offset:2px}
.ai-pill.is-done{background:var(--success-soft);color:var(--success);border-color:transparent}
.ai-pill.is-stopped{background:var(--warning-soft);color:var(--warning);border-color:transparent}
.ai-pill-mark{font-weight:800}
@media(max-width:760px){.ai-pill-label{display:none}}
/* Still states, not absent states: both marks stay legible as in progress. */
@media(prefers-reduced-motion:reduce){
  .ai-ring{animation:none;border-color:var(--run-ink);background:var(--run-soft)}
  button .ai-ring{border-color:currentColor;background:transparent}
  .ai-run-track::after{animation:none}
  .ai-run-card.is-flash{animation:none}
}

/* ── The other three alert tones ──────────────────────────────────────────
   Structure only. Their fields already pass contrast — danger 5.62:1,
   success 4.67:1, info 6.07:1 — so the colours stay exactly as they were;
   what changes is that they now match the warning alert's anatomy instead of
   being the last things in the app wearing a 3px currentColor left rule and
   no icon. Warning is the one that had to leave its tint; the others did not,
   which is why the fills still differ by tone. */
.inline-alert.danger,.inline-alert.success,.inline-alert.info{
  position:relative;padding-left:36px;border-left:0}
.inline-alert.danger::before,.inline-alert.success::before,.inline-alert.info::before{
  content:"";position:absolute;left:12px;top:11px;width:16px;height:16px;
  background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:16px 16px;mask-size:16px 16px}
.inline-alert.danger::before{-webkit-mask-image:var(--alert-icon-danger);mask-image:var(--alert-icon-danger)}
.inline-alert.success::before{-webkit-mask-image:var(--alert-icon-success);mask-image:var(--alert-icon-success)}
.inline-alert.info::before{-webkit-mask-image:var(--alert-icon-info);mask-image:var(--alert-icon-info)}
.inline-alert.danger.compact,.inline-alert.success.compact,.inline-alert.info.compact{padding-left:31px}
.inline-alert.danger.compact::before,.inline-alert.success.compact::before,.inline-alert.info.compact::before{
  left:10px;top:7px;width:14px;height:14px;-webkit-mask-size:14px 14px;mask-size:14px 14px}
/* Same rule as the warning tone: a spinner already says "in progress". */
.inline-alert.danger:has(.spinner-inline),.inline-alert.success:has(.spinner-inline),
.inline-alert.info:has(.spinner-inline){padding-left:13px}
.inline-alert.danger:has(.spinner-inline)::before,.inline-alert.success:has(.spinner-inline)::before,
.inline-alert.info:has(.spinner-inline)::before{content:none}

/* ---- QRG Canvas Desk: block editor as a right-hand inspector (v6.13.76) ----
   syncIssuanceRail() now moves the Block editor panel into column 3, above the
   Issuance heading, instead of leaving it stacked in the centre column beneath
   the live preview. Column 3 keeps its original width; column 1 gives up ~40px so the centre
   column is WIDER than before this change, not narrower. */
.qrg-issuance-rail{max-height:calc(100vh - 36px);overflow:auto;overscroll-behavior:contain}
.qrg-inspector-panel{flex:none}
/* h3 + hint + "AI suggest content" don't fit on one line at this width. */
.qrg-inspector-panel .panel-header{flex-wrap:wrap;gap:8px}
@media(max-width:1024px){
  /* Both of these belong to the STACKED layout, and both used to sit at
     1200px — where the rail stopped being a column beside the canvas. v6.13.151
     moved that boundary to 1024px and left these behind, which broke the rail
     at 1025-1200: it is sticky there, and cancelling its max-height/overflow
     removed the internal scroll that makes a sticky column taller than the
     viewport usable. Measured at 1150x600 — a 742px rail stuck with its top
     168px above the viewport and no way to scroll back to the Block editor.
     Keep these two together with the two-up rail grid, whatever width that is.

     The editor takes the full width of that grid because its textareas are
     unusable in half a column. */
  .qrg-inspector-panel{grid-column:1/-1}
  .qrg-issuance-rail{max-height:none;overflow:visible}
}
@media print{
  /* An editing surface is not part of the printed guide. */
  .qrg-inspector-panel{display:none}
}

/* ---- QRG click-to-edit on the page (v6.13.78) -----------------------------
   Selecting a block by clicking it on the live preview. The dashed hover
   outline already existed for drag-to-reorder; this adds the solid selected
   state and a matching cursor. capture()'s onclone strips .is-selected, so the
   outline never reaches an exported PNG/PDF or the published document. */
.qrg-c-block[data-block-id]{cursor:pointer}
.qrg-c-block.is-selected{outline:2px solid var(--qrg-page-mark);outline-offset:2px;border-radius:2px}
/* Selected beats hover: without this the dashed hover outline replaces the
   solid one whenever the pointer happens to rest on the selected block. */
.qrg-c-block.is-selected:hover{outline:2px solid var(--qrg-page-mark)}
@media print{
  /* The page is the deliverable when printing; editing affordances are not. */
  .qrg-c-block.is-selected,.qrg-c-block:hover{outline:none}
}

/* ---- Modernised form fields + inference tags (v6.13.79) --------------------
   The .field rule added in v6.9.125 fixed the layout (label above control) but
   kept the flat 1px box the rest of the app has had since v6. These are the
   controls operators spend the most time in, so: a slightly inset surface that
   reads as an input rather than an outlined div, a real focus ring instead of a
   colour swap, and a label that responds to focus so it is obvious which field
   is live in a column of eight. Applies to .field only, so nothing else in the
   app shifts. */
.field{gap:5px}
.field>span{letter-spacing:.02em;transition:color .12s ease}
.field>input,.field>select,.field>textarea{
  background:var(--surface-2);
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px 12px;
  font-size:13px;
  transition:background .12s ease,border-color .12s ease,box-shadow .12s ease;
}
.field>input:hover,.field>select:hover,.field>textarea:hover{border-color:color-mix(in srgb,var(--text) 22%,var(--border))}
.field>input:focus,.field>select:focus,.field>textarea:focus{
  background:var(--surface);
  border-color:var(--brand);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 15%,transparent);
  outline:none;
}
.field:focus-within>span{color:var(--brand)}
.field>input::placeholder,.field>textarea::placeholder{color:var(--text-muted);opacity:.75}

/* Inference provenance: quiet by default, because the useful signal is the
   ABSENCE of a tag once you have edited a field. */
.qrg-prov{
  font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:2px 6px;border-radius:5px;white-space:nowrap;
  background:var(--surface-3);border:1px solid var(--border);color:var(--text-muted);
}
.qrg-prov.is-own{background:var(--brand-soft);border-color:var(--brand);color:var(--brand)}

/* ---- Nested Content blocks outline (v6.13.80) ------------------------------
   Replaces a flat list whose only hint of the printed layout was the words
   "Left column" on each row. Blocks now nest under their section header and the
   groups mirror the page's columns, so a 16-block guide collapses to its five
   sections. */
/* Regions are explicit containers you drop into, stacked in printed order.
   They were briefly laid out side by side to mirror the printed page, which is
   the better idea and does not fit: the builder sidebar is 280px, so two
   columns came out 110px each and a block row collapsed to 18px around 51px of
   content. Measured, not guessed. The page's geometry is mirrored on the canvas
   next door, which has the width for it; here the region header carries the
   placement and the rows stay readable. */
.qrg-outline-page{display:flex;flex-direction:column;gap:8px}
.qrg-outline-cols{display:flex;flex-direction:column;gap:8px}
/* The columns are the guide's body, so they read as the primary regions and the
   bands as the strips above and below them. */
.qrg-outline-group.is-left,.qrg-outline-group.is-right{background:var(--surface-2)}
.qrg-outline-group{border:1px solid var(--border);border-radius:9px;background:var(--surface-2);padding:7px 8px 8px;min-width:0}
/* A band runs the width of the page, so it reads as a strip rather than a card. */
.qrg-outline-group.is-top,.qrg-outline-group.is-bottom{background:var(--surface-3)}
.qrg-region-body{display:flex;flex-direction:column;gap:6px;min-height:34px}
/* An empty region is still a drop target, so it has to look like somewhere a
   block can go rather than like a rendering fault. */
.qrg-outline-group.is-empty{border-style:dashed;background:transparent}
.qrg-region-empty{margin:0;padding:6px 2px;color:var(--muted);font-size:10.5px;line-height:1.4}
/* Placement on the selected outline row. Full width beneath the row rather
   than inline beside the move arrows: at the sidebar's 227px there is no room
   for a fourth control on that line, and the row's own label must not shrink. */
.qrg-row-place{display:block;margin:4px 0 2px}
/* Sidebar tabs. Same pill shape as the preview's Page/Review/List so the two
   tab groups in the builder read as one control type, but full width because
   this one governs the whole column rather than sitting in a panel header. */
.qrg-sidebar-tabs{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:3px;margin-bottom:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:999px}
.qrg-sidebar-tabs button{background:none;border:0;border-radius:999px;padding:7px 10px;font-size:11.5px;font-weight:650;color:var(--muted);cursor:pointer;transition:background 150ms ease,color 150ms ease}
.qrg-sidebar-tabs button.on{background:var(--mvta-green);color:#fff;font-weight:700}
.qrg-sidebar-tabs button:not(.on):hover{color:var(--text);background:var(--surface-3)}
.qrg-sidebar-tabs button:focus-visible{outline:2px solid var(--mvta-green);outline-offset:2px}
/* One authored moment: the incoming panel settles up into place. render()
   replaces the subtree, so the animation runs on mount of the new panel and
   needs no state of its own. Exponential ease-out from an already-visible
   default, so a dropped animation still shows the panel. */
.qrg-sidebar-panel{animation:qrg-tab-in 220ms cubic-bezier(.16,1,.3,1) both}
@keyframes qrg-tab-in{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.qrg-sidebar-panel{animation:none}.qrg-sidebar-tabs button{transition:none}}
.qrg-row-place select{width:100%;font-size:11px;padding:4px 6px;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text)}
.qrg-row-place select:focus{border-color:var(--mvta-green);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--mvta-green) 16%,transparent)}
.qrg-region-body.drop-into{outline:2px solid var(--mvta-green);outline-offset:2px;border-radius:6px}

.qrg-outline-label{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:0 2px 6px}
.qrg-outline-sec+.qrg-outline-sec{margin-top:6px}
.qrg-sec-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:4px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:3px 6px}
.qrg-sec-head.selected{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 18%,transparent)}
.qrg-sec-toggle{background:none;border:0;color:var(--text-muted);cursor:pointer;font-size:10px;width:18px;padding:2px}
.qrg-sec-toggle:hover{color:var(--text)}
.qrg-sec-title{background:none;border:0;text-align:left;cursor:pointer;color:var(--text);
  font-size:11.5px;font-weight:700;padding:3px 2px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrg-sec-count{font-size:10px;color:var(--text-muted);min-width:14px;text-align:right}
/* Indent the children so the nesting is visible, with a rule tying them to the
   header they belong to. */
.qrg-sec-kids{padding:4px 0 2px 10px;margin-left:8px;border-left:1px solid var(--border);display:flex;flex-direction:column;gap:5px}
.qrg-outline-sec .qrg-sec-kids:empty{display:none}

/* ---- Page / Review / List views (v6.13.81) --------------------------------- */
.qrg-viewtabs{display:inline-flex;background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:3px;gap:2px;margin-top:6px}
.qrg-viewtabs button{background:none;border:0;border-radius:999px;padding:4px 12px;font-size:11.5px;cursor:pointer;color:var(--text-muted)}
.qrg-viewtabs button.on{background:var(--brand);color:#fff;font-weight:700}
.qrg-viewtabs button:not(.on):hover{color:var(--text)}

.qrg-review{padding:16px 18px;display:flex;flex-direction:column;gap:20px;max-height:calc(100vh - 210px);overflow:auto}
.qrg-rev-block h4{margin:0 0 7px;font-size:13px;display:flex;align-items:center;gap:8px}
.qrg-rev-block>p{margin:0 0 8px}
.qrg-rev-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.qrg-rev-list li{border:1px solid var(--border);border-radius:9px;padding:9px 11px;background:var(--surface-2)}
.qrg-rev-list li.is-blocking{background:var(--status-warning-bg);border-color:var(--status-warning-border)}
.qrg-rev-list li.is-risk{background:var(--status-pending-bg);border-color:var(--status-pending-border)}
.qrg-rev-list strong{display:block;font-size:12.5px}
.qrg-rev-list small{display:block;font-size:11.5px;color:var(--text-muted);margin-top:2px}
.qrg-flag{width:100%;text-align:left;background:none;border:0;padding:0;cursor:pointer;color:inherit}
.qrg-flag code{background:rgba(0,0,0,.08);padding:1px 4px;border-radius:3px;font-size:10.5px}
/* Label above value, tag pinned top-right: this column is ~400px and a long
   title wrapped four deep when the label sat beside it. */
.qrg-prov-list{margin:0;display:flex;flex-direction:column}
.qrg-prov-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:9px 0}
.qrg-prov-row+.qrg-prov-row{border-top:1px solid var(--border)}
.qrg-prov-row dt{grid-column:1;grid-row:1;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.qrg-prov-row dd{grid-column:1;grid-row:2;margin:0;min-width:0}
.qrg-prov-row dd strong{display:block;font-size:13px;word-break:break-word}
.qrg-prov-row dd small{display:block;font-size:11px;color:var(--text-muted);margin-top:1px}
.qrg-prov-row .qrg-prov{grid-column:2;grid-row:1}
.qrg-fill-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.qrg-fill-row span{font-size:11.5px;color:var(--text-muted)}
.qrg-fill-row small{font-size:11px;color:var(--text-muted)}
.qrg-fill-bar{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden;margin:4px 0}
.qrg-fill-bar i{display:block;height:100%;background:var(--brand)}
.qrg-fill-bar.over i{background:var(--warning)}

.qrg-list-view{max-height:calc(100vh - 210px);overflow:auto}
.qrg-list-head,.qrg-list-row{display:grid;grid-template-columns:26px minmax(90px,120px) 46px minmax(0,1fr) 70px;gap:10px;align-items:start;padding:8px 14px}
.qrg-list-head{position:sticky;top:0;z-index:2;background:var(--surface-2);border-bottom:1px solid var(--border);
  font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted)}
.qrg-list-row{border-bottom:1px solid var(--border)}
.qrg-list-row:hover{background:var(--surface-2)}
.qrg-list-row.on{background:var(--brand-soft);box-shadow:inset 3px 0 0 var(--brand)}
.qrg-list-n{font-size:11px;color:var(--text-muted);padding-top:3px}
.qrg-list-type{display:flex;align-items:center;gap:5px;background:none;border:0;text-align:left;cursor:pointer;color:var(--text);padding:2px 0;min-width:0}
.qrg-list-type strong{font-size:11.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrg-list-col{font-size:10.5px;color:var(--text-muted);padding-top:3px}
.qrg-list-content{font-size:12.5px;line-height:1.5;min-width:0;word-break:break-word}
.qrg-list-edit{display:flex;flex-direction:column;gap:8px;padding:2px 0 4px}
@media(max-width:1200px){
  .qrg-review,.qrg-list-view{max-height:none}
}
/* .qrg-outline-break is gone with the column-break block: a region is stated
   per block, so there is no marker between the columns to draw. */
.qrg-place-field{margin-bottom:10px}
/* Band drop targets on the canvas. Quiet by default because a band is usually
   empty and the page preview must still read as the printed page; they carry
   data-export-hide so capture()'s ignoreElements drops them from the PNG, the
   PDF and the published file. */
.qrg-c-banddrop{margin:0 0 4px;padding:5px 7px;border:1px dashed var(--border);border-radius:5px;color:var(--muted);font-size:7.5px;text-align:center;letter-spacing:.02em}
.qrg-c-banddrop.drop-into,.qrg-c-coldrop.drop-into{border-color:var(--mvta-green);color:var(--mvta-green)}

/* ---- Unified landing library + menus (v6.13.82) ---------------------------- */
.qrg-lib-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.qrg-lib-filters{display:flex;gap:5px;flex-wrap:wrap}
.chip-toggle{background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:4px 11px;font-size:11.5px;cursor:pointer;color:var(--text-muted)}
.chip-toggle:hover{color:var(--text)}
.chip-toggle.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:700}
.qrg-lib-controls select{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;padding:5px 9px;font-size:12px}
.qrg-lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.qrg-lib-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.qrg-lib-card:hover{border-color:var(--brand)}
.qrg-lib-thumb{border:0;background:var(--surface-2);padding:12px 12px 0;cursor:pointer;display:block;width:100%}
.qrg-lib-meta{padding:10px 12px 12px;display:flex;flex-direction:column;gap:5px}
.qrg-lib-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.qrg-lib-meta strong{font-size:12.5px;line-height:1.35}
.qrg-lib-meta small{color:var(--text-muted);font-size:11px}
.qrg-lib-meta .secondary{align-self:flex-start;margin-top:4px}
.qrg-chip{font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:2px 7px;border-radius:5px;border:1px solid;white-space:nowrap}
.qrg-chip.is-local{background:var(--status-pending-bg);border-color:var(--status-pending-border);color:var(--status-pending-text)}
.qrg-chip.is-saved{background:var(--status-draft-bg);border-color:var(--status-draft-border);color:var(--status-draft-text)}
.qrg-chip.is-published{background:var(--status-approved-bg);border-color:var(--status-approved-border);color:var(--status-approved-text)}

/* Destructive actions live behind ⋯ rather than sitting at equal weight on every
   row, which is what made Delete the second most prominent control on the page. */
.qrg-menu-wrap{position:relative}
.qrg-dots{background:none;border:0;color:var(--text-muted);cursor:pointer;font-size:15px;line-height:1;padding:2px 6px;border-radius:6px}
.qrg-dots:hover{background:var(--surface-2);color:var(--text)}
.qrg-menu{position:absolute;top:calc(100% + 5px);right:0;z-index:40;min-width:190px;padding:5px;
  background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column}
.qrg-menu.right{right:0}
.qrg-menu button{background:none;border:0;text-align:left;padding:7px 10px;border-radius:6px;font-size:12.5px;cursor:pointer;color:var(--text)}
.qrg-menu button:hover{background:var(--surface-2)}
.qrg-menu hr{border:0;border-top:1px solid var(--border);margin:4px 0}

/* Page thumbnail: the guide's real page (pageHtml(), the same renderer as the
   builder canvas and the exports) at Letter width, scaled into the card.
   --qrg-thumb-scale is card width / 612px, set on the grid by sizeThumbs()
   from measured geometry. The outer box keeps the page's aspect ratio so the
   grid lays out before the scale is known; a guide longer than one page is
   clipped at the bottom, exactly where the printed first page ends. */
.qrg-thumb{width:100%;aspect-ratio:612/792;background:#fff;border:1px solid var(--border);border-radius:5px;overflow:hidden;display:flex;flex-direction:column}
.qrg-thumb.is-live{position:relative;display:block}
.qrg-thumb-scale{position:absolute;left:0;top:0;width:612px;transform-origin:top left;transform:scale(var(--qrg-thumb-scale,.33));pointer-events:none;user-select:none;content-visibility:auto;contain-intrinsic-size:612px 792px}
.qrg-thumb-scale .qrg-page{box-shadow:none;min-height:792px}
/* No page shape to draw (a published output — the landing loads outputs
   metadata-only on purpose). Say so, rather than rendering the empty page frame
   that made every published card look like an empty guide. */
.qrg-thumb.is-noshape{align-items:center;justify-content:center;gap:6px;background:var(--surface-2);border-style:dashed;color:var(--muted)}
.qrg-thumb-glyph{font-size:26px;line-height:1;opacity:.55}
.qrg-thumb-note{font-size:11px;letter-spacing:.02em}
.qrg-preflight{margin:0 18px 12px;padding:12px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:11px}
.qrg-preflight-head{display:flex;flex-direction:column;gap:2px;margin-bottom:4px}
.qrg-preflight-head strong{font-size:13px}
.qrg-preflight-head .muted{font-size:11.5px}
.qrg-preflight .qrg-prov-row{grid-template-columns:minmax(0,1fr);padding:7px 0}

/* The live page stays in the DOM in every view, parked off-screen when Review or
   List is showing. It cannot be display:none or visibility:hidden: capture()
   feeds #qrg-canvas to html2canvas for PNG, PDF **and publish**, and
   measureOverflow() needs real geometry for the page count and column fill. With
   the canvas removed, all three exports threw and the fill bars went stale the
   moment you edited from another view. */
.qrg-canvas-outer.is-offstage{position:absolute;left:-100000px;top:0;width:612px;pointer-events:none}

/* ---- Publish drawer (v6.13.84) ---------------------------------------------
   Publishing is the one irreversible step in the builder, so the reasons it is
   blocked belong at the moment of the decision rather than only in a rail the
   operator may have collapsed twenty minutes earlier. */
.qrg-scrim{position:fixed;inset:0;z-index:80;background:rgba(8,18,14,.5);display:flex;justify-content:flex-end}
.qrg-drawer{background:var(--surface);width:min(430px,100%);height:100%;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.qrg-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border)}
.qrg-drawer-head strong{display:block;font-size:14px}
.qrg-drawer-head .muted{font-size:11.5px}
.qrg-drawer-body{padding:16px 18px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:12px}
.qrg-drawer-body .qrg-rev-list li{display:grid;gap:6px}
.qrg-drawer-body .qrg-rev-list .secondary{justify-self:start}
.qrg-drawer-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 18px;border-top:1px solid var(--border);background:var(--surface-2)}

/* ==========================================================================
   Governed status colour on the Create a Document workflow.
   Adopts the MVTA-STY-001 pairs declared in tokens.css (--gov-*) for the
   places on this screen where the generic ramp was saying the wrong thing.
   Scoped to these components on purpose: --danger/--success stay untouched
   app-wide, so nothing outside the workflow shifts.
   ========================================================================== */

/* --- the wire ------------------------------------------------------------
   The rail's own code comment calls it "one continuous bar across the whole
   workflow", but no `li.done` rule existed anywhere in this file: a finished
   stop's segment was pixel-identical to a stop nobody had reached, and the
   only difference was the 23px dot. Reading progress meant reading five dots
   instead of seeing a filled length. The bar now carries it — traversed
   segments take a brand-tinted field and edge, the road ahead stays hairline,
   and `skip`'s existing dashed border keeps its separate meaning. Placed
   before .active/.stale in source order so both still win on the current
   stop, whose lifted ring is doing real work marking position. */
.uw-rail li.done button{background:var(--brand-soft,var(--mvta-green-soft));border-color:color-mix(in srgb,var(--brand) 26%,var(--border))}
.uw-rail li.done .uw-rname{color:var(--brand)}

/* Same omission in the Review Activity feed: the dots carry four states while
   the 1px thread joining them was --border in every one of them. */
.timeline-entry.done::before{background:color-mix(in srgb,var(--gov-teal-mid) 45%,transparent)}
.timeline-entry.pending::before{background:color-mix(in srgb,var(--warn-gate-ink) 38%,transparent)}

/* --- QA summary strip ----------------------------------------------------
   Governed pairs for the three counting badges, plus `open` — the variant
   that never existed, which is why the one badge carrying outstanding
   required work fell through to neutral grey while already-passed checks
   were green. Marker Amber does the outlining and Burnt Orange does the
   reading: the amber is a 2.03:1 fill and must never become ink. */
.qa-summary-strip .badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;font-size:10.5px}
.badge .badge-mark{display:inline-flex;flex:none}
.badge .badge-mark svg{display:block}
.qa-summary-strip .badge.danger{background:var(--gov-red-field);color:var(--gov-red)}
.qa-summary-strip .badge.success{background:var(--gov-teal-field);color:var(--gov-teal)}
.qa-summary-strip .badge.warning{
  background:var(--gov-amber-field);color:var(--gov-amber-ink);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gov-amber-rule) 55%,transparent);
}
/* `open` and `warning` are both amber because both are advisory, but they ask
   for different things — `warning` flags checks the review wants looked at,
   `open` counts work only the operator can do. Given the same filled field
   they were indistinguishable on the strip, so `open` keeps the amber rule
   and ink and drops the fill: outstanding and awaiting you, not flagged. */
.badge.open{
  background:var(--surface);color:var(--gov-amber-ink);
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--gov-amber-rule) 70%,transparent);
}

/* A quality review the pipeline has invalidated must not keep asserting its
   counts. The screen already said so in prose — "the checks and questions
   below describe the earlier version" — directly above fourteen green passes
   still making the claim it withdrew. The numbers stay (they are the last
   real answers) but they stop carrying severity until the review is re-run. */
.qa-summary-strip.stale .badge.danger,.qa-summary-strip.stale .badge.warning,
.qa-summary-strip.stale .badge.success,.qa-summary-strip.stale .badge.open{
  background:var(--surface-2);color:var(--muted);
  box-shadow:inset 0 0 0 1px var(--border);
}

/* ==========================================================================
   Document Section Rule dialog — brought onto the same shell as the other
   Administration reference editors (.admin-ref-modal). It was the one dialog
   still on the older `.modal-card wide` pattern: no subtitle, no inline error
   slot, and a native alert() on failure against this file's own convention.
   ========================================================================== */

/* .modal-card scrolls the whole card, which carried the heading and the Save
   button off-screen on a form this long — visible as a dialog whose title you
   could not see while filling it in. Scroll the fields instead, so the heading
   stays put and Save is always reachable. */
.admin-reqsec-modal{display:flex;flex-direction:column;max-height:min(86vh,860px)}
.admin-reqsec-modal header,.admin-reqsec-modal footer{flex:none}
.admin-reqsec-modal .form-grid{overflow-y:auto;min-height:0}

/* Category gate. Was a native multiple-select that needed the instruction
   "Ctrl/Cmd-click to pick more than one" — an affordance nobody discovers, and
   one that silently loses every prior choice on a stray click. Checkboxes make
   the multi-select nature visible and cost nothing to learn. */
.admin-cat-picker{border:1px solid var(--border);border-radius:10px;padding:12px 14px 13px;margin:0;background:var(--surface-2)}
.admin-cat-picker legend{padding:0 6px;font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--muted)}
.admin-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px 10px;margin-bottom:8px}
/* .form-grid label is display:grid (0,2,0), which stacked the box above its
   code. Matched from the fieldset so the row wins on specificity. */
.admin-cat-picker .admin-cat-option{display:flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface);font-size:12px;font-weight:600;cursor:pointer}
.admin-cat-picker .admin-cat-option:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}
.admin-cat-picker .admin-cat-option input{margin:0;accent-color:var(--accent);cursor:pointer}
.admin-cat-picker .admin-cat-option:has(input:checked){border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.admin-cat-picker .admin-cat-option:focus-within{outline:2px solid var(--accent);outline-offset:1px}

/* An inset panel: a report opened inside a tab, rather than a modal over it. */
.panel-inset{margin:0 0 14px;padding:13px 15px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.panel-inset .panel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.panel-inset .data-table{font-size:12px}
/* The usage report's finding is a sentence, and the app-wide nowrap applies only
   to a table's last column (so an action-button row cannot break) — so the
   finding must not BE the last column. It is followed by the Open rule button,
   which is exactly what that nowrap is for. Keep it that way rather than
   overriding: an override here needs #admin-content in the selector to outrank
   the id-scoped rule it fights, which is a trap worth not setting. */
.panel-inset .data-table td.wrap-cell{white-space:normal;min-width:260px}
.admin-impact-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.admin-impact{display:flex;flex-direction:column;gap:2px;padding:8px 11px;border-left:3px solid var(--border);border-radius:0 8px 8px 0;background:var(--surface-2);font-size:12px}
.admin-impact strong{font-size:12px}
.admin-impact span{color:var(--muted);line-height:1.45}
.admin-impact.critical{border-left-color:var(--danger,#b3261e)}
.admin-impact.warning{border-left-color:var(--warning,#b26b00)}
.admin-impact.info{border-left-color:var(--accent)}
.admin-scope-modes{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.admin-scope-mode{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;cursor:pointer}
.admin-scope-mode input{margin:0;accent-color:var(--accent);cursor:pointer}
.admin-cat-chips{display:flex;flex-wrap:wrap;gap:7px;min-height:26px;margin-bottom:9px;font-size:12px}
.admin-cat-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 6px 4px 10px;border:1px solid var(--accent);border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:600}
.admin-cat-chip.warning{border-color:var(--warning,#b26b00);background:color-mix(in srgb,var(--warning,#b26b00) 12%,transparent);color:var(--warning,#b26b00)}
.admin-chip-remove{border:0;background:none;padding:0 2px;font-size:14px;line-height:1;color:inherit;cursor:pointer;opacity:.75}
.admin-chip-remove:hover{opacity:1}
#reqsec-scope-search{width:100%;padding:6px 9px;border:1px solid var(--border);border-radius:8px;font-size:12px;background:var(--surface)}
.admin-cat-choices{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px;font-size:12px}
.admin-cat-choice{padding:4px 10px;border:1px dashed var(--border);border-radius:999px;background:var(--surface);font-size:12px;font-weight:600;cursor:pointer;color:var(--text)}
.admin-cat-choice:hover{border-style:solid;border-color:var(--accent);color:var(--accent)}
/* The AI drafting row sits between the rule's identity fields and the three
   guidance fields it writes into, so the relationship reads without a caption
   explaining it. The status line is where the run reports itself; it must be
   able to grow to a full error message without pushing the button around. */
.admin-guidance-actions{display:flex;align-items:flex-start;gap:12px;padding:11px 13px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.admin-guidance-actions button{flex:none}
.admin-guidance-actions small{flex:1;min-width:0;line-height:1.45}

/* The error is the last child of the scrolling field area, so on a form this
   long it rendered below the fold — an error nobody sees is the same as none.
   Pin it to the bottom of the scroll region, directly above the footer. */
.admin-reqsec-modal .admin-form-error:not([hidden]){
  position:sticky;bottom:0;z-index:1;
  /* --danger-soft is an alpha wash, so as a sticky layer the fields scrolled
     visibly through the message. Same colour, composited opaque. */
  background:color-mix(in srgb,var(--danger) 12%,var(--surface));
  border:1px solid color-mix(in srgb,var(--danger) 30%,transparent);
  box-shadow:0 -6px 14px -8px rgba(0,0,0,.35);
}

/* Review the plan → "AI analysis context": the Category / Generation mode /
   Purpose footer is three label+value pairs written as bare inline <span>s.
   Every unified-plan-* class was unstyled, so they butted together and read as
   "Category ADMGeneration modeMode 2Purpose ...". Space the pairs, and give
   Purpose its own line since its value is a sentence, not a token. */
.unified-plan-analysis-meta{
  display:flex;flex-wrap:wrap;gap:8px 20px;
  margin-top:14px;padding-top:12px;border-top:1px solid var(--border);
  font-size:12px;color:var(--muted)
}
.unified-plan-analysis-meta>span{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:6px;min-width:0}
.unified-plan-analysis-meta>span:last-child{flex-basis:100%}
.unified-plan-analysis-meta b{color:var(--text);overflow-wrap:anywhere}

/* Generate step, Classification/Identity cards. Two problems, both from the
   grid tracks being sized by their contents rather than by the card:
   1. A <select>'s min-content width is its widest option ("Digital acceptance
      only"), and a label-row's Suggest button is a second floor. With
      minmax(auto,1fr) tracks neither could shrink, so the right-hand column
      spilled past the card border and under the neighbouring card. The track
      fix is on .form-grid itself; the controls need min-width:0 too, or their
      own automatic minimum size re-creates the overflow inside the label.
   2. A field whose label carries a Suggest button has a taller first row than
      a plain-text label, so its control sat lower than the one beside it.
      Giving every row the same floor and centring its content lines the
      labels — and therefore the controls — up across the pair. align-content
      must be start as well: a field with a trailing <small> makes its grid cell
      taller than its neighbour's, and the default stretch spread that slack
      across the shorter field's rows, pushing its label and control down. */
#generation-form .setup-card .form-grid>label{min-width:0;align-items:center;align-content:start;grid-auto-rows:minmax(22px,auto)}
#generation-form .setup-card .form-grid input,
#generation-form .setup-card .form-grid select,
#generation-form .setup-card .form-grid textarea{min-width:0;max-width:100%}

/* Review the plan → a section's evidence location. Every other .badge is a short
   status pill, so .badge carries white-space:nowrap — right for "APPLICABLE",
   wrong for a model-written sentence like "Throughout PROCEDURE section; terms
   introduced contextually but not formally defined", which ran straight off the
   card and was clipped mid-word. This one badge wraps: inline-block so it keeps
   its pill shape and drops to its own line when it does not fit, rather than
   splitting the box across two lines the way display:inline would. */
.badge.evidence-location{
  display:inline-block;white-space:normal;max-width:100%;
  overflow-wrap:anywhere;line-height:1.5;text-align:left
}

/* ---- Shared confirmation dialog (utils.js confirmDialog) -------------------
   confirmDialog() has existed since the Documents delete and the Finalize
   confirmation, but .confirm-dialog-card was never styled — so it rendered as a
   bare <dialog>: full-bleed, default black border, the close × on its own line,
   footer buttons hard against the left edge. Close enough to the browser's own
   window.confirm() that moving Start over onto it would not have looked like a
   move at all. Styled here once, so all three callers gain it.

   The <dialog> element itself carries no app styling by default and centres via
   its own margin:auto — both are set explicitly rather than inherited. */
#confirm-dialog{
  border:1px solid var(--border);border-radius:var(--radius);padding:0;
  width:min(480px,calc(100vw - 32px));max-width:none;box-sizing:border-box;
  max-height:calc(100dvh - 32px);overflow:auto;
  background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg)
}
#confirm-dialog::backdrop{background:rgba(10,25,19,.42)}
/* The dialog arrives the way the app's menus do (app-menu-in): a short settle
   from just below, not a pop. @starting-style gives the open state something to
   transition from; a browser without it draws the dialog open at once, which is
   what it did before. */
#confirm-dialog[open]{opacity:1;transform:none;transition:opacity .16s ease-out,transform .16s ease-out}
@starting-style{#confirm-dialog[open]{opacity:0;transform:translateY(8px) scale(.985)}}
@media (prefers-reduced-motion: reduce){#confirm-dialog[open]{transition:none}}
/* A message can carry a token nothing can break — a SharePoint file name is
   the one that did (v6.15.12). A grid item is min-content wide by default, so
   that token widened the card past the dialog, the dialog grew a horizontal
   scrollbar and the Finalize button was pushed off its right edge. Every block
   in the card may shrink below its content, and a long token wraps. */
.confirm-dialog-card{display:grid;gap:14px;padding:20px 22px 18px;margin:0;min-width:0;overflow-wrap:anywhere}
.confirm-dialog-card>*{min-width:0}
.confirm-dialog-card header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.confirm-dialog-card h2{margin:0;font-size:16px;line-height:1.3;letter-spacing:-.01em}
/* The × is a secondary way out; the named Cancel button in the footer is the
   primary one, so this stays quiet and small rather than a 40px control. */
.confirm-dialog-card header .icon-button{
  width:28px;height:28px;flex:none;display:grid;place-items:center;
  font-size:16px;line-height:1;color:var(--muted)
}
.confirm-dialog-card p{margin:0;color:var(--muted);line-height:1.55;font-size:13px}
/* A plan ("1. Fill … 2. Move … 3. Record …") is a list, numbered by the browser.
   The steps are the body of the decision, so they read in the text colour; the
   sentences around them stay muted. A file name is set apart from the sentence. */
.confirm-dialog-steps{margin:0;padding:0 0 0 22px;display:grid;gap:8px;color:var(--text);font-size:13px;line-height:1.55}
.confirm-dialog-steps li{padding-left:2px}
.confirm-dialog-steps li::marker{color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
/* What follows the plan is its consequence ("This cannot be undone from this
   screen.", a team-override note) and is read in the text colour with it; a
   message that is only prose keeps the muted paragraph. */
.confirm-dialog-steps~p{color:var(--text)}
/* A step's details — the files a move takes — are a quiet list under its
   sentence: one name per line in small muted monospace, no chip, because a chip
   per fragment of two wrapped file names is what made the plan read as code. A
   name longer than the line still wraps between its words (the <wbr>s). */
.confirm-dialog-details{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:3px}
.confirm-dialog-details li{color:var(--muted);font-size:12px;line-height:1.45}
.confirm-dialog-details .confirm-dialog-file{display:block;background:transparent;border:0;border-radius:0;padding:0;font-size:11.5px;color:var(--muted)}
/* A file name that wraps (utils.js puts a <wbr> after each underscore) is drawn
   as a whole chip on each line — box-decoration-break:clone closes the border at
   the wrap instead of leaving an open-ended box on both lines. */
.confirm-dialog-file{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;background:var(--surface-2, rgba(0,0,0,.04));border:1px solid var(--border);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* A multi-paragraph message: the parts need space between them, and the block
   itself must not collapse the gap the card's grid already provides. */
.confirm-dialog-card>div{display:grid;gap:10px}
.confirm-dialog-card footer{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:4px}
/* A destructive confirm must not be the same green as "save". .danger elsewhere
   is a soft-tinted badge, so it is restated here as a solid button: this is the
   action that discards work and it should read that way. */
.confirm-dialog-card .primary.danger{background:var(--danger);color:#fff}
/* Dark flips --danger to a light red (#ff7a7e) for use as TEXT, so white on it is
   unreadable — the ink has to invert with the fill. */
html[data-theme="dark"] .confirm-dialog-card .primary.danger{color:#2a0a0b}
.confirm-dialog-card .primary.danger:hover{filter:brightness(1.08)}
/* The app's focus ring is the brand green; on a red button it read as a second,
   unrelated colour wrapped around the most consequential control on the screen.
   The ring takes the button's own colour, held off it by a gap in the surface. */
.confirm-dialog-card .primary.danger:focus-visible{outline:3px solid var(--danger);outline-offset:2px;box-shadow:0 0 0 2px var(--surface)}
/* promptDialog(): the question's answer field. The label text sits above the
   control; "Required" is stated in words, not only by a disabled button. */
.confirm-dialog-field{display:grid;gap:6px;font-size:13px}
.confirm-dialog-field>span{font-weight:600;color:var(--text)}
.confirm-dialog-field em{font-style:normal;font-weight:500;color:var(--muted);margin-left:6px;font-size:12px}
.confirm-dialog-field input,.confirm-dialog-field textarea,.confirm-dialog-field select{
  width:100%;box-sizing:border-box;font:inherit;font-size:14px;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:9px 11px
}
.confirm-dialog-field textarea{resize:vertical;min-height:84px;line-height:1.45}
.confirm-dialog-field input:focus-visible,.confirm-dialog-field textarea:focus-visible,.confirm-dialog-field select:focus-visible{outline:2px solid var(--accent, #0b5d3b);outline-offset:1px;border-color:transparent}
.confirm-dialog-field input[readonly]{background:var(--surface-2, rgba(0,0,0,.03))}
/* A prompt puts Accept FIRST in the markup so Enter in the field submits it (the
   first submit button in tree order wins). Cancel is drawn first again here, so
   every dialog reads Cancel · Action, left to right. */
.confirm-dialog-card footer [data-dialog-cancel]{order:-1}
.confirm-dialog-card footer button[disabled]{opacity:.5;cursor:not-allowed}

/* Activity Stream (v6.13.173): the attention chip, the per-card attention note,
   and dots for the kinds that had none (generated-unpublished, saved session,
   recovery, reviewer decision) so a card's kind reads at a glance. */
.activity-chips .chip.attention{border-color:var(--warning);color:var(--warning)}
.activity-chips .chip.attention.active{background:var(--warning-soft)}
.queue-card.needs-attention{box-shadow:inset 3px 0 0 var(--warning),var(--shadow)}
.attention-note{margin:8px 0 0!important;color:var(--warning)!important;font-size:12px!important;font-weight:650}
.queue-meta .idle-note{color:var(--warning);font-weight:700}
.kind-dot.generation{background:var(--warning)}
.kind-dot.draft{background:#2f7cc7}
.kind-dot.recovery,.kind-dot.override{background:var(--danger)}
.queue-actions{flex-wrap:wrap;justify-content:flex-end}

/* ---- Shared popover menus and sub-navigation (v6.13.177) ------------------
   One menu component (js/services/popover-menu.js) for the profile menu, the
   Documents column picker and row menus, and the Activity Stream card menus.
   The panel is positioned fixed by the script so it is never clipped by a
   scrolling .table-wrap or a modal; the CSS only owns the look. The older
   class names (.profile-menu, .column-picker-panel, .qrg-menu) share the same
   rules so the QRG Builder's own menus match without a QRG-side change. */
.app-menu-wrap{position:relative;display:inline-flex;align-items:center}
.app-menu{position:fixed;z-index:95;overflow:auto}
.app-menu,.qrg-menu{min-width:200px;max-width:min(360px,calc(100vw - 16px));padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:1px;transform-origin:top right;animation:app-menu-in .14s ease}
/* QRG Builder's menus keep their own absolute placement (qrg.js re-renders
   them open/closed itself); they take only the look from the shared rules. */
.qrg-menu{position:absolute}
.app-menu.drop-up{transform-origin:bottom right}
.app-menu[hidden],.profile-menu[hidden],.column-picker-panel[hidden]{display:none!important}
@keyframes app-menu-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.app-menu,.qrg-menu{animation:none}}
.app-menu-item,.qrg-menu button,.profile-menu button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;border:0;background:transparent;color:var(--text);padding:8px 10px;border-radius:8px;font:inherit;font-size:12.5px;font-weight:600;line-height:1.3;text-align:left;text-decoration:none;cursor:pointer}
.app-menu-item small{font-weight:500;font-size:11px;color:var(--muted);line-height:1.35}
.app-menu-item:hover,.app-menu-item:focus-visible,.qrg-menu button:hover,.profile-menu button:hover{background:var(--surface-2);outline:0}
.app-menu-item:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}
.app-menu-item:disabled{opacity:.5;cursor:not-allowed}
.app-menu-item.danger{color:var(--danger)}
.app-menu-item.danger:hover,.app-menu-item.danger:focus-visible{background:var(--danger-soft)}
.app-menu-item.check{flex-direction:row;align-items:center;gap:9px}
.app-menu-check{width:16px;height:16px;border-radius:5px;border:1.5px solid var(--border);background:var(--surface);flex:none;display:grid;place-items:center}
.app-menu-item[aria-checked="true"] .app-menu-check{background:var(--accent-strong);border-color:var(--accent-strong)}
.app-menu-item[aria-checked="true"] .app-menu-check::after{content:'';width:9px;height:5px;border-left:2px solid var(--accent-text);border-bottom:2px solid var(--accent-text);transform:translateY(-1px) rotate(-45deg)}
.app-menu-sep{border:0;border-top:1px solid var(--border);margin:4px 2px}
.app-menu-heading{padding:6px 10px 4px;font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.app-menu-heading small{display:block;margin-top:3px;font-size:11px;font-weight:500;letter-spacing:0;text-transform:none;line-height:1.35;color:var(--text)}
.menu-trigger{display:inline-flex;align-items:center;gap:6px}
.menu-trigger svg{width:16px;height:16px;fill:currentColor;flex:none}
.menu-trigger .app-menu-caret{width:14px;height:14px;fill:none;transition:transform .14s ease}
.menu-trigger[aria-expanded="true"] .app-menu-caret{transform:rotate(180deg)}
.menu-trigger.icon-only{padding:6px;width:32px;height:32px;justify-content:center;border-radius:9px}
.menu-trigger[aria-expanded="true"]{border-color:var(--accent);color:var(--accent)}
.card-menu-trigger.small{padding:6px 8px;min-height:0}
.row-menu-trigger{border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer;opacity:.55}
.row-menu-trigger:hover,.row-menu-trigger:focus-visible,.row-menu-trigger[aria-expanded="true"]{opacity:1;background:var(--surface-2);border-color:var(--border);color:var(--text)}
tr:hover .row-menu-trigger{opacity:1}
.profile-menu{min-width:240px;margin-top:6px}
.profile-menu-identity{display:grid;gap:2px;text-transform:none;letter-spacing:0;font-size:13px;color:var(--text);padding:8px 10px 6px}
.profile-menu-identity strong{font-weight:750;font-size:13px}
.profile-menu-identity small{font-weight:500;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.profile-button[data-menu-toggle]:hover{border-color:var(--accent)}
.profile-button[aria-expanded="true"]{border-color:var(--accent)}
.column-picker-panel{min-width:230px}

/* Page toolbar status: a refresh control and the last-load time on the list
   pages, left of the primary action. */
.toolbar-status{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.toolbar-status .muted{font-size:12px}

/* Documents registry */
.filter-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 14px;border-bottom:1px solid var(--border)}
.filter-chips .chip,.activity-chips .chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:6px 12px;border-radius:999px;font-size:12px;font-weight:650;cursor:pointer;transition:border-color .12s ease,background .12s ease,color .12s ease}
.filter-chips .chip:hover,.activity-chips .chip:hover{border-color:color-mix(in srgb,var(--mvta-green) 55%,var(--border));background:var(--surface-2)}
.filter-chips .chip.active,.activity-chips .chip.active{border-color:var(--mvta-green);color:var(--mvta-green);background:var(--mvta-green-soft)}
.filter-chips .chip-count,.activity-chips .chip-count{opacity:.7;margin-left:2px;font-variant-numeric:tabular-nums}
.filter-chips:empty{display:none}
.registry-table th.sortable{padding:0}
.registry-table .th-sort{display:flex;align-items:center;gap:5px;width:100%;border:0;background:transparent;color:inherit;font:inherit;text-transform:inherit;letter-spacing:inherit;padding:11px 14px;cursor:pointer;text-align:left}
.registry-table .th-sort:hover{color:var(--text)}
.registry-table th.sorted .th-sort{color:var(--mvta-green)}
.registry-table .sort-caret{font-size:8px;min-width:8px}
.registry-table .th-sort:focus-visible{outline-offset:-3px}
.doc-cell{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;min-width:260px}
.doc-cell-main{min-width:0;flex:1}
/* The document cell reads title-first. The TITLE is what a person scans the
   registry by, so it carries the weight and the text colour; the code is the
   precise label above it, monospace because it is an identifier and quiet
   because it is read second. Before, the code was the bold line and the title
   sat under it as 11px muted small text, the hierarchy of a database dump. */
.doc-cell-id{display:block;font-size:11.5px;font-weight:600;letter-spacing:.02em;line-height:1.3;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.doc-cell-title{display:block;margin-top:3px;font-size:13.5px;font-weight:650;line-height:1.35;color:var(--text);max-width:46ch;text-wrap:pretty;overflow-wrap:anywhere}
.doc-cell-title.is-untitled{color:var(--muted);font-weight:500;font-style:italic}
.doc-cell .row-actions{margin-top:8px}
.filter-count .text-button{padding:0 2px}
.doc-manage-footer .app-menu-wrap{margin-left:auto}

/* Sub-navigation inside a page (AI Pipeline decomposition tabs, Shared Lists
   in Administration): a segmented control instead of a row of outlined pills,
   so the selected tab reads as "where you are" rather than as another button. */
.subtab-row,.subtab-bar{display:inline-flex;flex-wrap:wrap;gap:3px;padding:4px;margin:0 0 14px;max-width:100%;background:var(--surface-3);border:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:12px}
#admin-content .subtab-row{margin:0 0 4px}
.subtab-row+.reftable-search{padding-top:10px}
.subtab-item,.subtab{border:0;background:transparent;color:var(--muted);padding:7px 13px;border-radius:9px;font-size:12px;font-weight:650;line-height:1.2;cursor:pointer;transition:background .12s ease,color .12s ease,box-shadow .12s ease}
.subtab-item:hover,.subtab:hover{color:var(--text);background:color-mix(in srgb,var(--surface) 65%,transparent)}
.subtab-item.active,.subtab.active{background:var(--surface);color:var(--mvta-green);box-shadow:0 1px 2px rgba(16,40,30,.12),0 0 0 1px var(--border)}
html[data-theme="dark"] .subtab-item.active,html[data-theme="dark"] .subtab.active{box-shadow:0 1px 2px rgba(0,0,0,.4),0 0 0 1px var(--border)}
@media(max-width:760px){.toolbar-status{width:100%;justify-content:space-between}.doc-cell{min-width:0}.app-menu,.qrg-menu{max-width:calc(100vw - 16px)}}

/* ── Guide viewer (#guide/<documentId>) ──────────────────────────────────
   Reading a published document, with its outline beside it. Everything here
   uses the shared tokens, so light and dark come for free; nothing is a fixed
   colour. The outline is sticky rather than a fixed sidebar because a long SOP
   scrolls far and losing the outline is what makes a long document feel like a
   PDF again. Below 1024px it collapses above the body — a phone reading a
   procedure wants the steps, not the index. */
.guide-layout{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:18px;align-items:start}
/* The sticky column, not the panel: it now holds the outline AND the related
   documents, and both have to scroll together rather than each on its own. */
.guide-side{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow:auto;display:flex;flex-direction:column;gap:12px}
.guide-aside{padding:0}
.guide-aside>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px}
.guide-aside>summary::-webkit-details-marker{display:none}
.guide-aside>summary::after{content:'▾';color:var(--muted);font-size:11px;transition:transform .15s ease}
.guide-aside[open]>summary::after{transform:rotate(180deg)}
.guide-aside>summary:hover{background:var(--surface-3)}
.guide-aside>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.guide-refs{display:flex;flex-direction:column;gap:12px}
.guide-ref-group h4{margin:0 0 6px;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.guide-ref{display:block;padding:7px 8px;border-radius:7px;text-decoration:none;color:var(--text);border:1px solid transparent}
.guide-ref:hover{background:var(--surface-3);border-color:var(--border)}
.guide-ref:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.guide-ref code{font-size:11.5px}
.guide-ref span{display:block;font-size:12px;margin-top:1px}
.guide-ref small{display:block;font-size:10.5px;margin-top:2px}
.guide-outline ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.guide-outline li[data-depth="1"]{padding-left:14px}
.guide-outline li[data-depth="2"]{padding-left:28px}
.guide-outline a{display:block;padding:4px 6px;border-radius:6px;color:var(--text);text-decoration:none;font-size:13px}
.guide-outline a:hover{background:var(--surface-3)}
.guide-outline a:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.guide-body .guide-section{padding:14px 0;border-bottom:1px solid var(--border)}
.guide-body .guide-section:last-child{border-bottom:0}
.guide-section[data-depth="1"]{padding-left:16px}
.guide-section[data-depth="2"]{padding-left:32px}
.guide-h{margin:0 0 8px;font-size:15px;color:var(--text)}
.guide-section[data-depth="1"] .guide-h{font-size:14px}
.guide-steps{list-style:none;margin:8px 0 0;padding:0;counter-reset:guidestep;display:flex;flex-direction:column;gap:6px}
.guide-step{counter-increment:guidestep;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:8px 10px}
.guide-step label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;cursor:pointer;margin:0}
.guide-step input{margin-top:2px}
/* A checked step is dimmed, never struck through: a reader coming back to
   re-read what they already did must still be able to read it. */
.guide-step.is-done{opacity:.62;border-color:color-mix(in srgb,var(--success) 34%,var(--border))}
.guide-progress{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;padding:10px 12px;margin-bottom:14px;background:var(--surface-3);border-radius:var(--radius)}
.guide-flat{white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.55;margin:12px 0 0;max-height:70vh;overflow:auto}
.guide-link{display:inline-flex;align-items:center;padding:7px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);text-decoration:none;font-size:13px}
.guide-link:hover{background:var(--surface-3)}
@media(max-width:1024px){
  .guide-layout{grid-template-columns:1fr}
  /* Not sticky, not scroll-capped, and the panels arrive CLOSED (guide.js only
     writes `open` when there is room) — so the document, not a navigation box,
     is the first thing under the header on a phone. */
  .guide-side{position:static;max-height:none;overflow:visible}
  .guide-aside[open]>.panel-body{max-height:50vh;overflow:auto}
  .guide-section[data-depth="1"],.guide-section[data-depth="2"]{padding-left:0}
}
/* Worked through one-handed, often in a vehicle: the controls a reader actually
   presses get thumb-sized, and the pager sticks to the bottom of the viewport
   so turning a page never means scrolling to find the button. */
@media(max-width:720px){
  .guide-pager{position:sticky;bottom:0;background:var(--surface);padding-bottom:10px;margin-top:12px}
  .guide-pager button{padding:11px 16px;min-height:44px}
  .guide-step{padding:11px 12px}
  .guide-step input{width:20px;height:20px}
  .guide-search-nav button{min-width:44px;min-height:40px}
}

/* ── Guide viewer: reading mode ──────────────────────────────────────────
   The mode switch and the pager. Both use the shared tokens so light and dark
   come for free. The pager is deliberately plain: page-turning UI that draws
   attention to itself competes with the document, and the reader came for the
   document. */
.guide-head-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.guide-modes{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--surface)}
.guide-modes button{border:0;background:transparent;color:var(--muted);padding:7px 12px;font-size:13px;cursor:pointer}
.guide-modes button + button{border-left:1px solid var(--border)}
.guide-modes button:hover{background:var(--surface-3);color:var(--text)}
.guide-modes button.on{background:var(--accent);color:var(--accent-text)}
.guide-modes button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.guide-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}
/* `display:flex` BEATS the browser's own [hidden]{display:none}, and this app
   has no global [hidden] rule — so the pager stayed on screen in Continuous
   mode, under a document that explicitly does not page, with its own JS
   correctly setting el.hidden = true the whole time. Every flex or grid element
   this app toggles with `hidden` needs its own guard; these two are the guide's. */
.guide-pager[hidden]{display:none}
.guide-pager span{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.guide-pager button[disabled]{opacity:.45;cursor:default}
@media(max-width:720px){.guide-head-tools{width:100%}.guide-modes{width:100%}.guide-modes button{flex:1}}

/* ── Guide viewer: glossary terms and search hits ────────────────────────
   A glossary term is marked ONCE per document and drawn as an underline, not a
   button: forty pill-shaped controls through a procedure would read as forty
   things to do. The search hit is the louder of the two on purpose — the reader
   asked for it. */
.glossary-term{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:help;
  text-decoration:underline dotted;text-underline-offset:3px;text-decoration-color:var(--accent)}
.glossary-term:hover{background:var(--accent-soft)}
.glossary-term:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.guide-definition{position:fixed;z-index:90;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.22);padding:11px 13px;font-size:12.5px;line-height:1.5}
.guide-definition strong{display:block;margin-bottom:4px;font-size:13px}
.guide-definition p{margin:0 0 5px}
.guide-definition p:last-child{margin-bottom:0;font-size:11px}
mark.guide-hit{background:var(--status-warning-bg);color:var(--text);border-radius:3px;padding:0 1px}
mark.guide-hit.is-current{background:var(--accent);color:var(--accent-text)}
.guide-search-nav{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12px;color:var(--muted)}
.guide-search-nav[hidden]{display:none}
/* Search results: a locator list, deliberately plainer than the document so it
   cannot be mistaken for content. Each row is a button because clicking one
   moves the reader; the [hidden] guard is the global rule's job now, but the
   list is a grid so it would have needed one before that landed. */
/* ── Procedure mode ─────────────────────────────────────────────────────
   The focused step is the emphasis; context either side is deliberately quieter
   so the eye lands on the current instruction without losing the thread. No
   animation, so no reduced-motion rule is owed. */
.guide-procedure{display:grid;gap:10px;margin:14px 0}
.guide-procedure[hidden]{display:none}
.guide-proc-body{display:grid;gap:10px}
.guide-proc-head{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:space-between}
.guide-proc-count{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.guide-proc-section{font-size:12px;color:var(--muted)}
.guide-proc-before,.guide-proc-after{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.guide-proc-context{display:grid;gap:1px;padding:7px 11px;border-left:2px solid var(--border);color:var(--muted);font-size:13px}
.guide-proc-where{font-size:10.5px;text-transform:uppercase;letter-spacing:.3px;opacity:.85}
.guide-proc-current{border:1.5px solid var(--accent);border-radius:var(--radius);background:var(--surface);padding:14px 16px}
.guide-proc-current label{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.5;cursor:pointer}
.guide-proc-current input{width:22px;height:22px;flex:none;margin-top:2px}
.guide-proc-current.is-done{opacity:.62;border-color:color-mix(in srgb,var(--success) 40%,var(--border))}
.guide-proc-aside{border-left:3px solid var(--warning,var(--accent));padding:8px 12px;background:var(--surface-3);border-radius:0 var(--radius) var(--radius) 0;display:grid;gap:8px}
.guide-proc-warnings{margin:0;padding-left:18px;font-size:13px;line-height:1.5}
.guide-proc-facts{width:100%;border-collapse:collapse;font-size:13px}
.guide-proc-facts th,.guide-proc-facts td{padding:4px 8px;border-bottom:1px solid var(--border);text-align:left}
.guide-proc-nav{display:flex;gap:10px;justify-content:space-between}
/* Worked one-handed in a vehicle: the two controls a reader presses most. */
@media(max-width:720px){
  .guide-proc-nav{position:sticky;bottom:0;background:var(--surface);padding:8px 0}
  .guide-proc-nav button{flex:1;min-height:46px}
  .guide-proc-current input{width:24px;height:24px}
}

/* ── Runbook layout ─────────────────────────────────────────────────────
   Step-groups on one continuous page, joined by a numbered rail; the facts sit
   in the side column. Continuous on purpose: find-in-page, printing and
   assistive technology keep working exactly as they do for any document. A
   completed group turns its number into a tick — words carry it too, in the
   count beside the heading, so colour is never the only signal. */
.guide-runbook{margin:14px 0}
.guide-runbook[hidden]{display:none}
.guide-rb-rail{list-style:none;margin:0;padding:0;position:relative}
.guide-rb-rail::before{content:"";position:absolute;left:15px;top:18px;bottom:18px;width:2px;background:var(--border)}
.guide-rb-item{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;margin-bottom:14px;position:relative}
.guide-rb-dot{width:32px;height:32px;border-radius:50%;background:var(--surface);border:2px solid var(--accent);display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--text);z-index:1}
.guide-rb-item.is-note .guide-rb-dot{border-style:dashed;border-color:var(--border);color:var(--muted)}
.guide-rb-item.is-complete .guide-rb-dot{background:var(--success);border-color:var(--success);color:#fff}
.guide-rb-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:12px 14px}
.guide-rb-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.guide-rb-head .guide-h{margin:0}
.guide-rb-count{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.guide-rb-warn{display:flex;gap:10px;align-items:baseline;border-left:4px solid var(--warning);background:var(--warning-soft);padding:8px 12px;border-radius:0 8px 8px 0;margin:0 0 10px;font-size:13px;line-height:1.5}
.guide-rb-warn strong{color:var(--warning);white-space:nowrap}
/* §2.6 narrative callouts in the Reader, by kind: Caution in the warning
   tokens, Note in the accent, Required in the muted ink. Same shape everywhere. */
.guide-callout{display:flex;gap:10px;align-items:baseline;border-left:4px solid var(--border);background:var(--surface-2);padding:8px 12px;border-radius:0 8px 8px 0;margin:0 0 10px;font-size:13px;line-height:1.5}
.guide-callout strong{white-space:nowrap}
.guide-callout.is-caution{border-left-color:var(--warn-gate-ink);background:var(--warn-gate-soft)}
.guide-callout.is-caution strong{color:var(--warn-gate-ink)}
.guide-callout.is-note{border-left-color:var(--accent);background:var(--accent-soft)}
.guide-callout.is-note strong{color:var(--accent-strong)}
.guide-callout.is-required{border-left-color:var(--muted)}
.guide-callout.is-required strong{color:var(--muted)}
.guide-source,.guide-rb-source{font-size:11.5px;color:var(--muted);font-weight:500}
.guide-source{margin:-4px 0 8px}
.guide-rb-source{margin-left:8px;white-space:nowrap}
.guide-rb-card p{margin:0 0 8px;line-height:1.55}
.guide-rb-facts-note{font-size:12px;color:var(--muted)}
.guide-facts{width:100%;border-collapse:collapse;font-size:13px}
.guide-facts th,.guide-facts td{padding:5px 6px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.guide-facts th{font-weight:600;color:var(--muted)}
.guide-facts td{font-weight:700;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.guide-facts-group{margin:10px 0 2px;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.guide-facts-group:first-child{margin-top:0}
/* The figures layout: the same rail, with the selected step's figure beside it.
   Below 1024px the pane pins to the top of the screen, capped, so the figure
   stays in view while the steps scroll under it. */
.guide-rb-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.guide-rb-pane{position:sticky;top:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:12px}
.guide-rb-pane>p{margin:0}
.guide-rb-figure{margin:0 0 12px}
.guide-rb-figure:last-child{margin-bottom:0}
.guide-rb-figure img{display:block;max-width:100%;height:auto;border:1px solid var(--border);border-radius:6px;background:#fff}
.guide-rb-figure figcaption{font-size:12.5px;line-height:1.45;margin-top:6px}
.guide-rb-step{cursor:pointer}
.guide-rb-step.is-selected{outline:2px solid var(--accent);outline-offset:1px}
@media(max-width:1024px){
  .guide-rb-split{grid-template-columns:1fr}
  /* order:-1 is what makes the pin work: stacked AFTER the rail, the pane only
     sticks once a reader has scrolled past every step to reach it. */
  .guide-rb-pane{order:-1;top:0;z-index:2;max-height:45vh;overflow:auto;box-shadow:var(--shadow)}
}
@media(max-width:720px){
  .guide-rb-item{grid-template-columns:26px minmax(0,1fr);gap:10px}
  .guide-rb-dot{width:26px;height:26px;font-size:12px}
  .guide-rb-rail::before{left:12px}
  .guide-rb-item.is-filled::before{left:12px}
  .guide-rb-card{padding:10px 12px}
}

/* ── Runbook layout: state (2026-10-04) ──────────────────────────────────
   What the rail SAYS beyond the text (services/runbook-reader.js): the current
   group, the fill up to it, the next step, the facts beside the steps, the
   companion line and the figure strip. Colour is state here, never decoration:
   accent = where you are, success = done, warning = the parent moved on. */
.guide-rb-item.is-current .guide-rb-dot{background:var(--accent-strong);border-color:var(--accent-strong);color:var(--accent-text);box-shadow:0 0 0 4px var(--accent-soft)}
.guide-rb-item.is-current>.guide-rb-card{border-color:var(--accent);box-shadow:0 1px 0 var(--accent-soft)}
/* The connector below a done group fills, from the top of the rail down to the
   current dot. Drawn per item over the rail's grey line; the last item has
   nothing below it. */
.guide-rb-item.is-filled::before{content:"";position:absolute;left:15px;top:18px;bottom:-14px;width:2px;background:var(--success);z-index:0}
.guide-rb-item.is-filled:last-child::before{bottom:18px}
/* The NEXT step: a tinted card with an accent edge and a small tag — findable
   from across a desk, and the only step so marked. */
.guide-rb-step{position:relative}
.guide-rb-step.is-now{background:var(--accent-soft);border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent-strong)}
.guide-rb-next-tag{display:none;position:absolute;top:-8px;right:10px;font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--accent-text);background:var(--accent-strong);border-radius:999px;padding:1px 7px}
.guide-rb-step.is-now .guide-rb-next-tag{display:inline-block}
.guide-rb-step.is-done.is-now{opacity:1}
/* Figure chips on a step: which figure it cites, and a way to show it. */
.guide-rb-figchips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 0 26px}
.guide-rb-figchip{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--warn-adv-line);background:var(--surface);color:var(--accent-strong);border-radius:999px;padding:1px 8px;font:inherit;font-size:11px;font-weight:600;cursor:pointer;line-height:1.6}
.guide-rb-figchip:hover{background:var(--accent-soft)}
.guide-rb-figchip:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* Facts beside the steps that use them. The value is the loud part — a number
   is what the reader is dialling — and a phone number is a tel: link. */
.guide-rb-chips{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.guide-rb-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--gov-teal-field);background:var(--gov-teal-field);border-radius:10px;padding:5px 6px 5px 10px;font-size:12.5px;max-width:100%}
.guide-rb-chip-label{color:var(--gov-teal);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
.guide-rb-chip-value{font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
a.guide-rb-chip-value{color:var(--accent-strong);text-decoration:underline;text-underline-offset:2px}
.guide-rb-copy{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;padding:0}
.guide-rb-copy:hover{background:var(--surface);color:var(--text);border-color:var(--border)}
.guide-rb-copy:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.guide-rb-copy.is-copied{color:var(--success);border-color:var(--success)}
/* The identity strip: RUNBOOK, companion, what it covers, who it is for, and
   whether the parent has moved on. */
.guide-rb-identity{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:14px 16px;margin:0 0 12px;border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(135deg,var(--accent-soft),transparent 60%),var(--surface)}
.guide-rb-id-main{min-width:0;display:flex;flex-direction:column;gap:6px}
.guide-rb-id-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.guide-rb-badge{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--accent-text);background:var(--accent-strong);border-radius:6px;padding:3px 8px}
.guide-rb-currency{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;border-radius:999px;padding:2px 10px;border:1px solid var(--border);color:var(--muted);background:var(--surface-2)}
.guide-rb-currency::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.75}
.guide-rb-currency.is-current{color:var(--success);border-color:var(--status-approved-border);background:var(--status-approved-bg)}
.guide-rb-currency.is-stale{color:var(--status-warning-text);border-color:var(--status-warning-border);background:var(--status-warning-bg)}
.guide-rb-currency.is-retired{color:var(--danger);border-color:var(--danger);background:var(--danger-soft)}
.guide-rb-companion{margin:0;font-size:13.5px;line-height:1.5}
.guide-rb-companion a{color:var(--accent-strong);text-decoration:none;border-bottom:1px solid var(--warn-adv-line)}
.guide-rb-companion a:hover{border-bottom-color:var(--accent-strong)}
.guide-rb-covers{margin:2px 0 0;font-size:13px;line-height:1.5;display:flex;flex-direction:column;gap:2px}
.guide-rb-eyebrow{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.guide-rb-audience{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex-shrink:0;max-width:40%}
.guide-rb-audience .guide-rb-pill{display:inline-block;font-size:12px;font-weight:600;color:var(--accent-strong);background:var(--surface);border:1px solid var(--warn-adv-line);border-radius:999px;padding:3px 10px;text-align:right}
/* The now bar: the next step, said once, with a way to tick it from here. */
.guide-rb-now{display:flex;align-items:center;gap:10px;flex-wrap:wrap;position:sticky;top:0;z-index:3;margin:0 0 12px;padding:8px 10px 8px 12px;border:1px solid var(--accent);border-left-width:4px;border-radius:10px;background:var(--surface);box-shadow:var(--shadow)}
.guide-rb-now.is-complete{border-color:var(--success)}
.guide-rb-now-label{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--accent-strong)}
.guide-rb-now.is-complete .guide-rb-now-label{color:var(--success)}
.guide-rb-now-text{flex:1 1 240px;min-width:0;text-align:left;background:none;border:0;padding:0;font:inherit;font-size:13.5px;color:var(--text);cursor:pointer;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.guide-rb-now-text:hover .guide-rb-now-where{text-decoration:underline}
.guide-rb-now-text:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.guide-rb-now-where{font-weight:800;color:var(--accent-strong);font-variant-numeric:tabular-nums;margin-right:2px}
.guide-rb-elapsed{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.guide-rb-keys{font-size:11px;white-space:nowrap}
.guide-rb-keys kbd{font:inherit;font-size:10px;border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 4px;background:var(--surface-2)}
/* The figure pane: headed by the step it shows, over a strip of every figure. */
.guide-rb-pane-head{display:flex;flex-direction:column;gap:2px;margin:0 0 10px;padding:0 0 8px;border-bottom:1px solid var(--border)}
.guide-rb-pane-step{font-size:13px;line-height:1.4;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.guide-rb-enlarge{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.guide-rb-enlarge:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.guide-rb-strip{display:flex;gap:8px;overflow-x:auto;margin:12px -4px 0;padding:8px 4px 4px;border-top:1px solid var(--border);scrollbar-width:thin}
.guide-rb-thumb{flex:0 0 auto;display:flex;flex-direction:column;gap:3px;align-items:flex-start;width:84px;padding:4px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);cursor:pointer;font:inherit;color:var(--text)}
.guide-rb-thumb img{display:block;width:74px;height:50px;object-fit:cover;border-radius:4px;background:#fff;border:1px solid var(--border)}
.guide-rb-thumb span{font-size:11px;font-weight:700;white-space:nowrap}
.guide-rb-thumb small{font-weight:500;color:var(--muted)}
.guide-rb-thumb:hover{border-color:var(--accent)}
.guide-rb-thumb.is-on{border-color:var(--accent-strong);background:var(--accent-soft)}
.guide-rb-thumb:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.guide-rb-lightbox{border:0;border-radius:var(--radius);padding:14px;max-width:min(96vw,1200px);background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg)}
.guide-rb-lightbox::backdrop{background:rgba(10,25,19,.6)}
.guide-rb-lightbox figure{margin:0}
.guide-rb-lightbox img{display:block;max-width:100%;max-height:80vh;height:auto;margin:0 auto;border:1px solid var(--border);border-radius:6px;background:#fff}
.guide-rb-lightbox figcaption{font-size:13px;margin-top:8px}
.guide-rb-lightbox-close{position:absolute;top:10px;right:10px}
@media(max-width:1024px){
  .guide-rb-identity{flex-direction:column}
  .guide-rb-audience{align-items:flex-start;max-width:none}
  .guide-rb-audience .guide-rb-pill{text-align:left}
  /* Under the pinned figure pane, not over it. */
  .guide-rb-now{top:auto;position:static}
  .guide-rb-keys{display:none}
}

/* Text size: scales the DOCUMENT only. Browser zoom scales the chrome too, and a
   reader who wants larger prose should not have to enlarge the navigation with
   it. rem-relative so it composes with zoom rather than fighting it. */
#guide-sections[data-text="large"],#guide-procedure[data-text="large"],#guide-runbook[data-text="large"]{font-size:1.12em}
#guide-sections[data-text="larger"],#guide-procedure[data-text="larger"],#guide-runbook[data-text="larger"]{font-size:1.28em}
.guide-text-size button{font-weight:700;min-width:34px}
.guide-text-size button:nth-child(2){font-size:15px}
.guide-text-size button:nth-child(3){font-size:18px}
/* Progress: a bar plus the number, because a bar alone is a shape and the
   percentage is the fact. No animation, so nothing is owed to reduced motion. */
.guide-progress-bar{display:inline-block;width:110px;height:7px;border-radius:99px;background:var(--surface);border:1px solid var(--border);overflow:hidden;vertical-align:middle}
.guide-progress-bar>span{display:block;height:100%;background:var(--success)}
.guide-progress-pct{font-variant-numeric:tabular-nums;font-weight:700;font-size:12px}
/* The acknowledgement reads as a note to self, not a control that records
   something — the wording carries that and the styling must not contradict it. */
.guide-ack{display:flex;gap:8px;align-items:flex-start;flex-basis:100%;margin-top:6px;font-size:13px}
.guide-ack small{display:block}
.guide-resume{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--surface-3)}
/* Comparing revisions: a diff is data, so it is monospaced and quiet, and the
   two colours carry a symbol too — no meaning by colour alone. */
.guide-compare-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-bottom:10px}
.guide-compare-controls label{display:grid;gap:3px;font-size:12px;color:var(--muted)}
.guide-compare-summary{font-size:13px;margin:0 0 8px}
.guide-diff{list-style:none;margin:0;padding:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55;max-height:46vh;overflow:auto;border:1px solid var(--border);border-radius:var(--radius)}
.guide-diff li{padding:1px 8px;white-space:pre-wrap;word-break:break-word}
.guide-diff-add{background:color-mix(in srgb,var(--success) 14%,transparent)}
.guide-diff-add::before{content:'+ ';font-weight:700;color:var(--success)}
.guide-diff-del{background:color-mix(in srgb,var(--danger) 12%,transparent)}
.guide-diff-del::before{content:'\2212 ';font-weight:700;color:var(--danger)}
.guide-diff-same::before{content:'\00a0\00a0'}
.guide-diff-gap{text-align:center;color:var(--muted);background:var(--surface-3)}

/* The anchor affordance: quiet until the heading is hovered or it is focused,
   because a '#' beside every heading competes with the document. NO TRANSITION:
   it had one, three lines below a comment claiming the viewer has no animation
   to suppress. The viewer owes no reduced-motion rule precisely because that is
   true, so the fade went rather than the claim. */
.guide-anchor{border:0;background:transparent;color:var(--muted);cursor:pointer;font:inherit;padding:0 6px;opacity:0}
.guide-h:hover .guide-anchor,.guide-anchor:focus-visible{opacity:1}
.guide-anchor:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.guide-anchor.is-copied{opacity:1;color:var(--success)}
/* A bookmarked heading keeps its star visible — otherwise the one piece of state
   a reader set would be hidden until they hovered the right line. */
.guide-mark.is-marked{opacity:1;color:var(--accent)}
.guide-mark-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.guide-mark-list li{display:flex;gap:6px;align-items:center;justify-content:space-between}
.guide-anchor.is-copied::after{content:' copied';font-size:11px}
/* Where a deep link landed. A background rather than motion, so it needs no
   reduced-motion rule — the viewer deliberately has no animation. */
.guide-section.is-anchored{background:color-mix(in srgb,var(--accent) 8%,transparent);border-radius:var(--radius)}
.guide-search-results{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px;max-height:40vh;overflow:auto}
.guide-search-result{display:block;width:100%;text-align:left;border:1px solid var(--border);border-radius:8px;background:var(--surface);padding:7px 10px;cursor:pointer;font:inherit;color:var(--text)}
.guide-search-result:hover{background:var(--surface-3)}
.guide-search-result:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.guide-search-result-where{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}
.guide-search-result-text{display:block;font-size:13px;line-height:1.45;margin-top:2px}
.guide-search-nav button{padding:3px 9px;line-height:1.3}

/* ── Runbook Builder review screen (ported from the 2026-09-05 design canvas) ── */
.rb-stages{display:flex;gap:10px}
.rb-stage{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface);flex:1 1 0;min-width:0}
.rb-stage .n{width:24px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:var(--surface-2);color:var(--muted);border:1px solid var(--border);flex-shrink:0}
.rb-stage.done .n{background:var(--status-approved-bg);color:var(--success);border-color:var(--status-approved-border)}
.rb-stage.current{border-color:var(--accent);background:var(--accent-soft)}
.rb-stage.current .n{background:var(--accent-strong);color:var(--accent-text);border-color:var(--accent-strong)}
.rb-stage strong{display:block;font-size:12px}
.rb-stage small{display:block;font-size:11px;color:var(--muted)}
.rb-toolbar-actions{align-items:center;gap:10px}
.rb-toolbar-hint{font-size:11.5px;color:var(--muted)}
/* The hint is a button now: it takes the operator to the panel that holds the
   fix. Underlined on hover and focus-visible so it reads as something to press
   rather than a caption beside a disabled button. */
button.rb-toolbar-hint{background:none;border:0;padding:0;cursor:pointer;text-align:left;font:inherit;font-size:11.5px;color:var(--muted)}
button.rb-toolbar-hint:hover{color:var(--text);text-decoration:underline}
button.rb-toolbar-hint:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.rb-identity-body{padding:18px;display:flex;flex-direction:column;gap:12px}
.rb-identity-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.rb-badges{display:flex;gap:10px;align-items:center;margin-bottom:4px}
.rb-badge-form{background:var(--accent-soft);color:var(--accent-strong)}
.rb-title{font-size:20px;margin:0;line-height:1.3}
.rb-derivation{margin:6px 0 0;font-size:12px;color:var(--muted)}
.rb-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.rb-audience{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.rb-pills{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.rb-stats{display:flex;gap:10px;flex-wrap:wrap}
.rb-stat{flex:1 1 120px;min-width:110px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);padding:10px 14px}
.rb-stat span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.rb-stat b{display:block;font-size:18px;margin-top:2px}
.rb-stat b small{font-size:11px;font-weight:500;color:var(--muted)}
.rb-stat.is-gate{border-color:var(--warn-gate-line)}
.rb-stat.is-gate span,.rb-stat.is-gate b{color:var(--warn-gate-ink)}
.rb-stat.is-ok{border-color:var(--status-approved-border)}
.rb-stat.is-ok span,.rb-stat.is-ok b{color:var(--success)}
.rb-ready{display:flex;align-items:center;gap:8px;font-weight:600;margin:0;max-width:none}
.rb-gate{border-color:var(--warn-gate-line)}
.rb-gate-head{display:flex;gap:12px;align-items:center}
.rb-gate-head h3{color:var(--warn-gate-ink)}
.rb-gate-icon{color:var(--warn-gate-ink);display:inline-flex;flex-shrink:0}
.rb-gate-body{display:flex;flex-direction:column;gap:12px}
.rb-blockers{margin:0;padding-left:18px;font-size:12px}
.rb-fact{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:14px 16px;background:var(--surface-2)}
.rb-fact-label{display:flex;align-items:center;gap:8px}
.rb-fact-label strong{font-size:14px}
.rb-fact-source{margin:6px 0 0;font-size:12.5px}
.rb-fact-note{margin:4px 0 0;font-size:11px;color:var(--muted)}
.rb-fact-actions{display:flex;align-items:center;gap:8px}
.rb-fact-actions select{font-size:12px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);min-width:260px;max-width:340px}
.rb-columns{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;align-items:start}
.rb-outline{position:sticky;top:104px}
.rb-outline-list{padding:10px;display:flex;flex-direction:column;gap:2px}
.rb-outline-list a{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--text);font-size:12px}
.rb-outline-list a:hover{background:var(--surface-2)}
.rb-outline-list a .n{width:22px;height:22px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.rb-outline-list a .cnt{font-size:11px;color:var(--muted)}
.rb-groups{padding:0 18px}
.rb-group{padding:18px 0;border-bottom:1px solid var(--border);scroll-margin-top:110px}
.rb-group:last-child{border-bottom:0}
.rb-group-h{display:flex;align-items:center;gap:12px;margin:0 0 8px}
.rb-group-h .n{width:30px;height:30px;border-radius:999px;background:var(--accent-strong);color:var(--accent-text);font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.rb-group-h h3{font-size:15px;margin:0}
.rb-source{font-size:11px;color:var(--muted);white-space:nowrap;margin-left:auto}
.rb-covers{display:flex;flex-direction:column;gap:4px;margin:6px 0 2px}
.rb-covers textarea{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);width:100%;max-width:720px;box-sizing:border-box;resize:vertical}
.rb-warn{display:flex;gap:8px;align-items:flex-start;background:var(--gov-amber-field);border:1px solid var(--gov-amber-rule);border-radius:8px;padding:8px 10px;font-size:12px;color:var(--text);margin:0 0 8px}
.rb-warn .rb-gate-icon{margin-top:2px}
.rb-steps{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.rb-step{display:grid;grid-template-columns:22px minmax(0,1fr);gap:9px;align-items:start;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:12.5px}
.rb-step .k{width:20px;height:20px;border-radius:999px;border:1.5px solid var(--accent-strong);color:var(--accent-strong);font-size:10.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
.rb-fig{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--warn-adv-line);background:var(--accent-soft);color:var(--accent-strong);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:600;white-space:nowrap;vertical-align:middle}
.rb-facts{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}
.rb-facts td{padding:8px 12px;border:1px solid var(--border);vertical-align:top}
.rb-facts td:first-child{width:200px;background:var(--gov-teal-field);color:var(--accent-strong);font-weight:700;font-size:11px}
.rb-facts td:last-child{font-weight:600}
@media(max-width:960px){.rb-columns{grid-template-columns:1fr}.rb-outline{position:static}.rb-fact{grid-template-columns:1fr}.rb-identity-head{flex-direction:column}.rb-audience{align-items:flex-start}.rb-pills{justify-content:flex-start}.rb-stages{flex-wrap:wrap}.rb-stage{flex:1 1 45%}}

/* ── Runbook Builder pick + condensing screens (design canvas, 2026-09-05) ── */
.rb-pick-body{display:flex;flex-direction:column;gap:14px}
.rb-pick-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.rb-search{flex:1 1 320px;display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:10px;padding:0 12px;background:var(--surface);height:44px;box-sizing:border-box;color:var(--muted)}
.rb-search input{flex:1;border:0;background:transparent;font-size:13px;color:var(--text);outline:none;min-width:0}
.rb-search:focus-within{outline:3px solid var(--accent);outline-offset:2px}
.rb-search input:focus-visible{outline:none}
.rb-chips{display:flex;gap:6px;flex-wrap:wrap}
.rb-chip{border:1px solid var(--border);background:var(--surface);color:var(--muted);border-radius:999px;padding:5px 12px;font-size:12px;cursor:pointer}
.rb-chip.on{background:var(--accent-strong);color:var(--accent-text);border-color:var(--accent-strong);font-weight:600}
.rb-table-wrap{border:1px solid var(--border);border-radius:10px;overflow:auto}
.rb-pick-table th:first-child,.rb-pick-table td:first-child{padding-left:14px}
.rb-pick-action{text-align:right;white-space:nowrap}
.rb-sub{font-size:11px;color:var(--muted);margin:2px 0 0}
/* The "that SOP is not listed" notice: one line per hidden match, its reason
   underneath. No bullets — these are answers, not a list of options. */
.rb-unlisted{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.rb-unlisted li{line-height:1.35}
.rb-unlisted code{font-size:12px}
/* #339 Runbook Rebuild: the revision summary and the step-group comparison */
.rb-revision-summary{display:grid;gap:6px;margin-bottom:12px}
.rb-revision-summary textarea{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);width:100%;box-sizing:border-box;resize:vertical}
.rb-revision-summary textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.rb-compare-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.rb-compare-list li{line-height:1.35}
.rb-badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:700;white-space:nowrap}
.rb-badge.has{background:var(--accent-soft);color:var(--accent-strong)}
.rb-busy-panel{max-width:760px;align-self:center;width:100%}
.rb-busy-head{padding:22px 24px 8px}
.rb-busy-head h2{font-size:18px;margin:0}
.rb-busy-head p{margin:6px 0 0;font-size:12px;color:var(--muted)}
.rb-busy-head .ai-run-card{margin:16px 0 6px;box-shadow:none}
.rb-busy-rows{padding:6px 24px 18px}
.rb-busy-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--border)}
.rb-busy-row:last-child{border-bottom:0}
.rb-busy-row .k{width:28px;height:28px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:var(--surface-2);box-sizing:border-box}
.rb-busy-row .k.done{background:var(--status-approved-bg);color:var(--success);border-color:var(--status-approved-border)}
.rb-busy-row .k.note{background:var(--status-warning-bg);border-color:var(--status-warning-border)}
.rb-busy-row .k.is-running{border:0;background:transparent}
.rb-busy-row strong{display:block;font-size:13px}
.rb-busy-row.is-waiting strong{color:var(--muted)}
.rb-busy-row small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.rb-busy-row .r{font-size:11px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}

.rb-audience{align-items:stretch;min-width:280px;max-width:340px}
.rb-audience .label-row{display:flex;align-items:baseline;gap:8px;justify-content:flex-end}
.rb-audience input{font:inherit;font-size:12.5px;padding:7px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);width:100%;box-sizing:border-box;text-align:right}
.rb-audience input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.rb-audience .rb-sub{margin:0;text-align:right}

/* ── supersession banner (guide viewer) ──────────────────────────────────
   Above the document on every path. Deliberately NOT an .inline-alert: those
   are 11-12px notes inside a panel, and this has to be the first thing read on
   a page the reader believes is current. Colour is never the only signal — the
   heading states it and the successor is a real link — per the accessibility
   rule that nothing rely on colour alone. Both palettes come from tokens.css,
   so dark mode follows without a second definition. */
.guide-superseded{max-width:1200px;margin:0 auto 18px;padding:16px 18px;border-radius:12px;
  border:1px solid var(--warn-gate-line);background:var(--warn-gate-soft);border-left-width:5px}
.guide-superseded h2{margin:0 0 6px;font-size:16px;line-height:1.3;color:var(--warn-gate-ink)}
.guide-superseded p{margin:0;font-size:13px;line-height:1.5;color:var(--text);max-width:70ch}
.guide-superseded.is-retired{border-color:var(--danger);background:var(--danger-soft)}
.guide-superseded.is-retired h2{color:var(--danger)}
.guide-successors{margin:10px 0 0;padding-left:18px;display:grid;gap:5px}
.guide-successors li{font-size:13px;line-height:1.45}
.guide-successors a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
.guide-successors a:hover{color:var(--accent)}
.guide-successors a:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:3px}
.guide-superseded .muted{color:var(--muted)}
@media(max-width:720px){.guide-superseded{padding:13px 14px}.guide-superseded h2{font-size:15px}}

/* ── figure viewer (Publish → Figure captions) ───────────────────────────
   The panel's thumbnails are ~80px, which is not enough to caption a
   screenshot from — an operator was being asked to describe a picture they
   could not read. The thumbnail is a button that opens the image at full size
   with its caption underneath. */
.fig-caption-thumb-btn{padding:0;border:1px solid var(--border);background:var(--surface);
  border-radius:8px;cursor:zoom-in;display:block;line-height:0;flex:0 0 auto}
.fig-caption-thumb-btn:hover{border-color:var(--accent)}
.fig-caption-thumb-btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.fig-view-backdrop{cursor:zoom-out;padding:24px}
.fig-view-card{margin:0;max-width:min(1100px,94vw);max-height:90vh;overflow:auto;cursor:default;
  background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;
  box-shadow:var(--shadow-lg);position:relative}
.fig-view-card img{display:block;max-width:100%;height:auto;border-radius:8px;background:#fff}
.fig-view-card figcaption{margin-top:10px;font-size:13px;line-height:1.5;color:var(--text);max-width:80ch}
.fig-view-close{position:absolute;top:8px;right:10px;font-size:22px;line-height:1;background:var(--surface);
  border:1px solid var(--border);border-radius:8px;width:32px;height:32px;cursor:pointer;color:var(--text)}
.fig-view-close:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* Audience actions: Suggest sits beside "Use the suggestion", both small and
   secondary to the field itself. */
.rb-audience-actions{display:inline-flex;align-items:center;gap:10px}
.rb-audience-actions button[disabled]{opacity:.6;cursor:default}

/* Source Templates page (features/templates.js). One card per document type;
   the highlight lands on the card a deep link (#templates/QRG) names. */
.template-steps{margin:10px 0 6px;padding-left:22px;display:grid;gap:6px;line-height:1.5}
.template-steps code{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--surface-2);padding:1px 5px;border-radius:5px}
.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-top:16px}
.template-card{display:flex;flex-direction:column;margin:0}
.template-card .panel-body{display:flex;flex-direction:column;gap:12px;flex:1}
.template-card .panel-header h3 .badge{margin-left:8px;vertical-align:middle}
.template-card.highlight{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 25%,transparent)}
.template-card .summary-list.compact{margin:0}
.template-upload-to{font-size:13px;line-height:1.5;color:var(--muted);padding:10px 12px;border-radius:10px;background:var(--surface-2)}
.template-upload-to strong{color:var(--text)}
.template-card .action-row{margin-top:auto;align-items:center}

/* ── Finalize Queue (#231) ─────────────────────────────────────────────────
   Read-only queue (spec I.1). States carry shape as well as colour so they read
   without it: decision is a diamond, interrupted and ready are round, held is a
   bar. Every colour comes from tokens.css, so both themes resolve together. */
.fq-toolbar{margin-bottom:14px}
/* v6.14.129: the split inbox and Issue ready documents (finalize-queue/navigation.js). */
.fq-svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.fq-kbd{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:5px;border:1px solid var(--border);border-bottom-width:2px;background:var(--surface-2);color:var(--muted);font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
.fq-n{display:inline-grid;place-items:center;min-width:20px;height:18px;padding:0 6px;border-radius:999px;background:var(--surface-3);color:var(--muted);font-size:11px;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:0}
.fq-top{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.fq-tabs{display:flex;flex-wrap:wrap;gap:2px;padding:3px;border-radius:11px;background:var(--surface-3);border:1px solid var(--border)}
.fq-tab{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--muted);padding:7px 12px;border-radius:8px;font-weight:650;font-size:12.5px;cursor:pointer}
.fq-tab .fq-n{background:var(--surface)}
.fq-tab:hover{color:var(--text)}
.fq-tab[aria-selected="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(16,40,30,.12)}
.fq-tab-needs .fq-n{background:var(--warning-soft);color:var(--warning)}
.fq-tab-ready .fq-n{background:var(--success-soft);color:var(--success)}
.fq-top-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fq-search{display:flex;align-items:center;gap:8px;min-width:250px;height:38px;padding:0 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--muted)}
.fq-search:focus-within{border-color:var(--mvta-green);box-shadow:0 0 0 3px var(--mvta-green-soft)}
.fq-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--text);outline:none}
.fq-split{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(0,1.25fr);gap:16px;align-items:start}
.fq-list-panel{display:flex;flex-direction:column;overflow:hidden;position:sticky;top:100px;max-height:calc(100vh - 124px)}
.fq-list{overflow:auto;flex:1}
.fq-group{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px 8px;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}
.fq-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;width:100%;padding:11px 14px 11px 17px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer}
.fq-row::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--fq-rail,var(--border))}
.fq-row:hover{background:var(--surface-2)}
.fq-row[aria-selected="true"]{background:var(--mvta-green-soft);box-shadow:inset -2px 0 0 var(--mvta-green)}
.fq-row:focus-visible{outline:2px solid var(--mvta-green);outline-offset:-2px}
.fq-tone-stop{--fq-rail:var(--danger)}.fq-tone-decide{--fq-rail:var(--warn-gate-ink)}.fq-tone-work{--fq-rail:var(--warning)}.fq-tone-review{--fq-rail:var(--gov-teal)}
.fq-tone-held{--fq-rail:var(--muted)}.fq-tone-neutral{--fq-rail:var(--border)}.fq-tone-ready{--fq-rail:var(--success)}.fq-tone-issued{--fq-rail:var(--surface-3)}
.fq-row-main{display:grid;gap:3px;min-width:0}
.fq-row-top{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted)}
.fq-row strong{font-size:13.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fq-row small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fq-row-side{display:grid;justify-items:end;align-content:center;gap:7px}
.fq-row-side small{font-size:11px;font-variant-numeric:tabular-nums}
.fq-type{font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--mvta-green);background:var(--mvta-green-soft);border-radius:5px;padding:2px 6px;white-space:nowrap}
.fq-member{padding-left:36px}
.fq-pickrow{position:relative}
.fq-pickrow .fq-row{padding-left:42px}
.fq-pickrow.fq-pickrow-member .fq-row{padding-left:60px}
.fq-pick{position:absolute;left:16px;top:14px;z-index:1;width:16px;height:16px;margin:0;accent-color:var(--mvta-green);cursor:pointer}
.fq-pickrow-member .fq-pick{left:36px}
.fq-pickrow-member .fq-row-main::before{left:20px}
.fq-run-unready{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px;font-size:12.5px;text-align:left}
.fq-run-unready li{display:grid;gap:2px}
.fq-run-unready small{color:var(--muted)}
.fq-member .fq-row-main::before{content:"";position:absolute;left:20px;top:0;height:50%;width:9px;border-left:1.5px solid var(--border);border-bottom:1.5px solid var(--border);border-bottom-left-radius:6px}
.fq-ghost strong{font-style:italic;font-weight:550;color:var(--muted)}
/* Document families in the list: a parent row, a fold line, its companions under a rail (families.js) */
.fq-chev{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .15s}
.fq-role{display:inline-flex;align-items:center;gap:4px;margin-left:auto;padding:1px 7px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.fq-role .mono{font-size:10.5px}
.fq-role-parent{background:var(--mvta-green-soft);color:var(--mvta-green);border:1px solid color-mix(in srgb,var(--mvta-green) 35%,transparent)}
.fq-role-companion{background:var(--surface-3);color:var(--muted);border:1px solid var(--border)}
.fq-famtail{position:relative}
.fq-famblock.is-open .fq-famtail::after{content:"";position:absolute;left:20px;top:0;bottom:34px;border-left:1.5px dashed var(--mvta-green);pointer-events:none}
.fq-famblock.is-open .fq-member .fq-row-main::before{border-color:var(--mvta-green);border-style:dashed}
.fq-famtoggle{display:flex;align-items:center;gap:8px;width:100%;padding:6px 14px 6px 36px;border:0;border-bottom:1px solid var(--border);background:var(--surface-2);color:var(--muted);font:600 11.5px/1.3 inherit;text-align:left;cursor:pointer}
.fq-famtoggle:hover{color:var(--text)}
.fq-famtoggle:focus-visible{outline:2px solid var(--mvta-green);outline-offset:-2px}
.fq-famtoggle>span:first-of-type{flex:1}
.fq-famtoggle[aria-expanded="true"] .fq-chev{transform:rotate(90deg)}
.fq-famchips{display:inline-flex;gap:3px}
.fq-famchips .fq-type{opacity:.75}
.fq-famkids{background:color-mix(in srgb,var(--mvta-green-soft) 45%,var(--surface))}
.fq-famline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 18px;border-bottom:1px solid var(--border);background:var(--surface-2);font-size:12px}
.fq-famline .fq-role{margin-left:0}
.fq-famlink{display:inline-flex;align-items:center;gap:7px;padding:4px 9px 4px 6px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);font:inherit;font-size:12px;cursor:pointer}
.fq-famlink:hover{border-color:var(--mvta-green);background:var(--mvta-green-soft)}
.fq-famlink em{color:var(--muted)}
.fq-famlink.is-issued{cursor:default}
.fq-famlink.is-issued:hover{border-color:var(--border);background:var(--surface)}
.fq-none{display:grid;gap:6px;justify-items:start;padding:24px 18px;color:var(--muted)}
.fq-none p{margin:0}
.fq-hints{display:flex;gap:14px;flex-wrap:wrap;padding:9px 14px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--border)}
.fq-hints span{display:inline-flex;align-items:center;gap:4px}
.fq-meter{display:flex;align-items:center;gap:10px}
.fq-meter-bar{display:flex;gap:2px;flex:1;max-width:220px}
.fq-meter-bar i{height:6px;flex:1;border-radius:2px;background:var(--surface-3)}
.fq-meter-compact .fq-meter-bar{width:72px;flex:none}
.fq-meter-compact .fq-meter-bar i{height:4px}
.fq-meter-bar .fq-seg-pass{background:var(--success)}
.fq-meter-bar .fq-seg-work,.fq-meter-bar .fq-seg-fail{background:var(--warning)}
.fq-meter-bar .fq-seg-decide{background:var(--warn-gate-ink)}
.fq-meter-label{font-size:12px;color:var(--muted)}
.fq-meter-label strong{color:var(--text)}
.fq-subhead{margin:4px 0 0;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fq-allgood{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:10px;background:var(--success-soft);color:var(--success)}
.fq-allgood svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.fq-allgood span{display:grid}.fq-allgood small{color:var(--muted)}
.fq-passing summary{cursor:pointer;display:flex;gap:8px;align-items:center;font-size:12px;font-weight:650;color:var(--muted);padding:4px 0;list-style:none}
.fq-passing summary::-webkit-details-marker{display:none}
.fq-passing summary::before{content:"›";display:inline-block;font-size:15px;transition:transform .15s}
.fq-passing[open] summary::before{transform:rotate(90deg)}
.fq-fix{white-space:nowrap;border:1px solid var(--border);background:var(--surface);color:var(--accent-strong);font-size:11.5px;font-weight:700;border-radius:8px;padding:5px 9px;cursor:pointer}
.fq-fix:hover{border-color:var(--mvta-green);background:var(--mvta-green-soft)}
.fq-iconbtn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer}
.fq-iconbtn:hover:not(:disabled){background:var(--surface-2);border-color:var(--mvta-green)}
.fq-iconbtn:disabled{opacity:.4;cursor:default}
.fq-pager{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.fq-pager span{margin-right:4px}
.fq-headrow{display:flex;justify-content:space-between;align-items:center;gap:12px}
.fq-state{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fq-detail-body{overflow:auto;flex:1;min-height:0}
.fq-actionbar{gap:8px;padding:14px 18px;border-top:1px solid var(--border);background:var(--surface);border-radius:0 0 var(--radius) var(--radius)}
.fq-family{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.fq-family-row{position:relative;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 10px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer}
.fq-family-row:hover{background:var(--surface-2)}
.fq-family-row.is-current{border-color:var(--mvta-green);background:var(--mvta-green-soft)}
.fq-family-row.fq-member{margin-left:18px;width:calc(100% - 18px);padding-left:10px}
.fq-family-row.is-issued{cursor:default}
.fq-family-row.is-issued:hover{background:transparent}
.fq-family-t{display:grid;font-size:12.5px;min-width:0}
.fq-family-t small{color:var(--muted);font-size:11px}
.fq-eyebrow{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--accent-strong)}
.fq-run{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:16px;align-items:start}
.fq-run-panel{padding:20px 24px;display:grid;gap:16px}
.fq-run-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.fq-run-head h3{margin:4px 0 0;font-size:15px}
.fq-run-head p{margin:4px 0 0}
.fq-run-progress{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted)}
.fq-run-progress progress{flex:1;max-width:420px;height:8px;accent-color:var(--mvta-green)}
.fq-run-steps{display:flex;gap:5px}
.fq-run-steps i{height:5px;flex:1;border-radius:3px;background:var(--surface-3)}
.fq-run-steps i.is-done{background:var(--success)}
.fq-run-steps i.is-current{background:var(--mvta-green)}
.fq-run-doc{display:grid;gap:10px}
.fq-run-doc .fq-sec{padding:6px 0;border-bottom:0}
.fq-run-title{margin:0;font-size:24px;line-height:1.2;text-wrap:balance}
.fq-run-family{margin:0;font-size:12.5px;color:var(--muted)}
.fq-run-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--border)}
.fq-run-foot .fq-why{flex:1 1 200px;text-align:right}
.fq-run-foot .primary{display:inline-flex;align-items:center;gap:6px}
.fq-run-rail{position:sticky;top:100px;display:grid;gap:8px}
.fq-run-next{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.fq-run-next button{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:9px 10px;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer}
.fq-run-next button:hover:not(:disabled){background:var(--surface)}
.fq-run-next button.is-current{background:var(--surface);border-color:var(--mvta-green);box-shadow:0 0 0 3px var(--mvta-green-soft)}
.fq-run-next small{display:block;color:var(--muted);font-size:11px}
.fq-run-num{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface-3);font-size:11px;font-weight:800;color:var(--muted)}
.fq-run-next button.is-current .fq-run-num{background:var(--mvta-green);color:var(--accent-text)}
.fq-run-issued{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:12.5px}
.fq-run-issued li{display:flex;gap:8px;align-items:flex-start}
.fq-run-issued svg{width:14px;height:14px;margin-top:3px;fill:none;stroke:var(--success);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.fq-run-issued small{display:block;color:var(--muted)}
.fq-run-done{justify-items:center;text-align:center;padding:36px}
.fq-run-done h3{margin:0;font-size:19px}
.fq-run-done .fq-run-issued{text-align:left}
.fq-run-mark{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--success-soft)}
.fq-run-mark svg{width:26px;height:26px;fill:none;stroke:var(--success);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.queue-return{display:inline-flex;align-items:center;gap:6px;height:40px}
.queue-return .mono{font-size:11.5px;color:var(--muted)}
.fq-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 9px 3px 7px;font-size:11px;font-weight:700;white-space:nowrap;line-height:1.35}
.fq-pill i{display:block;width:7px;height:7px;border-radius:2px;background:currentColor}
.fq-decide{color:var(--warn-gate-ink);background:var(--warn-gate-soft)} .fq-decide i{transform:rotate(45deg)}
.fq-work{color:var(--warning);background:var(--warning-soft)}
.fq-review{color:var(--gov-teal);background:var(--gov-teal-field)}
.fq-held{color:var(--muted);background:var(--surface-3)} .fq-held i{height:3px}
.fq-ready{color:var(--success);background:var(--success-soft)} .fq-ready i{border-radius:50%}
.fq-stop{color:var(--danger);background:var(--danger-soft)} .fq-stop i{border-radius:50%}
.fq-neutral{color:var(--muted);background:var(--surface-2);border:1px dashed var(--border)}
.fq-issued{color:var(--muted);background:var(--surface-3)}
.fq-dot.fq-decide,.fq-dot.fq-work,.fq-dot.fq-review,.fq-dot.fq-held,.fq-dot.fq-ready,.fq-dot.fq-stop,.fq-dot.fq-neutral{background:currentColor;border:0}
.fq-detail{position:sticky;top:100px;display:flex;flex-direction:column;max-height:calc(100vh - 124px)}
.fq-detail-empty{padding:26px 18px;color:var(--muted)}
.fq-head{display:grid;gap:8px;padding:16px 18px 12px;border-bottom:1px solid var(--border)}
.fq-head h3{margin:0;font-size:19px;line-height:1.3;text-wrap:balance}
.fq-ids{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--muted);font-size:12px}
.fq-ids>span:not(.fq-type)+span::before{content:"·";margin-right:8px}
.fq-sec{display:grid;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.fq-sec:last-child{border-bottom:0}
.fq-sec h4{margin:0;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fq-fresh{display:inline-flex;align-items:center;gap:6px;letter-spacing:0;text-transform:none;font-weight:500;font-size:11px}
.fq-fresh i{width:6px;height:6px;border-radius:50%;background:var(--success)}
.fq-checking{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}
.fq-checks{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.fq-check{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:10px;align-items:start;padding:7px 8px;border-radius:9px}
.fq-ico{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.fq-ico svg{width:11px;height:11px;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.fq-check-pass .fq-ico{background:var(--success-soft)} .fq-check-pass .fq-ico svg{stroke:var(--success)}
.fq-check-decide{background:var(--warn-gate-soft)} .fq-check-decide .fq-ico{border:1.5px solid var(--warn-gate-ink)} .fq-check-decide .fq-ico svg{stroke:var(--warn-gate-ink)}
.fq-check-fail,.fq-check-work{background:var(--warning-soft)} .fq-check-fail .fq-ico,.fq-check-work .fq-ico{border:1.5px solid var(--warning)} .fq-check-fail .fq-ico svg,.fq-check-work .fq-ico svg{stroke:var(--warning)}
.fq-check-deferred .fq-ico{border:1.5px dashed var(--border)} .fq-check-deferred .fq-ico svg{stroke:var(--muted)} .fq-check-deferred .fq-txt{color:var(--muted)}
.fq-txt{font-size:12.5px}
.fq-txt small{display:block;margin-top:1px;color:var(--muted);font-size:11px}
/* Recommendation Recheck decisions (finalize-queue/recheck-rows.js): the row says
   what its decision did. Accepted and kept read as done; rejected and marked for
   removal read as set aside; both keep their text legible. */
.fq-check-decided{background:var(--surface-2)}
.fq-check-decided.is-accepted,.fq-check-decided.is-kept,.fq-check-decided.is-refresh{box-shadow:inset 3px 0 0 var(--success)}
.fq-check-decided.is-accepted .fq-ico,.fq-check-decided.is-kept .fq-ico,.fq-check-decided.is-refresh .fq-ico{background:var(--success-soft)}
.fq-check-decided.is-accepted .fq-ico svg,.fq-check-decided.is-kept .fq-ico svg,.fq-check-decided.is-refresh .fq-ico svg{stroke:var(--success)}
.fq-check-decided.is-rejected,.fq-check-decided.is-removing{box-shadow:inset 3px 0 0 var(--border)}
.fq-check-decided.is-rejected .fq-ico,.fq-check-decided.is-removing .fq-ico{border:1.5px solid var(--border)}
.fq-check-decided.is-rejected .fq-ico svg,.fq-check-decided.is-removing .fq-ico svg{stroke:var(--muted)}
.fq-txt .fq-decision{display:flex;align-items:center;gap:5px;margin-top:4px;font-size:11.5px;font-weight:600}
.fq-txt .fq-decision svg{width:11px;height:11px;flex:none;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.fq-txt .fq-decision.is-accepted,.fq-txt .fq-decision.is-kept,.fq-txt .fq-decision.is-refresh{color:var(--success)}
.fq-txt .fq-decision.is-rejected,.fq-txt .fq-decision.is-removing{color:var(--muted);font-weight:500}
.fq-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px!important}
.fq-dest{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.fq-dest .mono{font-size:11.5px;word-break:break-word}
.fq-dest small,.fq-note{color:var(--muted);font-size:11.5px;margin:0}
.fq-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:12px;align-items:center}
.fq-kv dt{color:var(--muted)} .fq-kv dd{margin:0;display:flex;gap:8px;align-items:center;justify-content:space-between}
.fq-actions{gap:8px}
.fq-why{flex-basis:100%;color:var(--muted);font-size:11.5px}
.fq-nopackage{margin-bottom:14px}
.fq-empty{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:34px;padding:32px 34px;align-items:start}
.fq-empty h2{margin:0 0 8px;font-size:20px;text-wrap:balance}
.fq-empty p{margin:0 0 12px;color:var(--muted);max-width:60ch}
.fq-path{display:grid;gap:12px;padding:16px;border:1px dashed var(--border);border-radius:12px;background:var(--surface-2)}
.fq-path ol{list-style:none;margin:0;padding:0;counter-reset:fq}
.fq-path li{counter-increment:fq;position:relative;display:grid;gap:2px;padding:0 0 16px 38px;font-size:13px}
.fq-path li::before{content:counter(fq);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:800;background:var(--surface-3);color:var(--muted)}
.fq-path li:not(:last-child)::after{content:"";position:absolute;left:12.5px;top:28px;bottom:2px;border-left:1.5px dashed var(--border)}
.fq-path li.fq-here::before{background:var(--mvta-green);color:var(--accent-text)}
.fq-path small{color:var(--muted);font-size:12px}
.fq-count{margin-left:6px;background:var(--mvta-orange);color:var(--accent-on-orange);font-size:10px;font-weight:800;border-radius:999px;padding:0 6px;font-variant-numeric:tabular-nums}
@media (max-width:1100px){.fq-split,.fq-run{grid-template-columns:1fr}.fq-detail,.fq-list-panel,.fq-run-rail{position:static;max-height:none}.fq-list{max-height:50vh}.fq-empty{grid-template-columns:1fr}}
@media (max-width:760px){.fq-search{min-width:0;flex:1}.fq-top-tools{width:100%}.fq-run-foot .fq-why{text-align:left}}

/* #231 I.2: Finalize from the queue */
.fq-notice { margin: 0 0 12px; }
.fq-blockers { margin: 8px 0 0; padding-left: 18px; font-size: 13px; }
.fq-sec .finalize-choices { margin: 0; }

/* #236 Reference Recommendations */
.recommendations .recommendation-row { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--line, rgba(0,0,0,.08)); }
.recommendations .recommendation-row:first-of-type { border-top: 0; }
.recommendations .recommendation-body { display: grid; gap: 3px; min-width: 0; }
.recommendations .recommendation-body p { margin: 2px 0 0; }
.recommendations .recommendation-evidence { margin: 4px 0 0; padding-left: 18px; font-size: 13px; }
.recommendations .recommendation-row.is-rejected .recommendation-body { opacity: .7; }
/* A decision is said in words on the card, not only by which button is filled. */
.recommendations .recommendation-row.is-accepted { box-shadow: inset 3px 0 0 var(--success, #1f7a4d); padding-left: 12px; }
.recommendations .recommendation-row.is-rejected { box-shadow: inset 3px 0 0 var(--border, rgba(0,0,0,.18)); padding-left: 12px; }
.recommendations .recommendation-status { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; margin-top: 4px; }
.recommendations .recommendation-status.is-accepted { color: var(--success, #1f7a4d); }
.recommendations .recommendation-status.is-rejected { color: var(--muted); font-weight: 500; }
.recommendations .recommendation-row .action-row button { display: inline-flex; align-items: center; gap: 5px; }
.recommendations .recommendation-info { margin-top: 8px; font-size: 13px; }

/* #341: Rebuild runbook Follow-on Work in the Finalize Queue's Issued rows. Never a state. */
.fq-row small.fq-follow-on{display:block;color:var(--muted);font-style:italic}
.fq-follow-on-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.fq-follow-on-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
/* The Issued Landing (finalize-queue/issued-landing.js): what a Finalize lands on. */
.fq-landing{display:contents}
.fq-landing-head{display:grid;gap:6px}
.fq-landing-head h3{margin:0}
.fq-landing-eyebrow{margin:0;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--success)}
.fq-life{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr)}
.fq-life-step{position:relative;display:grid;justify-items:center;gap:6px;font-size:12px;text-align:center;color:var(--muted)}
.fq-life-step::before{content:"";position:absolute;top:11px;left:-50%;width:100%;height:2px;background:var(--border)}
.fq-life-step:first-child::before{display:none}
.fq-life-step.is-done::before,.fq-life-step.is-now::before{background:var(--success)}
.fq-life-dot{position:relative;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--surface);border:2px solid var(--border);color:var(--surface)}
.fq-life-step.is-done .fq-life-dot,.fq-life-step.is-now .fq-life-dot{background:var(--success);border-color:var(--success)}
.fq-life-step.is-now .fq-life-dot{box-shadow:0 0 0 4px var(--success-soft)}
.fq-life-step.is-now{color:var(--text);font-weight:700}
.fq-life-dot svg,.fq-landing-tick svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fq-landing-done,.fq-landing-next{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fq-landing-done li{display:flex;gap:10px;align-items:flex-start}
.fq-landing-tick{display:inline-grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;background:var(--success-soft);color:var(--success)}
.fq-landing-next li{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.fq-upnext{display:grid;gap:6px;padding:14px 16px;border:2px solid var(--brand);border-radius:10px;background:var(--surface)}
.fq-upnext .fq-landing-eyebrow{color:var(--brand)}
.fq-upnext h3{margin:0;font-size:17px}
.fq-upnext p{margin:0}
.fq-upnext-ids{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fq-upnext.is-empty{border:1px dashed var(--border)}
.fq-upnext.is-empty .fq-landing-eyebrow{color:var(--muted)}
.fq-landing-more{margin:0;padding:10px 18px 14px}
@media (max-width:560px){.fq-life{grid-template-columns:repeat(5,minmax(0,1fr))}.fq-life-step{font-size:11px}}
/* #341: Rebuild runbook on the SOP's Documents row. A way in, not a status. */
button.badge.doc-follow-on{border:0;cursor:pointer;font:inherit;font-size:11px;background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--border)}
button.badge.doc-follow-on:hover{background:var(--surface-3)}

/* ── Proposed Glossary Terms: a review queue, not a list of dialogs ─────────
   The status filter became TABS, which retires the Status column and gives the
   proposed definition the width to be read; search and the source filter make 65
   waiting terms navigable; and the two states an approver has to know — no
   definition written, and a term the Master Glossary already covers — are marked
   on the row itself. The gate mark uses the governed warn ramp (Burnt Orange,
   4.84:1 on white) rather than --warning, whose 12% field measures 3.66:1 under
   11px bold text. */
.gq-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:6px;margin:10px 0 12px}
.gq-tabs{display:flex;gap:4px}
.gq-tab{border:0;background:transparent;color:var(--muted);padding:9px 14px;border-radius:8px;font:inherit;font-weight:650;font-size:12px;cursor:pointer}
.gq-tab:hover{background:var(--surface-2);color:var(--text)}
.gq-tab.active{background:var(--accent-strong);color:var(--accent-text);font-weight:700}
.gq-tab span{opacity:.75;margin-left:5px}
.gq-search{flex:1 1 220px;min-width:180px}
.gq-search,.gq-source{display:flex!important;align-items:center;gap:8px;margin:0;font-size:11px;font-weight:700;color:var(--muted)}
.gq-search input,.gq-source select{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:9px;padding:8px 11px;font:inherit;font-size:12px;font-weight:400;outline:none}
.gq-search input{flex-grow:1;min-width:0}
.gq-search input:focus,.gq-source select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
.gq-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.gq-summary p{margin:0;font-size:11.5px}
.gq-chips{display:flex;gap:8px;flex-wrap:wrap}
.badge.gq-mark-gate,.badge.gq-mark-known{display:inline-block;margin-top:6px;margin-right:6px;font-weight:700;white-space:normal}
.badge.gq-mark-gate{background:var(--warn-gate-soft);color:var(--warn-gate-ink);box-shadow:inset 0 0 0 1px var(--warn-gate-line)}
.badge.gq-mark-known{background:var(--accent-soft);color:var(--accent);box-shadow:inset 0 0 0 1px rgba(0,85,61,.22)}
html[data-theme="dark"] .badge.gq-mark-known{box-shadow:inset 0 0 0 1px var(--border)}
.gq-chips .badge{margin-top:0}
.gq-table{table-layout:fixed}
.gq-table th.gq-tick,.gq-table td.gq-tick{width:40px;padding-right:0}
.gq-table th.gq-term{width:21%}
.gq-table th:nth-last-child(3){width:17%}
.gq-table th:nth-last-child(2){width:104px}
.gq-table th:last-child{width:92px}
.gq-table td .mono{white-space:nowrap}
.gq-table td small{max-width:none}
.gq-table td.gq-tick input{width:15px;height:15px;accent-color:var(--accent-strong)}
.gq-table tbody tr.gq-row-gate>td{background:var(--warn-gate-soft)}
.gq-definition{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}
.gq-notice{display:flex;align-items:center;gap:10px;flex-wrap:wrap;max-width:none;margin:0 0 12px}
.gq-notice span{flex-grow:1;line-height:1.5}
.gq-notice .icon-button{width:28px;height:28px;flex:0 0 28px;font-size:15px;line-height:1}
.gq-bulkbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--mvta-green-deep);color:#fff;border-radius:12px;padding:13px 16px;margin-top:12px;box-shadow:var(--shadow)}
.gq-bulkbar strong{font-size:13px}
.gq-bulkbar span{font-size:11.5px;color:rgba(255,255,255,.78);line-height:1.45}
.gq-bulkbar .action-row{margin-left:auto}
.gq-bulkbar .secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.25)}
.gq-bulkbar .primary{background:#fff;color:var(--mvta-green-deep)}

/* The review panel is a DRAWER over the queue, so the list it came from stays
   behind it and ↑ ↓ walk through it — 65 waiting terms are reviewed without
   opening and closing 65 dialogs. */
.drawer-backdrop{place-items:stretch;justify-items:end;padding:0}
.admin-drawer{display:flex;flex-direction:column;width:min(620px,100%);height:100%;background:var(--surface);border-left:1px solid var(--border);box-shadow:-24px 0 60px rgba(16,40,30,.18)}
.gq-head{display:flex;align-items:flex-start;gap:12px;padding:20px 22px 15px;border-bottom:1px solid var(--border)}
.gq-head>div:first-child{flex-grow:1;min-width:0}
.gq-head-title{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.gq-head-title h3{margin:0;font-size:16px}
.gq-head p{margin:6px 0 0;font-size:11.5px}
.gq-head .icon-button{width:32px;height:32px;font-size:14px;line-height:1}
.gq-body{flex-grow:1;overflow:auto;padding:18px 22px;display:flex;flex-direction:column;gap:16px}
.gq-body .inline-alert{margin:0;max-width:none;display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;line-height:1.5}
.gq-body .inline-alert.gq-dirty{background:var(--accent-soft);color:var(--text)}
.gq-body .field{gap:7px}
.gq-body .field input,.gq-body .field textarea{font-size:13px}
.gq-body .field input[readonly],.gq-body .field textarea[readonly]{background:var(--surface-2)}
.gq-def-head{display:flex;align-items:center;gap:9px;font-weight:400}
.gq-def-head .gq-count{font-size:11px;margin-left:auto}
.gq-meta{margin:0}
.gq-foot{display:flex;align-items:center;gap:10px;padding:15px 22px;border-top:1px solid var(--border);background:var(--surface-2)}
/* Rejecting is QUIET until intent is shown, and emphatic only where it commits.
   The entry point had that inverted: a permanent red border (shouting) on a button
   two thirds the height of the ones beside it (timid), so it read as both alarming
   and unimportant. It is a PEER of Save and Approve now — same size, neutral border,
   danger ink — and the red arrives on hover/focus, then filled on the confirmation
   that actually rejects. The confirm button is deliberately left solid. */
.gq-foot .gq-reject{border-color:var(--border);color:var(--danger);background:var(--surface)}
.gq-foot .gq-reject:hover{border-color:color-mix(in srgb,var(--danger) 40%,transparent);background:var(--danger-soft)}
.gq-foot .gq-reject:focus-visible{outline:2px solid var(--danger);outline-offset:2px}
/* Same rule on the dark bulk bar, where a solid red slab sat beside the primary.
   It keeps `small` there because ITS neighbours are small — peer of what is beside
   it, not one fixed size. */
.gq-bulkbar .gq-bulk-reject{background:transparent;color:#ff9a90;border-color:rgba(255,154,144,.45)}
.gq-bulkbar .gq-bulk-reject:hover{background:rgba(255,154,144,.14);border-color:rgba(255,154,144,.75)}
.gq-bulkbar .gq-bulk-reject:focus-visible{outline:2px solid #ff9a90;outline-offset:2px}
.gq-why{margin:0;padding:0 22px 14px;background:var(--surface-2);font-size:11px;color:var(--warn-gate-ink);text-align:right}
.gq-confirm{border-top:1px solid var(--border);background:var(--danger-soft);padding:15px 22px;display:flex;flex-direction:column;gap:12px}
.gq-confirm strong{font-size:13px;color:var(--danger)}
.gq-confirm p{margin:6px 0 0;font-size:12px;line-height:1.5;color:var(--text)}
.gq-confirm .action-row{justify-content:flex-end}
@media(max-width:760px){.gq-toolbar{align-items:stretch;flex-direction:column}.gq-tabs{flex-wrap:wrap}.gq-bulkbar .action-row{margin-left:0;width:100%}}

/* A run open in another tab (plans/2026-10-01-run-open-in-another-tab.md). */
.uw-fresh-tab{max-width:760px}
.uw-fresh-tab-list{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:10px}
.uw-fresh-tab-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.uw-fresh-tab-list li span{min-width:0}
.uw-fresh-tab-list li button{flex:none}
.uw-fresh-tab .inline-alert{margin-bottom:12px}
.uw-doc-id{display:inline-block;margin-left:8px;font-size:11px;font-weight:700;color:var(--text);vertical-align:middle}
@media (max-width:640px){.uw-fresh-tab-list li{flex-direction:column;align-items:stretch}}

/* #700: a Policy's stage with the Board, under its Status on Documents. */
.policy-stage{display:block;margin-top:5px}
/* Copy link (services/copy-link.js): sits beside the "Open … in SharePoint" link. */
.file-link-row{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.file-link-row .file-link{margin-top:0}
.copy-link{padding:0 2px;white-space:nowrap}
.version-row .copy-link{margin-left:8px}
.copy-link-status{position:fixed;left:50%;bottom:24px;transform:translate(-50%,8px);z-index:90;background:var(--text);color:var(--surface);padding:8px 14px;border-radius:9px;font-size:12px;font-weight:650;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.copy-link-status.is-visible{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){.copy-link-status{transition:none}}

/* Operational Bulletins (ADR 0027): the builder's form beside a live preview of
   the one-page bulletin. The sheet is paper, so it keeps light colours in both
   themes — what operators read is a printed page. */
.bulletin-sheet{background:#fff;color:#3B3B3B;border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow);padding:28px 30px;font-family:Arial,Helvetica,sans-serif;font-size:13px;line-height:1.45;max-width:100%;overflow-wrap:anywhere}
.bulletin-sheet-head{border-bottom:2px solid #417B68;padding-bottom:8px;margin-bottom:10px}
.bulletin-sheet-kind{margin:0;color:#417B68;font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase}
.bulletin-sheet-code{margin:2px 0 0;font-weight:700;font-size:15px;color:#262626}
.bulletin-sheet-facts{display:grid;gap:3px;margin:0 0 12px}
.bulletin-sheet-facts div{display:grid;grid-template-columns:92px 1fr;gap:8px}
.bulletin-sheet-facts dt{font-weight:700;color:#424242}
.bulletin-sheet-facts dd{margin:0}
.bulletin-sheet-effective{font-weight:700}
.bulletin-sheet-supersedes{font-style:italic;color:#4F4F4F}
.bulletin-sheet h3{color:#417B68;font-size:14px;margin:14px 0 4px}
.bulletin-sheet ul{margin:0;padding-left:20px}
.bulletin-sheet-figure{margin:12px 0;text-align:center}
.bulletin-sheet-figure img{max-width:100%;height:auto;border:1px solid #ddd}
.bulletin-sheet-person{margin:12px 0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;align-items:start}
.bulletin-sheet-person h3{grid-column:1/-1;margin:0}
.bulletin-sheet-person img{max-width:160px;max-height:200px;border:1px solid #ddd}
.bulletin-sheet-person dl{margin:0;display:grid;gap:4px}
.bulletin-sheet-person dt{font-weight:700;display:inline}
.bulletin-sheet-person dd{display:inline;margin:0 0 0 4px}
.bulletin-sheet-figure figcaption{font-size:11px;color:#4F4F4F;font-style:italic;margin-top:4px}
.bulletin-sheet-expiry{font-weight:700;margin-top:12px}
.bulletin-sheet .preview-flagged{background:#fff2e8;color:#B26A00;font-weight:700}
/* The board, the builder and an issued bulletin (design canvas "Operational
   Bulletins", 2026-10-04). States read their colour from the four tones below,
   each also differing in lightness so in force and superseded are told apart
   without hue. */
:root{--bul-ok:#0b6b47;--bul-ok-soft:rgba(11,107,71,.10);--bul-scheduled:#1f4f8f;--bul-scheduled-soft:#e6eefa;--bul-ending:#a33d12;--bul-ending-soft:rgba(195,75,24,.10);--bul-idle:#55665d;--bul-idle-soft:var(--surface-3);--bul-track:#e2eae5;--bul-lead:#00553D;--bul-ai:#173a2d}
html[data-theme="dark"]{--bul-ok:#2ecf8a;--bul-ok-soft:rgba(46,207,138,.14);--bul-scheduled:#9cc0f5;--bul-scheduled-soft:rgba(156,192,245,.14);--bul-ending:#f3ab5c;--bul-ending-soft:rgba(243,171,92,.14);--bul-idle:#9fb4a9;--bul-track:rgba(255,255,255,.10);--bul-lead:#0e5a43;--bul-ai:#0e2a20}
.bul-board-head,.bul-head-row{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-end;justify-content:space-between;margin-bottom:18px}
.bul-eyebrow{margin:0 0 4px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.3px}
.bul-lede{margin:0;font-size:14px;color:var(--muted);max-width:640px}
.bul-cta,.bul-link-button,.bul-wide{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;font-size:14px;text-decoration:none;justify-content:center}
.bul-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:20px}
.bul-stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;display:grid;gap:6px}
.bul-stat span{font-size:12.5px;font-weight:650;color:var(--muted)}
.bul-stat strong{font-size:32px;line-height:1;font-weight:750;color:var(--text)}
.bul-stat strong.is-scheduled{color:var(--bul-scheduled)}.bul-stat strong.is-ending{color:var(--bul-ending)}
.bul-stat small{font-size:12px;color:var(--muted)}
.bul-stat.is-lead{background:var(--bul-lead);border-color:transparent}
.bul-stat.is-lead span,.bul-stat.is-lead small{color:rgba(255,255,255,.8)}.bul-stat.is-lead strong{color:#fff}
.bul-stat.is-draft{border-style:dashed;border-color:color-mix(in srgb,var(--text) 22%,transparent)}
.bul-filters{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:space-between;margin-bottom:14px}
.bul-segmented{display:inline-flex;flex-wrap:wrap;background:var(--surface-3);border-radius:11px;padding:4px;gap:2px}
.bul-segmented button{border:0;background:transparent;color:var(--muted);border-radius:8px;min-height:38px;padding:0 15px;font-size:13px;font-weight:650;cursor:pointer}
.bul-segmented button[aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(16,40,30,.16)}
.bul-route-filter{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:650;color:var(--muted)}
.bul-route-filter select{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;min-height:40px;padding:0 12px;font-size:13px;max-width:min(320px,70vw)}
.bul-segmented button:focus-visible,.bul-back:focus-visible,.bul-ai-button:focus-visible{outline:2px solid var(--mvta-orange);outline-offset:2px}
.bul-cards{display:grid;gap:12px}
.bul-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:14px 28px;align-items:center;transition:border-color .15s ease}
.bul-card:hover{border-color:color-mix(in srgb,var(--mvta-green) 45%,transparent)}
@media (max-width:760px){.bul-card{grid-template-columns:minmax(0,1fr)}}
.bul-card-main{display:grid;gap:8px;min-width:0}
.bul-card-meta{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.bul-code{font-family:"SFMono-Regular",Consolas,monospace;font-weight:700;font-size:13px;color:var(--mvta-green)}
a.bul-code{text-decoration:none}a.bul-code:hover{text-decoration:underline}
.bul-state{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:650;border-radius:999px;padding:3px 10px;color:var(--bul-idle);background:var(--bul-idle-soft)}
.bul-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.bul-state.is-in-force{color:var(--bul-ok);background:var(--bul-ok-soft)}
.bul-state.is-scheduled{color:var(--bul-scheduled);background:var(--bul-scheduled-soft)}
.bul-state.is-superseded,.bul-state.is-rescinded{color:var(--bul-ending);background:var(--bul-ending-soft)}
.bul-state.is-draft{background:transparent;border:1px dashed color-mix(in srgb,var(--text) 30%,transparent)}
.bul-audience{font-size:12px;font-weight:650;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:2px 7px}
.bul-kind{font-size:12px;font-weight:700;border-radius:6px;padding:2px 7px}
.bul-kind.is-trespass{color:#8a1c1c;background:color-mix(in srgb,#c0392b 12%,transparent);border:1px solid color-mix(in srgb,#c0392b 35%,transparent)}
.bul-card-title{margin:0;font-size:16.5px;font-weight:650;line-height:1.35}
.bul-card-title a{color:var(--text);text-decoration:none}.bul-card-title a:hover{color:var(--mvta-green);text-decoration:underline}
.bul-tags{display:flex;flex-wrap:wrap;gap:6px}
.bul-tags:empty{display:none}
.bul-tags span{font-size:12px;font-weight:550;color:var(--text);background:var(--surface-3);border-radius:6px;padding:3px 8px}
.bul-card-note{display:flex;gap:7px;align-items:center;margin:0;font-size:13px;font-weight:550;color:var(--bul-ending)}
.bul-card-time{display:grid;gap:9px;min-width:0}
.bul-dates{display:flex;justify-content:space-between;gap:12px;font-size:12.5px}
.bul-dates div{display:grid;gap:2px}.bul-dates div:last-child{text-align:right}
.bul-dates span{color:var(--muted)}.bul-dates strong{font-weight:650}
.bul-track{height:6px;border-radius:99px;background:var(--bul-track);overflow:hidden}
.bul-track span{display:block;height:100%;border-radius:99px;background:color-mix(in srgb,var(--bul-idle) 45%,transparent)}
.bul-track .tone-ok{background:var(--bul-ok)}.bul-track .tone-ending{background:var(--mvta-orange)}
.bul-timing{margin:0;font-size:12px;color:var(--muted)}
.bul-empty{margin:0;background:var(--surface);border:1px dashed color-mix(in srgb,var(--text) 22%,transparent);border-radius:var(--radius);padding:36px;text-align:center;color:var(--muted);font-size:14px}
.bul-footnote{margin:16px 0 0;font-size:12.5px;color:var(--muted)}
.bul-head{margin-bottom:4px}
.bul-back{border:0;background:transparent;color:var(--mvta-green);font-size:13px;font-weight:700;padding:6px 0;display:inline-flex;align-items:center;gap:6px;cursor:pointer;margin-bottom:6px}
.bul-head-title{display:grid;gap:8px;min-width:0}
.bul-head-title h2{margin:0;font-size:26px;font-weight:750;letter-spacing:-.3px;line-height:1.25;overflow-wrap:anywhere}
.bul-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bul-steps li{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:650;color:var(--muted);padding:5px 12px 5px 5px;background:var(--surface);border:1px solid var(--border);border-radius:999px}
.bul-step-mark{width:24px;height:24px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--muted) 70%,transparent);display:grid;place-items:center;font-size:12px;box-sizing:border-box}
.bul-steps li.is-done{color:var(--bul-ok)}.bul-steps li.is-done .bul-step-mark{background:var(--bul-ok);border-color:var(--bul-ok);color:#fff}
.bul-steps li.is-current{background:var(--bul-lead);border-color:transparent;color:#fff}.bul-steps li.is-current .bul-step-mark{background:#fff;border-color:#fff;color:#00553D}
.bul-layout{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}
.bul-main{flex:1.15 1 520px;min-width:0;display:grid;gap:18px}
.bul-side{flex:.85 1 380px;min-width:0;display:grid;gap:18px;position:sticky;top:100px;max-height:calc(100vh - 116px);overflow:auto;border-radius:16px}
.bul-layout.is-issued .bul-main{flex:1.3 1 560px}.bul-layout.is-issued .bul-side{flex:.7 1 320px;position:static;max-height:none;overflow:visible}
.bul-panel{background:var(--surface);border:1px solid var(--border);border-radius:16px}
.bul-panel-head{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;justify-content:space-between}
.bul-panel-head h3,.bul-panel-body h3{margin:0;font-size:15px;font-weight:750}
.bul-panel-head p{margin:0;font-size:12.5px;color:var(--muted)}
.bul-panel-body{padding:18px 20px;display:grid;gap:14px}
.bul-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px 18px}
.bul-fields.single{grid-template-columns:minmax(0,1fr)}
.bul-field{display:grid;gap:7px;align-content:start;min-width:0;border:0;margin:0;padding:0}
.bul-field.full{grid-column:1/-1}
.bul-field>span,.bul-field>legend{font-size:12.5px;font-weight:650;color:var(--text);padding:0}
.bul-field>legend{margin-bottom:7px}
.bul-field em,.bul-figure em{font-style:normal;font-weight:400;color:var(--muted)}
.bul-field input:not([type=radio]):not([type=checkbox]),.bul-field select,.bul-field textarea,.bul-ai textarea{border:1px solid color-mix(in srgb,var(--text) 18%,transparent);background:var(--surface);color:var(--text);border-radius:10px;padding:10px 12px;min-height:44px;font-size:14px;outline:none;box-sizing:border-box;width:100%}
.bul-field textarea{line-height:1.6;resize:vertical}
.bul-field input:focus,.bul-field select:focus,.bul-field textarea:focus,.bul-ai textarea:focus{border-color:var(--mvta-green);box-shadow:0 0 0 3px color-mix(in srgb,var(--mvta-green) 18%,transparent)}
.bul-field input:disabled{background:var(--surface-2);color:var(--muted)}
.bul-field .bul-subject{font-size:16px;font-weight:650}
.bul-field .field-help{margin:0;font-size:12px}
.bul-seg{display:flex;background:var(--surface-3);border-radius:10px;padding:4px;gap:2px}
.bul-seg label{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;min-height:38px;border-radius:7px;font-size:13.5px;font-weight:650;color:var(--muted);cursor:pointer}
.bul-seg label:has(input:checked){background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(16,40,30,.16)}
.bul-seg input,.bul-choice input{accent-color:var(--mvta-green);margin:0}
.bul-choice-row{display:flex;flex-wrap:wrap;gap:8px}
.bul-choice-row input[type=date]{flex:1 1 160px;width:auto}
.bul-choice-row input[type=date]:disabled{display:none}
.bul-choice{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:1px solid color-mix(in srgb,var(--text) 18%,transparent);border-radius:10px;font-size:13.5px;font-weight:550;cursor:pointer}
.bul-choice:has(input:checked){border:1.5px solid var(--mvta-green);background:color-mix(in srgb,var(--mvta-green) 7%,transparent);font-weight:650}
.bul-ai{background:var(--bul-ai);color:#fff;border-radius:16px;padding:20px;display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end;justify-content:space-between}
.bul-ai-text{flex:1 1 380px;min-width:0;display:grid;gap:10px}
.bul-ai h3{margin:0;font-size:15px;font-weight:750;display:flex;align-items:center;gap:8px}
.bul-ai h3 svg{color:var(--mvta-orange)}.bul-ai h3 span{font-weight:500;font-size:12.5px;color:rgba(255,255,255,.65)}
.bul-ai p{margin:0;font-size:12.5px;color:rgba(255,255,255,.75)}
.bul-ai-sources{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.bul-ai-sources li{font-size:12.5px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:5px 6px 5px 10px;display:flex;align-items:center;gap:6px}
.bul-chip-remove{border:0;background:transparent;color:rgba(255,255,255,.8);font-size:16px;line-height:1;width:24px;height:24px;border-radius:6px;cursor:pointer}
.bul-chip-remove:hover{background:rgba(255,255,255,.14);color:#fff}
.bul-ai-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.bul-ai-inputs label{display:grid;gap:6px;font-size:12.5px;font-weight:650;align-content:start}
.bul-ai-inputs small{font-weight:400;color:rgba(255,255,255,.65)}
.bul-ai-file input{font-size:12.5px;color:rgba(255,255,255,.85)}
.bul-ai textarea{min-height:44px;resize:vertical}
.bul-ai-button{background:var(--mvta-orange);color:var(--accent-on-orange);border:0;border-radius:10px;min-height:44px;padding:0 18px;font-weight:750;font-size:14px;cursor:pointer}
.bul-ai-button:disabled{opacity:.6;cursor:not-allowed}
.bul-ai .ai-run{color:#fff}
.bul-ai-alert{flex-basis:100%;margin:0}
.bul-figure{border:1.5px dashed color-mix(in srgb,var(--text) 22%,transparent);border-radius:12px;padding:16px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.bul-figure>div:first-child{display:grid;gap:3px}.bul-figure strong{font-size:13.5px}.bul-figure small{font-size:12.5px;color:var(--muted)}
.bul-figure-file{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:13.5px}.bul-figure-file span{display:inline-flex;gap:6px;align-items:center}
.bul-figure .bul-field{flex-basis:100%}
.bul-file-button{position:relative;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;min-height:40px;padding:0 14px;font-weight:650;font-size:13.5px;display:inline-flex;align-items:center;cursor:pointer}
.bul-file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}
.bul-file-button:focus-within{outline:2px solid var(--mvta-orange);outline-offset:2px}
.bul-paper{background:var(--surface-3);border-radius:16px;padding:14px}
.bul-paper header{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 12px}
.bul-paper h3{margin:0;font-size:13.5px;font-weight:750}.bul-paper header span{font-size:12px;color:var(--muted)}
.bul-paper .bulletin-sheet{border:0;border-radius:4px;box-shadow:0 10px 28px rgba(16,40,30,.16)}
.bul-layout.is-issued .bul-paper .bulletin-sheet{max-width:780px;margin:0 auto;padding:clamp(24px,4vw,44px);font-size:14px}
.bul-issue h3{font-size:16px}
.bul-checklist{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:13.5px}
.bul-checklist li{display:flex;gap:10px;align-items:flex-start;line-height:1.45}
.bul-ring{width:18px;height:18px;flex:none;border-radius:50%;border:2px solid var(--mvta-orange);box-sizing:border-box;margin-top:1px}
.bul-ready,.bul-sync{margin:0;display:flex;gap:10px;align-items:center;font-size:13.5px}
.bul-tick{width:20px;height:20px;flex:none;border-radius:50%;background:var(--bul-ok);color:#fff;display:grid;place-items:center}
.bul-action-row{display:flex;flex-wrap:wrap;gap:10px}
.bul-action-row button{min-height:44px}
.bul-grow{flex:1 1 auto}
.bul-wide{width:100%}
.bul-fine{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.bul-notice{display:flex;gap:12px;align-items:center;background:var(--bul-ending-soft);border:1px solid color-mix(in srgb,var(--bul-ending) 30%,transparent);color:var(--bul-ending);border-radius:14px;padding:14px 18px;margin-bottom:16px}
.bul-notice p{margin:0;font-size:14px}.bul-notice .bul-code{color:inherit}
.bul-life-h{margin-bottom:2px}
.bul-life{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.bul-life li{display:grid;gap:6px;font-size:12px;color:var(--muted)}
.bul-life strong{font-size:14px;font-weight:650;color:var(--text)}
.bul-life-bar{height:4px;border-radius:99px;background:var(--bul-ok)}
.bul-life li.is-future .bul-life-bar{background:repeating-linear-gradient(90deg,var(--mvta-orange) 0 8px,transparent 8px 12px)}
.bul-life li.is-future strong{color:var(--bul-ending)}
.bul-layout.is-issued{margin-top:16px}
.bul-facts{margin:0;display:grid;gap:12px;font-size:13.5px}
.bul-facts div{display:grid;gap:2px}.bul-facts dt{font-size:12px;color:var(--muted)}.bul-facts dd{margin:0;overflow-wrap:anywhere}
.bul-field .bul-routes{border-color:color-mix(in srgb,var(--text) 18%,transparent);border-radius:10px}
.bul-field .bul-routes>summary{min-height:44px;box-sizing:border-box;display:flex;align-items:center;padding:10px 36px 10px 12px;font-size:14px}
/* What's left before Finalize (#769): the next-up bar and the To do tab. */
.todo-bar{position:sticky;top:0;z-index:6;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px 8px;display:grid;gap:8px}
.todo-bar.is-clear{display:flex;gap:8px;align-items:baseline;color:var(--success)}
.todo-bar.is-clear span{color:var(--muted)}
.todo-bar-row{display:flex;align-items:center;gap:14px;min-width:0}
.todo-bar-count{display:flex;flex-direction:column;align-items:center;min-width:48px;border:0;background:none;padding:0;cursor:pointer;color:var(--text);font:inherit}
.todo-bar-count strong{font-size:24px;line-height:1}
.todo-bar-count span{font-size:11px;color:var(--muted)}
.todo-bar-count:hover strong{color:var(--brand)}
.todo-bar-current{flex:1;display:flex;align-items:center;gap:10px;min-width:0}
.todo-bar-current>div{display:flex;flex-direction:column;min-width:0}
.todo-bar-current small{font-size:12px;color:var(--muted)}
.todo-bar-current strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.todo-bar-current em{font-style:normal;font-size:12px;color:var(--muted)}
.todo-bar-actions{display:flex;gap:6px;flex:none}
.todo-bar-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.todo-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:2px 10px;font:inherit;font-size:12px;color:var(--text);cursor:pointer}
.todo-chip b{font-weight:700}
.todo-chip.is-on{background:var(--brand-soft);border-color:var(--brand)}
.todo-hint{margin-left:auto;font-size:12px;color:var(--muted)}
.todo-hint kbd,.todo-panel kbd{font:inherit;font-size:11px;border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 4px;background:var(--surface-2)}
.todo-kind{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;background:var(--muted)}
.todo-kind-marker{background:var(--warning)}
.todo-kind-glossary{background:var(--accent)}
.todo-kind-word{background:var(--brand)}
.todo-kind-comment{background:var(--accent-strong)}
.todo-kind-caption{background:var(--text-muted)}
.todo-kind-gate,.todo-kind-upload{background:var(--danger)}
.todo-bar-current .todo-kind{width:12px;height:12px}
.todo-summary{display:flex;flex-wrap:wrap;gap:16px;list-style:none;margin:0;padding:0 16px 10px;font-size:13px}
.todo-summary li{display:flex;align-items:center;gap:6px}
.todo-table td{vertical-align:top}
.todo-table td small{display:block;color:var(--muted)}
.todo-table tr.is-current td{background:var(--brand-soft)}
.todo-n{color:var(--muted);width:2.5em}
.todo-kind-cell{white-space:nowrap}
.todo-kind-cell .todo-kind{margin-right:6px}
.todo-clear{margin:0;color:var(--success)}
.is-todo-flash{animation:todo-flash 1.2s ease-out}
@keyframes todo-flash{from{box-shadow:0 0 0 3px var(--warning)}to{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.is-todo-flash{animation:none;outline:2px solid var(--warning)}}
@media (max-width:720px){.todo-bar-row{flex-wrap:wrap}.todo-bar-actions{width:100%;justify-content:flex-end}.todo-hint{display:none}}

/* Edited on this page (undo an inline edit). */
.text-edit-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.text-edit-list li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 0;border-top:1px solid var(--border)}
.text-edit-list li:first-child{border-top:0;padding-top:0}
.text-edit-list li>div:first-child{display:grid;gap:4px;min-width:0}
.text-edit-list small{color:var(--muted);font-size:12px}

/* Find and replace across the draft. */
.find-panel .panel-header{align-items:flex-start}
.find-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 14px;align-items:end}
.find-form>label{display:grid;gap:4px;font-size:13px;font-weight:600}
.find-form input[type="text"]{width:100%}
.find-options{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;grid-column:1/-1}
.find-options label{display:inline-flex;align-items:center;gap:6px}
.find-form .action-row,.find-form .form-hint{grid-column:1/-1}
.find-results{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;max-height:360px;overflow:auto}
.find-results li{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.find-results li.is-locked{background:var(--surface-2);color:var(--muted)}
.find-results label{display:flex;gap:8px;align-items:flex-start;min-width:0}
.find-results label>span{display:grid;gap:2px;min-width:0}
.find-results b{font-size:12px;color:var(--muted)}
.find-excerpt{font-size:13px;overflow-wrap:anywhere}
.find-excerpt mark{background:var(--warning-soft);color:inherit;padding:0 1px;border-radius:2px}
.draft-check-places{max-height:none}
.draft-check-places li{border-top:1px solid var(--border);padding:8px 10px;align-items:center}
.draft-check-places li:first-child{border-top:1px solid var(--border);padding-top:8px}
.draft-check-places li>span:first-child{display:grid;gap:2px;min-width:0;flex:1}
.draft-check-places li>.action-row{flex:none}
.draft-check>.action-row{flex:none;white-space:nowrap}
.draft-check>div:first-child{flex:1}
.is-set-aside .draft-check{opacity:.75}

/* Changes since upload (#771). */
.upload-changes-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);font-size:13px}
.upload-changes-bar.is-none{color:var(--muted)}
.upload-changes-bar>div{display:grid;gap:6px;min-width:0}
.upload-changes-bar details summary{cursor:pointer;color:var(--muted)}
.upload-changes-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.upload-changes-list li{display:grid;gap:2px}
.terms-again-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.terms-again-list li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
.upload-changes-list b{font-size:12px;color:var(--muted)}
[data-changed-since-upload]{background:var(--warning-soft);border-radius:3px;box-shadow:0 0 0 2px var(--warning-soft)}
[data-changed-since-issued]{background:var(--success-soft);border-radius:3px;box-shadow:0 0 0 2px var(--success-soft)}

.panel-subhead{margin:14px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
/* The ROUTES dropdown: a <details> holding grouped checkboxes (a multi-select). */
.bul-routes-field{display:grid;gap:4px}
.bul-field-label{font-weight:600;font-size:12px}
.bul-routes{position:relative;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.bul-routes>summary{list-style:none;cursor:pointer;padding:8px 32px 8px 10px;min-height:20px;position:relative}
.bul-routes>summary::-webkit-details-marker{display:none}
.bul-routes>summary::after{content:'';position:absolute;right:12px;top:50%;width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:translateY(-70%) rotate(45deg)}
.bul-routes[open]>summary::after{transform:translateY(-30%) rotate(-135deg)}
.bul-routes>summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.bul-routes-panel{border-top:1px solid var(--border);max-height:320px;overflow:auto;padding:8px 10px;display:grid;gap:10px}
.bul-routes-panel fieldset{border:0;margin:0;padding:0;display:grid;gap:2px}
.bul-routes-panel legend{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.bul-routes-locked{margin:0;padding:8px 0}
/* Governed documents a bulletin announces: a registry picker (suggested from the
   bulletin's own words, then recently issued, or search), the pinned document's
   card, related documents and the overlap check. */
.bul-pick{display:grid;gap:10px}
.bul-pick-search{width:100%;box-sizing:border-box;min-height:40px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);font:inherit}
.bul-pick-group h4,.bul-related h4{margin:0 0 6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.bul-pick-group ul,.bul-chips{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bul-pick-group p{margin:0}
.bul-pick-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.bul-pick-row>div{min-width:0}
.bul-pick-row small,.bul-announce-head small{display:block;color:var(--muted);margin-top:2px}
.bul-pick-row button{flex:none}
.bul-announce-card{display:grid;gap:6px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--surface-2)}
.bul-announce-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.bul-announce-card p{margin:0}
.bul-announce-change{font-size:13px}
.bul-announce-warn{margin:10px 0 0;padding-left:28px}
.bul-related{margin-top:12px;display:grid;gap:6px}
.bul-related p{margin:0}
.bul-chips li{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.bul-chip-x{margin-left:auto;border:0;background:none;font-size:16px;line-height:1;cursor:pointer;color:var(--muted);padding:2px 6px}
.bul-overlap{margin-top:12px}
.bul-overlap ul{margin:6px 0;padding-left:18px;display:grid;gap:6px}
@media (max-width:600px){.bul-pick-row,.bul-announce-head{flex-direction:column;align-items:stretch}}
/* The bulletin's send panel (ADR 0027 amendment): who it goes to, an optional
   note, and the one button that sends. */
.bul-email{display:grid;gap:10px;border:1px solid var(--border);border-radius:10px;padding:12px 14px;background:var(--surface-2)}
.bul-email h4{margin:0}
.bul-email fieldset{border:0;margin:0;padding:0;display:grid;gap:4px}
.bul-email legend{font-weight:600;font-size:12px;margin-bottom:4px}
.bul-email label>span{font-weight:600;font-size:12px}
.bul-email label{display:grid;gap:4px}
.bul-email label.check-field{display:flex}
.bul-email label.check-field>span{font-weight:400;font-size:13px}
.bul-email textarea,.bul-email input[type=text],.bul-email input:not([type]){width:100%}

/* ── Reader in code mode (ADR 0029): no nav, no sign-in, no staff routes ── */
body.reader-mode #primary-nav, body.reader-mode .topbar-actions, body.reader-mode #profile-button, body.reader-mode #ai-activity { display: none !important; }
body.reader-mode .app-shell { grid-template-columns: 1fr; }
.read-landing .read-group { margin: 0 0 1.25rem; }
.read-landing .read-group h4 { margin: 0 0 .5rem; }
.read-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.read-list a { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: baseline; padding: .55rem .75rem; border: 1px solid var(--border, #d9dde3); border-radius: 8px; text-decoration: none; color: inherit; }
.read-list a:hover, .read-list a:focus-visible { border-color: var(--teal, #0f7c8c); }
.read-list code { font-weight: 600; }
/* Document Lifecycle: the dashboard panel and the Lifecycle Report
   (features/lifecycle.js, lifecycle/report-view.js). Every colour is a token, so
   dark mode follows tokens.css. Each state's tone is carried by a token pair:
   in force = success, overdue = danger, due soon / waiting = warning, review = teal. */
.lc-dashboard{margin-bottom:18px}
.lc-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.lc-metric{display:grid;gap:4px;text-align:left;font:inherit;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;cursor:pointer}
.lc-metric:hover,.lc-metric:focus-visible{border-color:var(--mvta-green)}
.lc-metric-label{font-size:11px;color:var(--muted);font-weight:650}
.lc-metric-value{font-size:24px;font-weight:750;font-variant-numeric:tabular-nums}
.lc-metric-note{font-size:11px;color:var(--muted)}
.lc-metric.danger{border-color:color-mix(in srgb,var(--danger) 40%,transparent);background:var(--danger-soft)}
.lc-metric.danger .lc-metric-value{color:var(--danger)}
.lc-metric.warning{border-color:color-mix(in srgb,var(--warning) 40%,transparent);background:var(--warning-soft)}
.lc-metric.warning .lc-metric-value{color:var(--warning)}
.lc-dash-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-bottom:6px}
.lc-subhead{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:16px 0 10px}
.lc-dash-grid .lc-subhead{margin-top:0}
.lc-bar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:var(--surface-3);gap:2px}
.lc-bar.slim{height:10px}
.lc-seg{min-width:4px}
.lc-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px}
.lc-legend-item{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;color:var(--text);background:none;border:0;padding:2px 0}
.lc-legend-item strong{font-variant-numeric:tabular-nums}
.lc-legend-item.zero{color:var(--muted)}
.lc-legend-item.clickable{cursor:pointer}
.lc-legend-item.clickable:hover span:not(.lc-swatch){text-decoration:underline}
.lc-swatch{width:10px;height:10px;border-radius:3px;display:inline-block}
.lc-standing-in-force{background:var(--success)}
.lc-standing-not-issued{background:var(--mvta-orange)}
.lc-standing-superseded{background:color-mix(in srgb,var(--muted) 55%,transparent)}
.lc-standing-retired{background:color-mix(in srgb,var(--muted) 30%,transparent)}
.lc-standing-unknown,.lc-empty{background:var(--surface-3)}
.lc-work-registry-pending{background:var(--danger)}
.lc-work-in-review{background:var(--gov-teal)}
.lc-work-awaiting-finalize{background:var(--warning)}
.lc-work-drafting{background:color-mix(in srgb,var(--mvta-green) 38%,transparent)}
.lc-horizon{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:end}
.lc-col{display:grid;grid-template-rows:auto 92px auto;gap:6px;justify-items:center;font:inherit;color:var(--text);background:none;border:0;padding:0}
button.lc-col{cursor:pointer}
button.lc-col:hover .lc-col-label{text-decoration:underline}
.lc-col-value{font-size:13px;font-weight:750;font-variant-numeric:tabular-nums}
.lc-col-track{width:100%;max-width:36px;height:100%;display:flex;align-items:flex-end;background:var(--surface-2);border-radius:6px 6px 2px 2px;overflow:hidden}
.lc-col-fill{width:100%;background:var(--success);border-radius:6px 6px 0 0}
.lc-h-overdue .lc-col-fill{background:var(--danger)}
.lc-h-30 .lc-col-fill,.lc-h-60 .lc-col-fill{background:var(--warning)}
.lc-h-none .lc-col-fill{background:color-mix(in srgb,var(--muted) 45%,transparent)}
.lc-col-label{font-size:10.5px;color:var(--muted);text-align:center;line-height:1.25}
.lc-type-rows{display:grid;gap:10px}
.lc-type-row{display:grid;grid-template-columns:52px minmax(0,1fr) 120px;gap:12px;align-items:center;font-size:12px}
.lc-type-name{font-weight:800;color:var(--mvta-green);font-size:11px}
.lc-type-count{color:var(--muted);font-variant-numeric:tabular-nums}
.lc-type-count strong{color:var(--text)}
.lc-pill{display:inline-flex;border-radius:999px;padding:3px 9px;font-size:10.5px;font-weight:700;white-space:nowrap;background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1px var(--border)}
.lc-standing-in-force.lc-pill,.lc-pill.lc-standing-in-force,.lc-pill.lc-review-scheduled{background:var(--success-soft);color:var(--success);box-shadow:none}
.lc-pill.lc-standing-not-issued{background:color-mix(in srgb,var(--mvta-orange) 15%,transparent);color:var(--mvta-orange-ink);box-shadow:none}
.lc-pill.lc-review-overdue,.lc-pill.lc-work-registry-pending{background:var(--danger-soft);color:var(--danger);box-shadow:none}
.lc-pill.lc-review-due-soon,.lc-pill.lc-work-awaiting-finalize{background:var(--warning-soft);color:var(--warning);box-shadow:none}
.lc-pill.lc-work-in-review{background:var(--gov-teal-field);color:var(--gov-teal);box-shadow:none}
.lc-pill.lc-work-drafting{background:var(--mvta-green-soft);color:var(--mvta-green);box-shadow:none}
.lc-pill.lc-review-na,.lc-pill.lc-work-none{background:transparent;box-shadow:none;font-weight:600}
.lc-table tr.clickable{cursor:pointer}
.lc-table tr.clickable:hover td,.lc-table tr.clickable:focus-visible td{background:var(--surface-2)}
.lc-table tr.clickable:focus-visible{outline:2px solid var(--mvta-green);outline-offset:-2px}
.lc-table td{vertical-align:middle}
.lc-table.compact td{padding:10px 12px}
.lc-flags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.lc-flag{font-size:10px;font-weight:700;color:var(--muted);border:1px solid var(--border);border-radius:5px;padding:1px 6px}
.lc-flag-overdue,.lc-flag-registry-pending{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 35%,transparent)}
.lc-flag-due-soon{color:var(--warning);border-color:color-mix(in srgb,var(--warning) 35%,transparent)}
.lc-more{margin:12px 0 0;padding:0}
.lc-incomplete{background:var(--warning-soft);color:var(--text);border:1px solid color-mix(in srgb,var(--warning) 35%,transparent);border-radius:10px;padding:10px 14px;font-size:12.5px;margin-bottom:14px}
.lc-report-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-bottom:18px}
.lc-report-table .filter-row{padding:14px 16px}
.lc-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 14px}
.lc-chip{font:inherit;font-size:12px;font-weight:650;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:6px 12px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.lc-chip:hover{border-color:var(--mvta-green)}
.lc-chip.active{background:var(--mvta-green);border-color:var(--mvta-green);color:var(--accent-text,#fff)}
.lc-chip-count{font-variant-numeric:tabular-nums;opacity:.75}
.lc-chip-note{padding:0 16px}
.lc-stat-danger .stat-value{color:var(--danger)}
.lc-stat-warning .stat-value{color:var(--warning)}
@media(max-width:1000px){.lc-metrics{grid-template-columns:repeat(2,1fr)}.lc-dash-grid,.lc-report-grid{grid-template-columns:1fr}}
@media(max-width:560px){.lc-metrics{grid-template-columns:1fr}.lc-horizon{gap:4px}.lc-col-label{font-size:9.5px}.lc-type-row{grid-template-columns:44px minmax(0,1fr)}.lc-type-count{grid-column:2}}
/* ── Derivative Citations (services/derivative-citations.js) ─────────────
   The document's own runbook or QRG, offered as a reference from the registry
   rather than judged by the model: an accent edge says so where a confidence
   figure would have been, in Create a Document's recommendation card and on
   Finish the Draft's Checks tab. */
.recommendation-row.is-derivative{border-left:3px solid var(--accent)}
.derivative-offers{display:grid;gap:10px}
.derivative-offer{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:10px;padding:10px 12px;background:var(--surface-2)}
.derivative-offer strong{display:block;font-size:13.5px}
.derivative-offer small{display:block;margin-top:2px;font-size:12px}

/* ── Sidebar: compact density, and a fold to a 72px icon rail ─────────────────
   Fourteen destinations outgrew a 100vh column at the old 42px rows: on an
   ordinary laptop window the status line and the version badge were pushed off
   the bottom (v6.17.15 made the nav scroll). These rows are 32px with hairline
   section labels, so every destination is in view at 720px with nothing to
   scroll; the nav still scrolls, and the foot stays pinned, when a window is
   shorter than that. The collapse control folds the column to the icon rail
   the 760px media query below already draws, remembered per browser. Folded,
   the label is a native title (the nav clips horizontally because it scrolls
   vertically, so a drawn tooltip beside the rail would be cut off). */
.sidebar{padding:16px 12px 14px}
.brand{padding:2px 6px 14px 10px;gap:10px;justify-content:space-between}
.brand-mark{display:flex;align-items:center;gap:10px;min-width:0}
.brand img{width:64px;height:auto}
.brand span{font-size:14px;white-space:nowrap}
.nav-collapse{flex-shrink:0;width:28px;height:28px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(255,255,255,.06);color:rgba(255,255,255,.78);display:grid;place-items:center;padding:0;cursor:pointer;transition:background .12s ease,color .12s ease}
.nav-collapse:hover{background:rgba(255,255,255,.14);color:#fff}
.nav-collapse:focus-visible,.nav-button:focus-visible,.version-badge:focus-visible{outline:2px solid #7ee2aa;outline-offset:-2px}
.nav-collapse svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s ease}
.nav-section-label{display:flex;align-items:center;gap:8px;margin:8px 8px 4px 10px;font-size:9.5px;color:rgba(255,255,255,.42);white-space:nowrap}
.nav-section-label::after{content:"";flex:1 1 auto;height:1px;background:rgba(255,255,255,.10)}
#primary-nav .nav-section-label:first-child{margin-top:0}
.nav-group{gap:2px}
.nav-button{gap:10px;padding:7px 10px;border-radius:8px;font-size:12.5px;font-weight:600;line-height:18px;color:rgba(255,255,255,.8)}
.nav-icon{width:20px;display:grid;place-items:center}
.nav-icon svg{width:16px;height:16px}
.sidebar-foot{flex-shrink:0;margin-top:8px;padding:10px 10px 0;border-top:1px solid rgba(255,255,255,.10);display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.sidebar-footer{margin:0;padding:0;font-size:11.5px;min-width:0}
.sidebar-footer span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-dot{flex-shrink:0;width:7px;height:7px;box-shadow:0 0 0 3px rgba(126,226,170,.12)}
.version-badge{flex-shrink:0;margin:0;padding:4px 7px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;letter-spacing:.2px;border-radius:5px}
.app-shell.nav-collapsed{grid-template-columns:72px 1fr}
.nav-collapsed .sidebar{padding:16px 0 14px}
.nav-collapsed .brand{flex-direction:column;align-items:center;gap:10px;padding:0 0 10px}
.nav-collapsed .brand img{width:46px}
.nav-collapsed .brand span{display:none}
.nav-collapsed .nav-collapse svg{transform:rotate(180deg)}
.nav-collapsed #primary-nav{margin:0;padding:0}
.nav-collapsed .nav-section-label{height:1px;margin:8px 12px;padding:0;background:rgba(255,255,255,.12);overflow:hidden;font-size:0;color:transparent}
.nav-collapsed .nav-section-label::after{display:none}
.nav-collapsed .nav-group{justify-items:center}
.nav-collapsed .nav-button{width:34px;height:34px;padding:0;justify-content:center;border-radius:8px}
.nav-collapsed .nav-label{display:none}
.nav-collapsed .nav-icon svg{width:18px;height:18px}
.nav-collapsed .sidebar-foot{flex-direction:column;gap:8px;padding:10px 0 0;margin:8px 12px 0;justify-content:center}
.nav-collapsed .sidebar-footer span:last-child{display:none}
.nav-collapsed .version-badge{padding:3px 5px;font-size:9.5px;letter-spacing:0}
/* Issue pipeline row on the dashboard (features/dashboard/issue-pipeline.js):
   waiting to be issued, stale derivatives, Document Review. The queue's own
   .fq-pill is reused so a state reads the same here as in the queue. */
.ip-row-wrap{margin-bottom:18px}
/* The Dashboard's Issue pipeline and lifecycle slots: drawn as a loading panel, then
   filled when their reads land. display:contents lays the filled panel out as if it
   were drawn in place. */
.dash-slot{display:contents}
.dash-panel-loading{margin-bottom:18px}
.dash-panel-loading .panel-body{display:flex;align-items:center;gap:10px;color:var(--muted)}
.ip-title{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 10px}
.ip-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.ip-panel{display:flex;flex-direction:column;min-width:0}
.ip-panel .panel-body{display:flex;flex-direction:column;gap:12px;flex:1}
.ip-figure{display:flex;align-items:baseline;gap:10px}
.ip-value{font-size:30px;font-weight:750;font-variant-numeric:tabular-nums;line-height:1}
.ip-note{font-size:12px;color:var(--muted)}
.ip-states{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 12px}
.ip-states li{display:inline-flex;align-items:center;gap:6px;font-size:12px}
.ip-states li strong{font-variant-numeric:tabular-nums}
.ip-states li.zero{opacity:.55}
.ip-kinds{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.ip-kinds li{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted)}
.ip-kinds li strong{color:var(--text);font-variant-numeric:tabular-nums}
.ip-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ip-row{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);color:var(--text);font:inherit;text-align:left}
button.ip-row{cursor:pointer}
button.ip-row:hover,button.ip-row:focus-visible{border-color:var(--mvta-green)}
.ip-row-main{min-width:0;display:grid;gap:3px}
.ip-row-main strong{font-size:12.5px}
.ip-row-main small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ip-row .fq-pill{flex:none}
.ip-row .secondary.small{flex:none;white-space:nowrap}
.ip-age{flex:none;font-size:11px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.ip-age.returned{color:var(--warning)}
.ip-review-stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ip-review-stats li{display:grid;gap:2px;padding:8px 10px;border-radius:9px;background:var(--surface-2);font-size:11px;color:var(--muted)}
.ip-review-stats li strong{font-size:18px;color:var(--text);font-variant-numeric:tabular-nums}
.ip-review-stats li.warning{background:var(--warning-soft)}
.ip-review-stats li.warning strong{color:var(--warning)}
.ip-foot{font-size:11px;color:var(--muted);margin:auto 0 0}
.ip-more{align-self:flex-start;padding:0}
.ip-warning{margin:0;background:var(--warning-soft);border:1px solid color-mix(in srgb,var(--warning) 35%,transparent);border-radius:9px;padding:8px 11px;font-size:12px;color:var(--text)}
@media(max-width:1200px){.ip-grid{grid-template-columns:1fr 1fr}.ip-grid>.ip-panel:last-child{grid-column:1/-1}}
@media(max-width:760px){.ip-grid{grid-template-columns:1fr}.ip-grid>.ip-panel:last-child{grid-column:auto}}
.readback-credit{font-weight:600;color:var(--text,inherit)}
/* Finish the Draft: the Changes since Revision MM tab (revision differences, B5).
   The rows are the Reader's compare markup (.guide-diff); these are its additions. */
.revision-change-sections{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:2px}
.revision-change-sections li{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:3px 0;border-bottom:1px solid var(--border)}
#publish-revision-changes .guide-diff{margin-top:12px;max-height:60vh}
.checkbox-row{display:flex;align-items:flex-start;gap:8px;font-size:13px;margin:8px 0}
.checkbox-row input{margin-top:3px}

/* Who a review marker is waiting on (marker-assignments.js). */
.marker-assign{margin:6px 0;font-size:12px}
.marker-assign>summary{cursor:pointer;color:var(--mvta-green);font-weight:650}
.marker-assign>summary small{color:var(--muted);font-weight:400}
.marker-assign-form{display:grid;gap:6px;margin-top:6px;padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2)}
.marker-assign-form label{display:grid;gap:3px;font-size:11px;font-weight:700;color:var(--muted)}
.marker-assign-form select,.marker-assign-form input{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:7px;padding:6px 8px;font-size:12px}
.marker-assign-line{font-size:12px;color:var(--muted);margin:4px 0}
.inbox-assignee{flex:none;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);border:1px solid var(--border);max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.marker-waiting{margin:0 0 12px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2)}
.marker-waiting h4{margin:0 0 6px;font-size:12px}
.marker-waiting ul{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:4px}
.marker-waiting li{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}
.marker-waiting li small{color:var(--muted)}

/* AI review of one section (section-review.js). */
.section-review-item>.action-row{flex:none;white-space:nowrap}
.section-review-item.is-applied>div:first-child{opacity:.75}

/* #947 Periodic Review packet on the Lifecycle Report */
.lc-review-btn { margin-top: 4px; display: block; }
.lc-packet { margin-bottom: 16px; }
.lc-packet-items { margin: 8px 0 12px; padding-left: 20px; }
.lc-packet-items li { margin: 4px 0; }
.lc-packet-items li.lc-packet-warning::marker { color: var(--warning, #b45309); }
/* #951 further sources on Create a Document's Start step */
.extra-sources-block { margin-top: 10px; display: grid; gap: 6px; }
.extra-sources { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.extra-sources li { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.extra-source-add { cursor: pointer; justify-self: start; }
/* Review the plan: what to move when the main body is over target, and the
   one-line consequence note under Missing information. */
.estimate-relief{margin-top:6px;font-weight:400;color:var(--text)}
.estimate-relief p{margin:0 0 6px;font-size:12px;line-height:1.5}
.gaps-note{margin:0 0 10px}