/* Acquisitions pages — shared styles (the Onboarding checklist look, aq- prefixed). Kept as a
   plain stylesheet rather than per-component CSS isolation so the six pages share one vocabulary. */
.aq-page-head, .aq-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.aq-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.aq-check { display: inline-flex; align-items: center; gap: .4rem; margin: 0; white-space: nowrap; }
.aq-muted { font-size: .85em; opacity: .7; }
.aq-meta { font-size: .9em; opacity: .85; margin-top: .25rem; }
.aq-notice { padding: .75rem 1rem; border: 1px solid rgba(19, 152, 178, .5); border-radius: .4rem; background: rgba(19, 152, 178, .08); }
.aq-warnings { padding: .5rem 1rem .5rem 2rem; border: 1px solid rgba(200, 120, 0, .5); border-radius: .4rem; background: rgba(200, 120, 0, .08); font-size: .9em; }
.aq-badge { display: inline-block; padding: .1rem .5rem; border-radius: 1rem; font-size: .85em; border: 1px solid currentColor; white-space: nowrap; }
.aq-flag { display: inline-block; padding: 0 .4rem; margin: .1rem .2rem .1rem 0; border-radius: .3rem; font-size: .78em; background: rgba(200, 120, 0, .12); border: 1px solid rgba(200, 120, 0, .4); }
.aq-gone { opacity: .55; }
/* Attention items (§5.4): a human obligation, so it reads as one — red-edged, not the amber of a
   machine flag, and never dimmed while open. */
.aq-attention { padding: .75rem 1rem; border: 1px solid rgba(179, 38, 30, .55); border-radius: .4rem; background: rgba(179, 38, 30, .06); }
.aq-attention-item { padding: .5rem 0; border-top: 1px solid rgba(179, 38, 30, .2); }
.aq-attention-item:first-of-type { border-top: 0; }
.aq-attention-flag { background: rgba(179, 38, 30, .12); border-color: rgba(179, 38, 30, .45); }
/* The since-baseline summary: arrivals and departures are the headline, so they carry colour. */
.aq-change-arrived { color: #1f7a3a; }
.aq-change-departed { color: #b3261e; }
/* The lane board (§8.5): the two marks with a sync glyph, then one lane per system moving — a tile,
   an arrow filling toward a tile, and a message. Built to be read at a glance, including by people
   whose tools are changing under them. */
.aq-board-marks { display: flex; align-items: center; gap: 1rem; }
.aq-board-marks .aq-logo { max-height: 3rem; }
.aq-sync { font-size: 1.6rem; opacity: .6; }
/* Top-aligned, not centred: only one side usually carries a sign-in link and its state, and
   centring each side on its own content put the two marks and names at different heights. */
.aq-lane { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr minmax(9rem, 14rem); gap: .5rem 1rem; align-items: start; padding: .9rem 0; border-bottom: 1px solid rgba(128, 128, 128, .2); }
/* The message sits under the arrow it describes, not across the whole lane. The padding levels the
   arrow with the middle of the marks either side of it (mark 3rem, arrow 1.4rem). */
.aq-lane-middle { display: flex; flex-direction: column; gap: .35rem; padding-top: .6rem; }
.aq-lane-message { font-size: .95em; text-align: center; }
/* Every editor control carries its caption above it, so the row lines up on the inputs. */
.aq-lane-controls { align-items: flex-end; }
.aq-lane-controls label > .form-select { min-width: 9rem; }
.aq-lane-message-field { flex: 1 1 22rem; max-width: 34rem; }
/* A field that should take the room left in its row (the grant form's name and reason boxes). */
.aq-grow { flex: 1 1 18rem; }
.aq-grow .form-control { max-width: none; }
.aq-lane-controls .aq-lane-message-field .form-control { max-width: none; }
/* aq-lane-tile, not aq-tile: that is the home page's deal card, and sharing the name stacked it. */
.aq-lane-tile { display: flex; flex-direction: column; align-items: center; gap: .25rem; text-align: center; }
/* A fixed white chip, as the deal logos sit on: vendor marks are drawn for light backgrounds and a
   dark one vanishes on the dark theme; a fixed box also keeps wordmarks and symbols the same size. */
.aq-lane-tile-img { width: 5rem; height: 3rem; object-fit: contain; padding: .3rem .4rem; background: #fff;
                    border: 1px solid rgba(128, 128, 128, .3); border-radius: .5rem; }
.aq-lane-tile-mono { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: .6rem; font-weight: 700; background: rgba(128, 128, 128, .15); border: 1px solid rgba(128, 128, 128, .35); }
.aq-lane-tile-name { font-weight: 600; font-size: .9em; }
.aq-lane-tile-link { font-size: .85em; }
/* An actual arrow, not a bar: the track is clipped to a shaft with a head at the right, so the fill
   runs along the shaft and into the head as it approaches 100%. The clip takes the label with it,
   hence the shaft band being wide enough to hold the text. */
.aq-arrow { position: relative; height: 1.75rem; background: rgba(128, 128, 128, .15); overflow: hidden;
            clip-path: polygon(0 18%, calc(100% - .9rem) 18%, calc(100% - .9rem) 0, 100% 50%, calc(100% - .9rem) 100%, calc(100% - .9rem) 82%, 0 82%); }
.aq-arrow-fill { height: 100%; background: rgba(19, 152, 178, .55); transition: width .4s ease; }
.aq-lane-done .aq-arrow-fill { background: rgba(31, 122, 58, .6); }
.aq-lane-blocked .aq-arrow-fill { background: rgba(179, 38, 30, .5); }
.aq-arrow-label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: .8em; font-weight: 600; }
.aq-link-retired { opacity: .6; text-decoration: line-through; }
.aq-standalone { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.aq-standalone-entry { max-width: 14rem; }
.aq-lane-edit { border: 1px solid rgba(128, 128, 128, .3); border-radius: .4rem; padding: .5rem 1rem; margin-bottom: .75rem; }
.aq-lane-edit legend { font-size: 1em; font-weight: 600; width: auto; float: none; padding: 0 .25rem; }
.aq-side-edit { display: flex; flex-direction: column; gap: .35rem; }
.aq-scroll { overflow-x: auto; }
.aq-narrow { max-width: 5rem; }

.aq-phase-collecting { color: #3b6ea5; }
.aq-phase-locked { color: #6f42c1; }
.aq-phase-integrating { color: #1b7f3b; }
.aq-phase-completed { color: #1b7f3b; }
.aq-phase-cancelled { color: #8a8a8a; }
.aq-disp-undecided { color: #b26b00; }
.aq-disp-migrate { color: #1b7f3b; }
.aq-disp-existingcustomer { color: #3b6ea5; }
.aq-disp-exclude { color: #8a8a8a; }
.aq-disp-merge { color: #8a8a8a; }
.aq-map-confirmed { color: #1b7f3b; }
.aq-map-auto { color: #3b6ea5; }
.aq-map-suggested { color: #b26b00; }
.aq-map-unmatched { color: #b3261e; }
.aq-map-rejected, .aq-map-ignored { color: #8a8a8a; }

.aq-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .75rem; margin: 1rem 0 1.5rem; }
.aq-counts > div { padding: .6rem .8rem; border: 1px solid rgba(128,128,128,.3); border-radius: .5rem; display: flex; flex-direction: column; }
.aq-num { font-size: 1.6rem; font-weight: 600; line-height: 1.1; }

.aq-confirm { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; padding: .75rem 1rem; margin-bottom: 1rem; border: 1px solid rgba(179, 38, 30, .5); border-radius: .4rem; background: rgba(179, 38, 30, .06); }
.aq-form { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin: .5rem 0 1rem; }
.aq-form .form-control, .aq-form .form-select { max-width: 22rem; }
/* Reason fields carry their instruction as the placeholder, so give the sentence room. */
.aq-form .form-control.aq-reason, .aq-confirm .form-control.aq-reason { max-width: 34rem; min-width: 22rem; flex: 1 1 22rem; }
.aq-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: .75rem 1.25rem; margin-bottom: 1rem; }
.aq-form-grid label { display: flex; flex-direction: column; gap: .25rem; font-weight: 600; }
.aq-form-grid label .aq-muted { font-weight: 400; }
/* A checkbox label in a form grid carries its explanation: let it wrap inside its column instead of
   pushing the page sideways (the edit page's auto-exclude box did). */
.aq-form-grid label.aq-check { white-space: normal; }
.aq-sources td.aq-list-source { text-align: center; }
.aq-list-badge { margin-left: .35rem; }
.aq-step-picks { list-style: none; padding: 0; margin: 0 0 .75rem; display: grid; gap: .35rem; }
.aq-step-picks li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; }
.aq-filters { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .75rem; }
.aq-filters .form-control, .aq-filters .form-select { max-width: 18rem; }
.aq-file-btn { position: relative; overflow: hidden; }
.aq-file-btn input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

.aq-panel { padding: 1rem; border: 1px solid rgba(128,128,128,.3); border-radius: .5rem; margin-bottom: 1.5rem; }
.aq-layout { display: grid; grid-template-columns: minmax(20rem, 1fr) minmax(20rem, 1fr); gap: 1.5rem; align-items: start; }
@media (max-width: 1000px) { .aq-layout { grid-template-columns: 1fr; } }
.aq-mapper { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 1000px) { .aq-mapper { grid-template-columns: 1fr; } }
.aq-mapper label { display: flex; flex-direction: column; gap: .2rem; margin-bottom: .5rem; font-size: .9em; }
.aq-field { font-family: ui-monospace, monospace; font-size: .85em; white-space: nowrap; }
.aq-kv { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; margin: .5rem 0 1rem; }
.aq-kv dt { font-weight: 600; }
.aq-kv dd { margin: 0; overflow-wrap: anywhere; }
.aq-notes { padding-left: 1.2rem; }
.aq-events { margin-top: 1.5rem; }
.aq-decide td { background: rgba(128,128,128,.06); }

.aq-matrix td.aq-cell { text-align: center; }
.aq-matrix td.aq-zero { opacity: .35; text-align: center; }
.aq-matrix td.aq-st-done, .aq-matrix td.aq-st-manual { color: #1b7f3b; font-weight: 600; }
.aq-matrix td.aq-st-failed { color: #b3261e; font-weight: 600; }
.aq-matrix td.aq-st-blocked { color: #8a8a8a; }
.aq-matrix td.aq-st-ready { color: #3b6ea5; font-weight: 600; }

.aq-checklist { display: flex; flex-direction: column; gap: .25rem; }
.aq-step { display: flex; gap: .6rem; align-items: flex-start; text-align: left; width: 100%;
           padding: .5rem .6rem; border: 1px solid transparent; border-radius: .4rem; background: transparent; color: inherit; cursor: pointer; }
.aq-step:hover { border-color: rgba(128,128,128,.4); }
.aq-step.selected { border-color: currentColor; background: rgba(128,128,128,.08); }
.aq-icon { font-size: 1.15rem; line-height: 1.2; flex: 0 0 auto; }
.aq-step-body { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.aq-step-name { font-weight: 600; }
.aq-step-desc { font-size: .85em; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aq-st-done .aq-icon, .aq-st-manual .aq-icon { color: #1b7f3b; }
.aq-st-ready .aq-icon { color: #3b6ea5; }
.aq-st-blocked .aq-icon, .aq-st-notapplicable .aq-icon, .aq-st-skipped .aq-icon { color: #8a8a8a; }
.aq-st-notapplicable .aq-step-body, .aq-st-blocked .aq-step-body { opacity: .6; }
.aq-st-failed .aq-icon { color: #b3261e; }
.aq-st-unknown .aq-icon { color: #b26b00; }
.aq-st-inprogress .aq-icon { color: #6f42c1; }
.aq-step-panel { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(128,128,128,.3); }

/* ── Logos and the portfolio tiles (2026-09-10) ── */
.aq-head-brand { display: flex; align-items: flex-start; gap: 1rem; min-width: 0; }
.aq-logo-slot { position: relative; flex: none; width: 4.5rem; height: 4.5rem; cursor: pointer; }
.aq-logo-slot input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.aq-logo { display: flex; align-items: center; justify-content: center; width: 4.5rem; height: 4.5rem; border-radius: .6rem;
           background: #fff; border: 1px solid rgba(128,128,128,.3); object-fit: contain; padding: .3rem; }
.aq-logo-empty { font-weight: 700; letter-spacing: .04em; color: var(--cn-muted-foreground, #5b7183); background: rgba(128,128,128,.08); }
.aq-logo-slot:hover .aq-logo { border-color: var(--cn-clickable, #1398b2); }
.aq-inline-btn { padding: 0; vertical-align: baseline; font-size: inherit; }
/* The transfers page (2026-10-30): a stage per company, coloured like the step states. */
.aq-stage-complete { color: #1b7f3b; }
.aq-stage-ready { color: #3b6ea5; font-weight: 600; }
.aq-stage-progress { color: #6f42c1; }
.aq-stage-problem { color: #b3261e; font-weight: 600; }
.aq-stage-idle { color: #8a8a8a; }
.aq-plain { list-style: none; padding-left: 0; margin: 0; }
.aq-pick { max-width: 22rem; }
.aq-other-kind { margin-top: .25rem; }
.aq-inline-form { display: inline-flex; flex-wrap: wrap; gap: .25rem; align-items: center; }
.aq-inline-form input { width: 14rem; max-width: 100%; }
.aq-azure summary { cursor: pointer; white-space: nowrap; }
.aq-azure[open] { min-width: 22rem; }
.aq-azure li + li { margin-top: .4rem; }
.aq-routing td { vertical-align: top; }
.aq-routing tr.aq-routing-azure td { border-top: none; padding-top: 0; }
.aq-routing-azure-fields { display: flex; flex-wrap: wrap; gap: .25rem 1rem; align-items: baseline; }
.aq-routing-azure-fields label { display: inline-flex; flex-wrap: wrap; gap: .25rem .5rem; align-items: baseline; margin: 0; }
.aq-routing-azure-fields input { width: 21rem; max-width: 100%; }

.aq-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); gap: 1rem; margin-top: .5rem; }
.aq-tile { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem; border: 1px solid rgba(128,128,128,.3); border-radius: .75rem;
           background: var(--cn-card-background, #fff); color: inherit; text-decoration: none; transition: border-color .12s ease-out, box-shadow .12s ease-out; }
.aq-tile:hover { border-color: var(--cn-clickable, #1398b2); box-shadow: 0 4px 16px rgba(0,0,0,.08); color: inherit; text-decoration: none; }
.aq-tile-logo { flex: none; width: 5rem; height: 5rem; display: flex; align-items: center; justify-content: center; border-radius: .6rem;
                background: #fff; border: 1px solid rgba(128,128,128,.2); overflow: hidden; }
.aq-tile-logo img { max-width: 100%; max-height: 100%; object-fit: contain; padding: .35rem; }
.aq-tile-code { font-size: 1.1rem; font-weight: 700; letter-spacing: .05em; color: var(--cn-muted-foreground, #5b7183); }
.aq-tile-body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: .35rem; }
.aq-tile-name { font-size: 1.15rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aq-tile-meta { font-size: .9em; }
.aq-tile-stats { display: flex; flex-wrap: wrap; gap: .35rem 1rem; font-size: .85em; opacity: .85; }
.aq-tile-progress { height: .35rem; border-radius: .2rem; background: rgba(128,128,128,.15); overflow: hidden; margin-top: .25rem; }
.aq-tile-bar { height: 100%; background: var(--cn-clickable, #1398b2); }

/* A proposal cell: badge, target, reason, action — spaced as phrases, wrapping as a unit. */
.aq-proposal { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .4rem; }
/* The dashboard's logo is display only; it links to the Edit page, where the logo is managed. */
.aq-logo-static { display: block; text-decoration: none; }

/* The external /welcome page (§8.5): rendered outside the app shell, so it carries its own frame —
   the sign-in splash's card, on the brand background. */
.aq-welcome { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem; background: var(--cn-background, #f5f7f9); }
.aq-welcome-card { max-width: 32rem; text-align: center; background: var(--cn-card-background, #fff); border: 1px solid var(--cn-border, rgba(128,128,128,.3));
                   border-radius: .75rem; padding: 3rem 2.5rem; box-shadow: 0 4px 24px rgba(33, 51, 67, .08); }
.aq-welcome-logo { width: 4rem; height: auto; margin-bottom: 1.5rem; }
.aq-welcome-card h1 { font-size: 1.35rem; margin-bottom: .75rem; }
.aq-welcome-list { list-style: none; padding: 0; margin: 0 0 1rem; font-size: 1.05rem; }
/* The page itself: the same lanes the board draws, on a plain page of its own. */
.aq-welcome-page { max-width: 60rem; margin: 0 auto; padding: 2rem 1.5rem 3rem; }
.aq-welcome-title { font-size: 1.75rem; text-align: center; margin: .5rem 0 1.5rem; }
.aq-welcome-marks { justify-content: center; margin-bottom: 2rem; }
/* The staff-written card: their words come before any progress bar, so it reads as a note from a
   person rather than a banner. Plain text, so line breaks are all the formatting there is. */
.aq-welcome-notice { border: 1px solid rgba(128, 128, 128, .3); border-left: 3px solid var(--cn-clickable, #1398b2);
                     border-radius: .5rem; padding: 1rem 1.25rem; margin-bottom: 2rem; background: var(--cn-card-background, #fff); }
.aq-welcome-notice h2 { font-size: 1.05rem; margin: 0 0 .5rem; }
.aq-welcome-notice-body { margin: 0; white-space: pre-wrap; }
/* The page's OWN headings only ("Staying as they are"): a descendant selector here also caught the
   note card's heading and, being declared later at equal specificity, put 2rem of air above it. */
.aq-welcome-page > h2 { font-size: 1.15rem; margin: 2rem 0 .5rem; }
.aq-welcome-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem;
                     padding-top: 1rem; border-top: 1px solid rgba(128, 128, 128, .2); }