/* Cost allocation: one list of everyone with billing unit buttons, an overview by billing unit,
   a sticky save bar and an Employee files drawer. Tokens come from styles.css. */

/* Header actions */
.allocation-header-actions { display:flex; align-items:center; gap:12px; flex-wrap:nowrap; }
.allocation-header-actions[hidden] { display:none; }
.allocation-files-button, .billing-setup-button { white-space:nowrap; }
.allocation-files-button[hidden], .billing-setup-button[hidden] { display:none; }
.allocation-files-button svg, .billing-setup-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#allocation-period-select { width:auto; min-width:180px; }

/* Page */
#allocation-section { min-width:0; }
.allocation-body { display:grid; gap:20px; min-width:0; }
.allocation-body [hidden] { display:none !important; }
.allocation-output { display:grid; gap:20px; min-width:0; }
.allocation-output:empty { display:none; }
.allocation-status { margin:0; font-size:14px; line-height:20px; }
.allocation-status:empty { display:none; }
.allocation-readonly { margin:0; font-size:15px; line-height:22px; }
.allocation-draft-notice:empty, .allocation-manager-feedback:empty { display:none; }
.allocation-draft-notice, .allocation-manager-feedback { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.allocation-draft-notice > p, .allocation-manager-feedback > p { flex:1 1 100%; margin:0; }
/* Entra banner (0.4.194): the people without a manager or department, each with Ignore; ignored people below with Undo. */
.allocation-entra-banner { align-items:center; flex-wrap:wrap; justify-content:space-between; gap:8px 16px; }
.allocation-entra-banner > p { flex:1 1 220px; margin:0; }
.allocation-entra-people { flex:1 1 100%; display:grid; margin:0; padding:0; list-style:none; }
.allocation-entra-people > li { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:8px 16px; padding:8px 0; border-top:1px solid var(--border); }
.allocation-entra-person { display:grid; flex:1 1 220px; gap:2px; min-width:0; overflow-wrap:anywhere; }
.allocation-entra-person small { font-size:13px; line-height:18px; }
.allocation-entra-ignored { flex:1 1 100%; }
.allocation-entra-ignored > summary { min-height:44px; }
/* Entra review: changed people only, unchanged behind a toggle; short headers never wrap letter by letter. */
.allocation-entra-review { flex:1 1 100%; min-width:0; }
.allocation-entra-review > summary { display:flex; align-items:center; min-height:44px; color:var(--strong); font-weight:600; cursor:pointer; }
.allocation-entra-review > .secondary-button { margin:4px 0 8px; }
.allocation-entra-apply-row { flex:1 1 100%; display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.allocation-entra-apply-row:empty { display:none; }
.allocation-entra-apply-row > p { flex:1 1 260px; margin:0; }
.allocation-entra-review table { min-width:480px; }
.allocation-entra-review th { white-space:nowrap; }
/* The Entra row and its feedback keep to the column; a wide review table scrolls inside its own shell. */
.billing-setup-entra { grid-template-columns:minmax(0, 1fr); }
.billing-setup-feedback { min-width:0; }

.allocation-status-strip { display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; padding:14px 20px; border:1px solid var(--border); border-radius:8px; color:var(--text); background:var(--surface); font-size:14px; line-height:20px; }
.allocation-strip-published strong { color:var(--strong); font-weight:600; }
.allocation-strip-divider { width:1px; height:20px; background:var(--border); }
.allocation-strip-spacer { flex:1 1 0; }
.allocation-status-strip .secondary-button { min-height:36px; padding:0 12px; font-size:14px; }

/* Cards */
.allocation-card { min-width:0; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.allocation-card-header { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding:16px 20px; }
.allocation-card-title { min-width:0; }
.allocation-card-title h2 { margin:0; color:var(--strong); font-size:17px; line-height:24px; font-weight:600; }
.allocation-card-title p { max-width:76ch; margin:4px 0 0; font-size:14px; line-height:20px; }
.allocation-overview-toggle { min-height:36px; padding:0 4px; font-size:14px; }
.allocation-overview-toggle::after { content:""; width:8px; height:8px; margin:-4px 2px 0 4px; border:solid currentColor; border-width:0 2px 2px 0; transform:rotate(45deg); }
.allocation-overview-toggle[aria-expanded="true"]::after { margin-top:4px; transform:rotate(-135deg); }

/* 0.4.161: every key figure in one row at desktop (four or five equal cards); the row wraps at narrow widths and
   the cards of a wrapped row stretch, so no empty filler area is left. Dividers are drawn by each card. */
.allocation-totals { display:flex; flex-wrap:wrap; margin:0; border-top:1px solid var(--border); }
.allocation-total { flex:1 1 170px; min-width:0; padding:12px 20px; background:var(--surface); box-shadow:-1px 0 0 var(--border), 0 -1px 0 var(--border); }
.allocation-total:first-child { border-bottom-left-radius:8px; }
.allocation-total:last-child { border-bottom-right-radius:8px; }
.allocation-overview:has(.allocation-matrix-shell:not([hidden])) .allocation-total { border-radius:0; }
.allocation-total dt { color:var(--text); font-size:13px; line-height:18px; }
.allocation-total dd { display:grid; margin:2px 0 0; }
.allocation-total strong { color:var(--strong); font-size:17px; line-height:24px; font-weight:600; font-variant-numeric:tabular-nums; }
.allocation-total dd span { font-size:13px; line-height:18px; font-variant-numeric:tabular-nums; }
.allocation-total.is-warning strong { color:var(--warn-fg); }
.allocation-total-note { margin-top:2px; }

.allocation-matrix-shell { overflow-x:auto; border-top:1px solid var(--border); }
.allocation-matrix { width:100%; min-width:560px; border-collapse:collapse; }
.allocation-matrix th, .allocation-matrix td { height:44px; padding:0 12px; border-bottom:1px solid var(--border); color:var(--strong); font-size:15px; text-align:left; white-space:nowrap; }
.allocation-matrix tbody th, .allocation-matrix tfoot > tr > * { background:var(--surface); }
.allocation-matrix thead th { height:40px; color:var(--text); background:var(--bg); font-size:14px; font-weight:600; }
.allocation-matrix th:first-child, .allocation-matrix td:first-child { padding-left:20px; }
.allocation-matrix th:last-child, .allocation-matrix td:last-child { padding-right:20px; }
.allocation-matrix .is-numeric { text-align:right; font-variant-numeric:tabular-nums; }
.allocation-matrix td.muted { color:var(--text); }
.allocation-matrix-cost { background:color-mix(in srgb, var(--chart-cowork) calc(var(--share, 0) * 32%), transparent); }
.allocation-matrix tr.is-unallocated > * { background:var(--bg); }
.allocation-matrix tr.is-selected > :not(.allocation-matrix-cost) { background:var(--tint); }
.allocation-matrix tr.is-selected > th { box-shadow:inset 4px 0 0 var(--accent); }
.allocation-matrix tfoot th, .allocation-matrix tfoot td { border-bottom:0; font-weight:600; }
.allocation-matrix-unit { display:flex; align-items:center; gap:10px; width:100%; min-width:0; min-height:44px; padding:0; border:0; color:var(--strong); background:transparent; text-align:left; cursor:pointer; }
.allocation-matrix-unit strong { font-size:15px; font-weight:600; }
.allocation-matrix-unit span { overflow:hidden; font-size:13px; text-overflow:ellipsis; }
.allocation-matrix-unit:hover strong { color:var(--accent-text); text-decoration:underline; }

/* People list */
.allocation-people { container-type:inline-size; }
.allocation-people-header { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:8px 24px 0; border-bottom:1px solid var(--border); }
/* 4 px of padding around the scrolling strip keeps the shared 2 px focus ring and its gap visible (0.4.158). */
.allocation-tabs { display:flex; gap:28px; max-width:100%; overflow-x:auto; margin:-4px -8px; padding:4px 8px; }
/* 0.4.172: the tabs fit more on a phone; the edge shadow (styles.css) shows that the strip scrolls. */
@media (max-width:760px) { .allocation-tabs { gap:20px; } }
.allocation-tab { display:inline-flex; flex:none; align-items:center; gap:8px; height:46px; padding:0; border:0; border-bottom:3px solid transparent; color:var(--text); background:transparent; font-size:15px; font-weight:500; white-space:nowrap; cursor:pointer; }
.allocation-tab:hover { color:var(--strong); }
.allocation-tab { position:relative; }
.allocation-tab[aria-selected="true"] { color:var(--strong); border-bottom-color:var(--accent); font-weight:600; }
.allocation-tab-count { padding:3px 8px; border-radius:100px; color:var(--text); background:var(--surface-muted); font-size:13px; font-weight:500; line-height:1; font-variant-numeric:tabular-nums; }
.allocation-people-tools { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-bottom:8px; }
.allocation-filter-chip:empty { display:none; }
.allocation-chip-button { display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 10px 0 12px; border:1px solid var(--accent); border-radius:100px; color:var(--tint-text); background:var(--tint); font-size:14px; font-weight:600; cursor:pointer; }
.allocation-chip-x { font-size:16px; line-height:1; }
.allocation-search { display:block; }
.allocation-body .allocation-search input { width:300px; max-width:100%; height:40px; min-height:40px; padding:0 12px; border:1px solid var(--border-strong); border-radius:8px; color:var(--strong); background:var(--surface); font-size:15px; }
.allocation-more-filters { padding:0 24px; border-bottom:1px solid var(--border); }
.allocation-more-filters > summary { display:flex; align-items:center; width:max-content; min-height:44px; color:var(--accent-text); font-size:14px; font-weight:600; cursor:pointer; }
.allocation-filter-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:0 0 16px; }
.allocation-field { display:grid; gap:6px; min-width:0; color:var(--strong); font-size:14px; font-weight:600; }
.allocation-body .allocation-field select { width:100%; height:40px; min-height:40px; padding:0 10px; border:1px solid var(--border-strong); border-radius:8px; color:var(--strong); background:var(--surface); font-size:15px; font-weight:400; }

.allocation-list-head, .allocation-user { display:grid; grid-template-columns:minmax(0,1.2fr) 140px minmax(0,3.2fr) minmax(0,.8fr); align-items:center; gap:16px; padding:6px 24px; }
.allocation-list-head { min-height:44px; padding-block:0; border-bottom:1px solid var(--border); color:var(--text); background:var(--bg); font-size:14px; font-weight:600; }
.allocation-list-head .is-numeric { text-align:right; }
.allocation-list-head .is-numeric .sort-button { justify-content:flex-end; }
.allocation-list-head .sort-button { min-height:44px; font-weight:600; }
/* The Sort select replaces the column headings where the headings are hidden (narrow list). */
.allocation-body .allocation-sort-select { display:none; width:auto; height:40px; min-height:40px; padding:0 12px; border:1px solid var(--border-strong); border-radius:8px; color:var(--strong); background:var(--surface); font-size:15px; }
.allocation-user { min-height:56px; border-bottom:1px solid var(--border); }
.allocation-user.is-unallocated { box-shadow:inset 4px 0 0 var(--warn-fg); }
.allocation-user.is-changed { box-shadow:inset 4px 0 0 var(--accent); background:var(--tint); }
.allocation-person { display:grid; gap:2px; min-width:0; }
/* Names and sign-in names wrap instead of being cut off: an ellipsis has no way to show the rest on touch. */
.allocation-person > * { overflow-wrap:anywhere; }
.allocation-person-name { color:var(--strong); font-size:15px; line-height:22px; font-weight:600; }
.allocation-person-upn, .allocation-review-reason { font-size:13px; line-height:18px; }
.allocation-review-reason { color:var(--warn-fg); }
.allocation-person .allocation-candidates { font-size:12px; line-height:16px; white-space:normal; overflow-wrap:anywhere; }
.allocation-estimate { display:grid; justify-items:end; min-width:0; text-align:right; font-variant-numeric:tabular-nums; }
.allocation-estimate strong { color:var(--strong); font-size:15px; line-height:22px; font-weight:600; }
.allocation-estimate span, .allocation-estimate small { font-size:13px; line-height:18px; }
.allocation-unit-cell { min-width:0; }
.allocation-unit-name { display:block; margin-top:4px; font-size:13px; line-height:18px; }
.allocation-unit-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; }
.allocation-unit { min-width:0; height:34px; padding:0 4px; overflow:hidden; border:1px solid var(--border-strong); border-radius:8px; color:var(--strong); background:var(--surface); font-size:13px; font-weight:600; line-height:1; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
/* 0.4.240: "Valid from" has its own line under the unit buttons, so it never narrows them; the history line wraps. */
.allocation-valid-from { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; margin-top:8px; font-size:13px; line-height:18px; }
.allocation-valid-from-label { color:var(--strong); font-weight:600; }
.allocation-valid-from-select { width:auto; max-width:100%; min-height:44px; padding:0 8px; border:1px solid var(--field-border); border-radius:8px; color:var(--strong); background:var(--surface); font:inherit; font-size:13px; }
.allocation-valid-from .text-button { min-height:44px; font-size:13px; }
.allocation-unit-history { display:block; margin-top:4px; font-size:12px; line-height:16px; overflow-wrap:anywhere; }
.allocation-unit:hover:not(:disabled) { border-color:var(--accent); }
.allocation-unit.is-suggested { border:2px dashed var(--warn-fg); color:var(--warn-fg); background:var(--warn-bg); }
/* The selected unit's fill is painted as an image (0.4.158): its focus ring sits outside it, on the card. */
.allocation-unit[aria-pressed="true"] { --fill:var(--button-primary); border:2px solid var(--button-primary); color:#fff; background:linear-gradient(var(--fill), var(--fill)); }
.allocation-unit[aria-pressed="true"]:hover:not(:disabled) { --fill:var(--button-primary-hover); border-color:var(--button-primary-hover); }
.allocation-unit:disabled { border-color:var(--border); color:var(--muted); background:var(--surface-muted); cursor:not-allowed; }
.allocation-unit[aria-pressed="true"]:disabled { border:2px solid var(--accent); color:var(--tint-text); background:var(--tint); }
.allocation-unit.is-blocked { text-decoration:line-through; }
.allocation-department { display:grid; gap:2px; min-width:0; }
.allocation-body input.allocation-department-input { width:100%; height:32px; min-height:32px; padding:0 8px; margin-left:-8px; border:1px solid transparent; border-radius:6px; color:var(--text); background:transparent; font-size:14px; text-overflow:ellipsis; }
.allocation-body input.allocation-department-input:hover { border-color:var(--border-strong); }
.allocation-body input.allocation-department-input:focus { border-color:var(--border-strong); color:var(--strong); background:var(--surface); }
.allocation-department-text { overflow:hidden; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.allocation-department .text-button { justify-self:start; min-height:28px; font-size:13px; }
.allocation-manager { display:grid; min-width:0; color:var(--text); font-size:13px; line-height:18px; }
.allocation-manager > * { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.allocation-manager small { font-size:12px; white-space:normal; overflow-wrap:anywhere; }
.allocation-empty { margin:0; padding:24px; }
.allocation-people-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:14px 24px; font-size:14px; }
.allocation-legend { max-width:72ch; margin:0; }
.allocation-pager { display:flex; align-items:center; flex-wrap:wrap; gap:12px; font-variant-numeric:tabular-nums; }
.allocation-pager .secondary-button { min-height:36px; }

/* Narrow list: the buttons move onto their own line, still all units on every row. */
@container (max-width: 980px) {
  .allocation-list-head { display:none; }
  .allocation-body .allocation-sort-select { display:block; }
  .allocation-user { grid-template-columns:minmax(0,1fr) auto minmax(0,.7fr); grid-template-areas:"person estimate department" "units units units"; gap:8px 16px; padding:12px 24px; }
  .allocation-person { grid-area:person; }
  .allocation-estimate { grid-area:estimate; }
  .allocation-unit-cell { grid-area:units; }
  .allocation-department { grid-area:department; }
}
@container (max-width: 620px) {
  /* The estimate column is capped so a long note ("Self-funded — no central charge") wraps instead of squeezing the name. */
  .allocation-user { grid-template-columns:minmax(0,1fr) fit-content(45%); grid-template-areas:"person estimate" "units units" "department department"; padding:12px 16px; }
  .allocation-unit-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .allocation-unit { height:40px; }
  .allocation-body input.allocation-department-input { margin-left:0; border-color:var(--border); }
}
@container (max-width: 400px) {
  .allocation-unit-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* Sticky save bar: always near-black, in both themes. */
.allocation-save-bar { position:sticky; bottom:16px; z-index:5; display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; padding:14px 20px; border:1px solid #33363a; border-radius:8px; color:#fff; background:#212224; box-shadow:var(--shadow-overlay); }
.allocation-save-message { flex:1 1 320px; font-size:15px; line-height:22px; }
.allocation-save-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.allocation-save-bar .text-button { min-height:40px; padding:0 8px; color:#fff; }
.allocation-save-bar .text-button:disabled { color:#9aa4a9; cursor:not-allowed; }
.allocation-save-local { color:#c9cfd1; font-size:13px; }
.allocation-save-local:empty { display:none; }
.allocation-save-bar :focus-visible { outline-color:#7bc87a; }
.allocation-publish-button:disabled { border-color:#4b5055; color:#c9cfd1; background:#4b5055; cursor:not-allowed; }

/* Published reports, exports and manager reports */
.allocation-published-panel { padding-bottom:20px; scroll-margin-top:88px; }
.allocation-published-panel:focus { outline:none; }
.allocation-published-panel:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.allocation-published-panel > :not(.allocation-card-header) { margin-inline:20px; }
.allocation-version-field { max-width:420px; }
.allocation-archive { margin-top:16px; }
.allocation-archive > summary { color:var(--accent-text); font-size:14px; font-weight:600; cursor:pointer; }
.allocation-controls { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:12px 0; }
.allocation-controls input, .allocation-controls select { width:auto; max-width:100%; min-height:40px; }
.allocation-delivery { margin-top:20px; padding-top:16px; border-top:1px solid var(--border); }
.allocation-delivery > h3 { margin:0; font-size:17px; line-height:24px; font-weight:600; }
.allocation-delivery > p { max-width:76ch; margin:4px 0 0; font-size:14px; line-height:20px; }
.allocation-export-basis { margin:8px 0; }
.allocation-body .allocation-checkbox-label { display:flex; align-items:center; gap:8px; }
.allocation-body label input[type="checkbox"] { display:inline-block; width:18px; height:18px; min-width:18px; min-height:18px; max-width:18px; margin:0; flex:none; }
.allocation-body .table-shell { overflow-x:auto; }
.allocation-email-preview:not(:empty) { margin:16px 0; padding:16px; border:1px solid var(--border); border-radius:8px; }
.allocation-email-preview > h4 { margin-top:0; }

/* Employee files drawer */
.allocation-files-body { gap:24px; }
.allocation-files-lead { margin:0; color:var(--text); font-size:15px; line-height:22px; }
.allocation-files { display:grid; gap:12px; min-width:0; }
.allocation-files-intro { margin:0; font-size:14px; line-height:20px; }
.allocation-file-list { display:grid; gap:12px; }
.allocation-file { display:grid; gap:8px; min-width:0; padding:16px 20px; border:1px solid var(--border); border-radius:8px; }
.allocation-file-head { display:flex; align-items:center; gap:12px; min-width:0; }
.allocation-file-title { flex:1 1 auto; min-width:0; color:var(--strong); font-size:15px; line-height:22px; font-weight:600; }
.allocation-file-unit { font-size:13px; }
.allocation-filename { overflow-wrap:anywhere; color:var(--text); font-size:14px; line-height:20px; }
.allocation-file-input { position:absolute; width:1px !important; height:1px; min-height:0 !important; padding:0 !important; opacity:0; overflow:hidden; }
.allocation-file-actions { display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px; }
.allocation-file-actions .text-button { font-size:14px; }
.allocation-row-settings { min-width:0; font-size:14px; }
.allocation-row-settings > summary { display:flex; align-items:center; min-height:36px; color:var(--accent-text); font-weight:600; cursor:pointer; }
.allocation-row-settings[open] { flex:1 1 100%; padding:4px 12px 12px; border:1px solid var(--border); border-radius:8px; }
.allocation-row-settings[open] > label { margin-top:10px; }
.allocation-row-settings[open] > button { margin-top:12px; }
.allocation-mapping { display:grid; gap:12px; padding-top:12px; }
.allocation-help { margin:0; }
.allocation-files-body label { display:block; font-size:14px; }
.allocation-files-body label input:not([type="file"]):not([type="checkbox"]), .allocation-files-body label select { display:block; width:100%; margin-top:6px; }
.allocation-files-body label.allocation-file-title { font-size:15px; }
.allocation-drawer-section { display:grid; justify-items:start; gap:12px; padding-top:20px; border-top:1px solid var(--border); }
.allocation-drawer-section > * { max-width:100%; }
.allocation-drawer-section h3, .allocation-section-toolbar h3 { margin:0; font-size:17px; line-height:24px; font-weight:600; }
.allocation-drawer-section > p { margin:0; font-size:14px; line-height:20px; }
.allocation-drawer-section .allocation-organizations { justify-self:stretch; }
.allocation-device-actions { display:flex; flex-wrap:wrap; align-items:center; }
.allocation-device-actions > h3 { flex:1 1 100%; }
.allocation-secondary > summary { font-size:14px; font-weight:600; color:var(--accent-text); cursor:pointer; }
.allocation-files-body .allocation-secondary { margin:0; }
.allocation-files-body .allocation-section-toolbar { margin:0; }
.allocation-files-body .allocation-secondary[open] { display:grid; gap:12px; }
/* Membership lists: one card per list, highest priority first. */
.allocation-membership-priority ol.allocation-file-list, .allocation-membership-priority ul.allocation-file-list { justify-self:stretch; margin:0; padding:0; list-style:none; counter-reset:allocation-list; }
.allocation-membership-priority ol.allocation-file-list > li { position:relative; display:grid; gap:6px; padding:0 0 0 32px; counter-increment:allocation-list; }
.allocation-membership-priority ol.allocation-file-list > li::before { content:counter(allocation-list); position:absolute; top:16px; left:0; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:var(--tint-text); background:var(--tint); font-size:13px; font-weight:600; }
.allocation-membership-priority ul.allocation-file-list > li { display:grid; gap:6px; }
.allocation-membership-priority li span { display:inline; }
.allocation-list-order { gap:4px 8px; }
.allocation-list-order .secondary-button { min-height:32px; padding:0 12px; font-size:13px; }
.allocation-file-note { color:var(--text); font-size:14px; line-height:20px; }
.allocation-ccoe-file, .allocation-drawer-section > .allocation-file { justify-self:stretch; }
.allocation-files-body .allocation-membership-priority { padding-block:0; border-block-end:0; }
.allocation-files > .allocation-drawer-section:first-child { padding-top:0; border-top:0; }
.allocation-file-preview { display:grid; gap:8px; padding:12px; border:1px solid var(--accent-border); border-radius:8px; background:var(--surface-subtle); }
.allocation-file-preview .table-shell { max-height:240px; overflow:auto; }
.allocation-preview-count { margin:0; color:var(--strong); font-size:14px; font-weight:600; }
.allocation-group-results { display:grid; gap:4px; margin-top:10px; }
.allocation-group-option { padding:8px 12px; border:1px solid var(--border); border-radius:6px; color:var(--strong); font-size:14px; cursor:pointer; }
.allocation-group-option:hover { border-color:var(--accent-border); }
.allocation-group-option:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.allocation-group-option[aria-selected="true"] { border-color:var(--accent); background:var(--tint); color:var(--tint-text); font-weight:600; }
.allocation-files-settings > summary { font-size:17px; line-height:24px; font-weight:600; color:var(--strong); cursor:pointer; }
.allocation-files-settings[open] { gap:20px; }
.allocation-settings-group { display:grid; justify-items:start; gap:10px; justify-self:stretch; min-width:0; }
.allocation-settings-group > h3 { margin:0; font-size:15px; line-height:22px; font-weight:600; }
.allocation-settings-group > p { margin:0; font-size:14px; line-height:20px; }
.allocation-bridge { display:grid; gap:12px; justify-self:stretch; }
.allocation-device-actions > p { flex:1 1 100%; }

@media (max-width:760px) {
  .allocation-strip-divider, .allocation-strip-spacer { display:none; }
  .allocation-total { border-radius:0 !important; }
  .allocation-people-header { padding:4px 16px 0; }
  .allocation-people-tools, .allocation-search, .allocation-body .allocation-search input { width:100%; }
  .allocation-more-filters { padding:0 16px; }
  .allocation-filter-grid { grid-template-columns:1fr; }
  .allocation-people-footer { padding:12px 16px; }
  .allocation-card-header { align-items:flex-start; padding:16px; }
  .allocation-published-panel > :not(.allocation-card-header) { margin-inline:16px; }
  .allocation-save-bar { padding:12px 16px; }
  .allocation-save-actions { width:100%; }
  .allocation-publish-button { flex:1 1 auto; }
  .allocation-header-actions { width:100%; flex-wrap:wrap; }
  .allocation-header-actions .month-control { flex:1 1 160px; }
  #allocation-period-select { width:100%; min-width:0; }
}
@media (max-width:420px) {
  .allocation-total { flex-basis:100%; }
  .allocation-tabs { gap:20px; }
}

/* Organizations and membership lists in the Employee files drawer. */
.allocation-inline-create { max-width:640px; margin-top:12px; padding:14px; border:1px solid var(--border, #d9e1e8); border-radius:8px; }
.allocation-inline-create > label { display:block; }
.allocation-inline-create input { width:100%; box-sizing:border-box; }
.allocation-inline-create button { margin:8px 8px 0 0; }
.allocation-organization-settings { margin-top:14px; }
.allocation-section-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:20px 0 12px; }
.allocation-section-toolbar h3 { margin:0 auto 0 0; font-size:var(--font-card-title-size); }
.allocation-registry-list { border-top:1px solid var(--border); }
.allocation-row-description { display:grid; gap:2px; min-width:0; flex:1 1 auto; }
.allocation-row-description > strong { color:var(--strong); overflow-wrap:anywhere; }
.allocation-registry-row { min-height:64px; display:flex; gap:16px; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); padding:10px 0; box-sizing:border-box; }
.allocation-organization-editor { padding:16px; border-bottom:1px solid var(--border); background:var(--surface); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.allocation-organization-editor > p { grid-column:1/-1; margin:0; font-size:var(--font-body-size); }
.allocation-editor-actions { display:flex; gap:10px; align-items:center; justify-content:flex-end; }
.allocation-body .allocation-checkbox-label { display:flex; align-items:center; gap:8px; }
.allocation-body label input[type="checkbox"] { display:inline-block; width:18px; height:18px; min-width:18px; min-height:18px; max-width:18px; margin:0; flex:none; }
/* Covered-by rule (0.4.157): one row of target and note, then months and the switch. */
.allocation-coverage { grid-column:1/-1; min-width:0; margin:0; padding:8px 16px 16px; border:1px solid var(--border); border-radius:8px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto; align-items:end; gap:12px; }
.allocation-coverage > legend { padding:0 6px; color:var(--strong); font-weight:600; }
.allocation-coverage > p { grid-column:1/-1; margin:0; }
.allocation-coverage > label { display:block; min-width:0; }
.allocation-coverage > label:nth-of-type(2) { grid-column:2/-1; }
.allocation-coverage input:not([type="checkbox"]), .allocation-coverage select { width:100%; box-sizing:border-box; }
.allocation-coverage > .allocation-checkbox-label { min-height:40px; }
.allocation-coverage-summary { display:block; }
.allocation-add-list { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; gap:12px; padding:16px 0; border-bottom:1px solid var(--border); }
/* 0.4.238: the help text and the buttons get their own full-width rows, so the two fields are never squeezed. */
.allocation-add-list > .allocation-add-help, .allocation-add-actions { grid-column:1 / -1; margin:0; }
.allocation-add-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
@media (max-width:700px) {
    .allocation-organization-editor, .allocation-add-list, .allocation-coverage { grid-template-columns:minmax(0,1fr); }
  .allocation-coverage > label:nth-of-type(2) { grid-column:auto; }
  .allocation-editor-actions { justify-content:flex-start; flex-wrap:wrap; }
}

/* Manager report previews opened from cost allocation. */
.allocation-manager-reports:not(:empty) { border:1px solid var(--border); border-radius:8px; padding:16px; margin:16px 0; }
.allocation-manager-reports > h4 { margin-top:0; }
.allocation-manager-reports td { vertical-align:top; }
.allocation-manager-preview-row > td { padding:0; white-space:normal; }
.allocation-manager-preview { padding:20px; background:var(--surface); border-left:3px solid var(--brand-green); }
.allocation-manager-preview > h4:first-child { margin-top:0; }
.allocation-manager-preview > button { margin:8px 8px 0 0; }
.allocation-manager-preview p { max-width:90ch; white-space:normal; overflow-wrap:anywhere; line-height:1.5; }
.allocation-manager-reports button[aria-expanded="true"] { border-color:var(--brand-green); font-weight:650; }
@media(max-width:600px) {
  .allocation-manager-reports:not(:empty),.allocation-manager-preview { padding:12px; }
}
.allocation-manager-list > table { table-layout:fixed; min-width:0; }
.allocation-manager-list > table > thead th,.allocation-manager-list > table > tbody > tr > td { padding:12px 10px; overflow-wrap:anywhere; }
.allocation-manager-list > table > tbody > .allocation-manager-preview-row > td { padding:0; }
.allocation-manager-list > table > tbody > tr > td:last-child > button { width:100%; padding:8px; }
@media(max-width:600px) {
  .allocation-manager-list > table,.allocation-manager-list > table > tbody { display:block; }
  .allocation-manager-list > table > thead { display:none; }
  .allocation-manager-list > table > tbody > tr { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--border); }
  .allocation-manager-list > table > tbody > tr > td { display:block; border:0; min-width:0; }
  .allocation-manager-list > table > tbody > tr > td[data-label]::before { content:attr(data-label); display:block; font-size:var(--font-small-size); color:var(--muted); margin-bottom:5px; }
  .allocation-manager-list > table > tbody > tr > td:first-child,.allocation-manager-list > table > tbody > tr > td:last-child { grid-column:1/-1; }
  .allocation-manager-list > table > tbody > .allocation-manager-preview-row { display:block; }
}
.allocation-manager-preview th,.allocation-manager-preview td { overflow-wrap:normal; }
.allocation-manager-preview table { min-width:900px; }
.allocation-manager-preview th,.allocation-manager-preview td { padding:12px 16px; }
/* Simple export choice and one compact manager person list. */
.allocation-export-controls { align-items:end; }
.allocation-export-controls > label:first-child { display:grid; gap:6px; min-width:180px; }
.allocation-export-controls select { padding:10px; border:1px solid var(--border); border-radius:6px; background:var(--surface); color:var(--text); }
.allocation-export-controls .allocation-checkbox-label { align-self:center; }
.allocation-manager-compact table { min-width:0; width:100%; table-layout:fixed; }
.allocation-manager-compact th,.allocation-manager-compact td { white-space:normal; overflow-wrap:anywhere; padding:10px 12px; }
.allocation-manager-compact th:first-child { width:40%; }
.allocation-manager-compact th:not(:first-child),.allocation-manager-compact td:not(:first-child) { text-align:right; font-variant-numeric:tabular-nums; }
.allocation-manager-compact tfoot { border-top:2px solid var(--border); font-weight:650; }
.allocation-manager-extra { margin:16px 0; }
.allocation-manager-extra > summary { cursor:pointer; font-weight:600; }
@media(max-width:600px) {
  .allocation-export-controls > label:first-child { width:100%; }
  .allocation-manager-compact th,.allocation-manager-compact td { font-size:12px; padding:8px 5px; }
}

@media(max-width:600px) {
  .allocation-manager-compact th:first-child { width:34%; }
  .allocation-manager-compact th { font-size:12px; letter-spacing:0; overflow-wrap:normal; }
  .allocation-manager-compact td { overflow-wrap:normal; }
  .allocation-manager-compact th,.allocation-manager-compact td { padding-inline:3px; }
  .allocation-manager-compact td:first-child { overflow-wrap:anywhere; }
}

/* Ordered evidence and draft-only proposals remain readable in the files drawer. */
.allocation-membership-priority { padding-block: 1rem; border-block-end: 1px solid var(--border, #d8dce3); }
.allocation-membership-priority ol { margin: .75rem 0; padding-inline-start: 1.5rem; }
.allocation-membership-priority li { padding-block: .35rem; overflow-wrap: anywhere; }
.allocation-membership-priority li span { display: block; }
.allocation-membership-priority li button { margin-inline-end: .5rem; margin-block-start: .25rem; }
.allocation-membership-evidence { display: block; font-size: .75rem; overflow-wrap: anywhere; }
.allocation-priority-proposal { display: grid; gap: .35rem; padding-block-start: .5rem; font-size: .8rem; }
.allocation-priority-proposal button { justify-self: start; }

/* How you buy credits (0.4.159): the second Billing view. Form controls use --field-border (3:1), targets are
   44px, the selected view and switch states are shown by weight, border and On/Off text, not colour alone. */
.billing-views { display:flex; flex-wrap:wrap; gap:4px; width:max-content; max-width:100%; margin:0 0 16px; padding:4px; border:1px solid var(--border); border-radius:10px; background:var(--surface-muted); }
.billing-view-link { display:inline-flex; align-items:center; min-height:44px; padding:0 14px; border:1px solid transparent; border-radius:8px; color:var(--text); font-size:15px; font-weight:500; text-decoration:none; }
.billing-view-link:hover { color:var(--strong); }
.billing-view-link[aria-current="page"] { border-color:var(--field-border); color:var(--strong); background:var(--surface); font-weight:700; }
.purchase-mix { min-width:0; }
.purchase-mix[hidden] { display:none; }
.purchase-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,360px); gap:20px; align-items:start; }
.purchase-main { display:grid; gap:20px; min-width:0; }
.purchase-card { padding:20px; }
.purchase-card h2, .purchase-summary h2 { margin:0; color:var(--strong); font-size:17px; line-height:24px; font-weight:600; }
.purchase-card > p, .purchase-card-head p { max-width:76ch; margin:4px 0 0; font-size:14px; line-height:20px; }
.purchase-steps { display:grid; gap:12px; margin:16px 0 0; padding:0; list-style:none; }
.purchase-step { display:grid; grid-template-columns:32px minmax(0,1fr); gap:12px; padding:16px; border:1px solid var(--border); border-radius:8px; }
.purchase-step.is-off { background:var(--surface-subtle, var(--surface-muted)); }
.purchase-step-number { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; color:var(--strong); background:var(--surface-muted); font-weight:700; }
.purchase-step-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; }
.purchase-step-head h3 { margin:0; color:var(--strong); font-size:16px; line-height:24px; }
.purchase-step-text { margin:4px 0 0; font-size:14px; line-height:20px; }
.purchase-step-settings { display:grid; gap:12px; margin-top:12px; }
.purchase-step-settings[hidden] { display:none; }
.purchase-field { display:grid; gap:4px; max-width:320px; }
.purchase-field label { color:var(--strong); font-size:14px; font-weight:600; }
.purchase-field input { min-height:44px; border:1px solid var(--field-border); }
.purchase-hint { margin:0; font-size:13px; line-height:18px; }
.purchase-line { margin:0; color:var(--text); font-size:14px; line-height:20px; }
.purchase-note[hidden], .purchase-problems[hidden], .purchase-mix .notice[hidden] { display:none; }
.purchase-switch { display:inline-flex; align-items:center; gap:8px; min-width:88px; min-height:44px; padding:0 12px 0 8px; border:1px solid var(--field-border); border-radius:22px; color:var(--strong); background:var(--surface); font-weight:600; cursor:pointer; }
.purchase-switch-track { position:relative; display:inline-block; width:36px; height:20px; border:1px solid var(--field-border); border-radius:10px; background:var(--surface-muted); }
.purchase-switch-thumb { position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%; background:var(--field-border); transition:transform .15s ease; }
.purchase-switch[aria-checked="true"] .purchase-switch-track { border-color:var(--button-primary); background:var(--button-primary); }
.purchase-switch[aria-checked="true"] .purchase-switch-thumb { background:#fff; transform:translateX(16px); }
.purchase-inline-switch { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
.purchase-inline-label { color:var(--strong); font-size:14px; font-weight:600; }
.purchase-card-head { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:12px 16px; }
.purchase-upload-control { position:relative; }
.purchase-file { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); border:0; white-space:nowrap; }
.purchase-upload { min-height:44px; }
/* 0.4.206: where the spending policies CSV is exported; a 44 px target like every other control. */
.purchase-policies-source { display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:600; }
.purchase-policies .notice { margin:12px 0 0; }
.purchase-status { min-height:0; margin:8px 0 0; font-size:14px; }
.purchase-status:empty { display:none; }
.purchase-table-shell { margin-top:12px; overflow-x:auto; }
.purchase-policy-table { width:100%; border-collapse:collapse; font-size:14px; }
.purchase-policy-note { max-width:76ch; margin:12px 0 0; font-size:13px; line-height:18px; }
.purchase-policy-table :is(.purchase-policy-groups, td:last-child) { white-space:normal; overflow-wrap:anywhere; }
.purchase-policy-groups { min-width:140px; }
.purchase-policy-table th, .purchase-policy-table td { padding:10px 12px; border-bottom:1px solid var(--border-soft, var(--border)); text-align:left; }
.purchase-policy-table thead th { color:var(--text); font-size:13px; font-weight:600; }
.purchase-policy-table .is-numeric { text-align:right; white-space:nowrap; }
.purchase-policy-name { color:var(--strong); font-weight:600; white-space:nowrap; }
.purchase-summary { position:sticky; top:16px; display:grid; gap:10px; padding:20px; }
.purchase-summary p { margin:0; }
.purchase-total { color:var(--strong); font-size:28px; line-height:34px; font-weight:700; }
.purchase-price { color:var(--strong); font-size:14px; }
.purchase-bar { display:block; width:100%; height:16px; border-radius:4px; background:var(--surface-muted); }
.purchase-bar-packs, .purchase-swatch.purchase-bar-packs rect { fill:var(--chart-cowork); }
.purchase-bar-p3, .purchase-swatch.purchase-bar-p3 rect { fill:var(--chart-github); }
.purchase-bar-payg, .purchase-swatch.purchase-bar-payg rect { fill:var(--chart-studio); }
.purchase-legend { display:grid; gap:8px; margin:0; padding:0; list-style:none; font-size:14px; }
.purchase-legend-item { display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:baseline; gap:2px 8px; }
.purchase-legend-item .muted { grid-column:2; font-size:13px; }
.purchase-legend-item strong { grid-column:3; grid-row:1; color:var(--strong); white-space:nowrap; }
.purchase-legend-label { color:var(--strong); }
.purchase-swatch { width:12px; height:12px; }
.purchase-swatch-empty { width:12px; height:12px; border:2px dashed var(--field-border); border-radius:2px; }
.purchase-totals { display:grid; grid-template-columns:1fr auto; gap:4px 12px; margin:0; padding-top:10px; border-top:1px solid var(--border); font-size:14px; }
.purchase-totals dt { color:var(--text); }
.purchase-totals dd { margin:0; color:var(--strong); font-weight:600; text-align:right; }
.purchase-actions { display:flex; flex-wrap:wrap; gap:8px; }
.purchase-actions button { min-height:44px; }
.purchase-actions [aria-disabled="true"] { opacity:.55; cursor:not-allowed; }
.purchase-problems { margin:0; color:var(--error-fg); font-size:14px; }
.purchase-field-error { margin:4px 0 0; color:var(--error-fg); font-size:14px; line-height:20px; }
.purchase-field input[aria-invalid="true"] { border-color:var(--error-fg); }
.purchase-month-note { margin:0; font-size:13px; line-height:18px; }
.purchase-footnote { font-size:13px; line-height:18px; }
@media (max-width:1100px) {
  .purchase-layout { grid-template-columns:minmax(0,1fr); }
  .purchase-summary { position:static; }
}
@media (max-width:660px) {
  .billing-views { width:100%; }
  .billing-view-link { flex:1 1 auto; justify-content:center; }
  .purchase-card, .purchase-summary { padding:16px; }
  .purchase-step { grid-template-columns:minmax(0,1fr); }
  .purchase-step-number { width:28px; height:28px; }
  .purchase-field { max-width:none; }
}

/* 0.4.161 Billing: published-allocation card actions, billing-unit summary, Versions and exports, Billing rules. */
.allocation-strip-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.allocation-status-strip .allocation-strip-actions .primary-button,
.allocation-status-strip .allocation-strip-actions .secondary-button { min-height:44px; padding:0 16px; }
.allocation-card-actions { display:flex; flex-wrap:wrap; gap:8px; }
.allocation-card-actions .secondary-button { min-height:44px; border-color:var(--field-border); }
.billing-unit-summary .allocation-matrix-shell { border-top:1px solid var(--border); }
.billing-units-table tr.is-covered > th .allocation-matrix-unit { padding-left:24px; }
.billing-units-table tr.is-covered > * { background:var(--bg); }
.billing-units-table tr.is-covered > th .allocation-matrix-unit strong { font-weight:500; }
.billing-units-table .allocation-matrix-unit { flex-wrap:wrap; gap:0 10px; }
.billing-units-table .allocation-matrix-unit:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.billing-clear-filter { margin:8px 20px 12px; min-height:44px; }
.billing-clear-filter[hidden] { display:none; }
.allocation-versions { padding:0 0 20px; }
.allocation-versions > .allocation-versions-summary { display:flex; align-items:center; min-height:56px; padding:0 20px; color:var(--strong); font-size:17px; line-height:24px; font-weight:600; cursor:pointer; }
.allocation-versions:not([open]) { padding-bottom:0; }
.allocation-versions > .allocation-versions-summary:focus-visible { outline:3px solid var(--accent); outline-offset:-3px; border-radius:8px; }
.allocation-versions > :not(summary) { margin-inline:20px; }
.allocation-archive > h3, .allocation-delivery > h3 { margin:0; font-size:15px; line-height:22px; font-weight:600; }
.allocation-user.is-residual { background:var(--bg); }
.allocation-inline-error { margin:0; padding:10px 12px; border-radius:8px; color:var(--error-fg); background:var(--error-bg); font-size:14px; line-height:20px; }
.allocation-inline-success { margin:0; padding:10px 12px; border-radius:8px; color:var(--ok-fg); background:var(--ok-bg); font-size:14px; line-height:20px; }
.allocation-inline-error[hidden], .allocation-inline-success[hidden] { display:none; }
.allocation-rules-panel { gap:20px; }
.allocation-rules-body { display:grid; gap:16px; min-width:0; }
.allocation-rules-list { display:grid; gap:12px; min-width:0; margin:0; padding:0; list-style:none; }
/* 0.4.161 fix round: the panel lists only existing rules; Edit and Add rule open the rule fields. */
.allocation-rule-item { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 12px; min-width:0; padding:12px 16px; border:1px solid var(--border); border-radius:8px; }
.allocation-rule-item.is-editing { display:block; padding:0; border:0; }
.allocation-rule-text { display:grid; gap:2px; flex:1 1 220px; min-width:0; }
.allocation-rule-text strong { color:var(--strong); overflow-wrap:anywhere; }
.allocation-rule-item.is-off .allocation-rule-text strong { color:var(--text); }
.allocation-rule-note-text { overflow-wrap:anywhere; }
.allocation-rule-item-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.allocation-rule-item-actions button, .allocation-rule-conflict button { min-height:44px; }
.allocation-rule-conflict { display:flex; flex-wrap:wrap; gap:8px; }
.allocation-rule-conflict p { flex:1 1 100%; margin:0; }
.allocation-rule .allocation-rules-actions { margin-top:8px; }
.allocation-rule > label { display:grid; gap:4px; }
.allocation-rule { grid-template-columns:minmax(0,1fr); }
.allocation-rule > label, .allocation-rule.allocation-coverage > label:nth-of-type(n) { grid-column:1/-1; }
.allocation-rule > .allocation-rule-fields, .allocation-rule > .allocation-rules-actions { grid-column:1/-1; }
/* 0.4.168: the rule form is one vertical column of full-width fields (Starts, Ends, On, Note), buttons below. */
.allocation-rule-fields { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:12px; min-width:0; }
.allocation-rule-fields[hidden] { display:none; }
.allocation-rule-fields > label { display:grid; gap:4px; min-width:0; }
.allocation-rule-fields > .allocation-checkbox-label { display:flex; }
.allocation-rule-fields input:not([type="checkbox"]) { width:100%; box-sizing:border-box; }
.allocation-rule-note { grid-column:1/-1; }
.allocation-rule-switch { min-height:44px; }
/* 0.4.172: the visual box is 22px; the 44px hit area is the label. */
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label:has(> input.allocation-switch) { min-height:44px; display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
/* 0.4.170 QA F17: the On switch of a saved rule uses the same switch style as the rule form. */
.allocation-rule-item-actions .allocation-rule-switch { display:inline-flex; align-items:center; gap:8px; }
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label input[type="checkbox"].allocation-switch { flex:none; margin:0; }
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label input[type="checkbox"].allocation-switch { appearance:none; position:relative; box-sizing:border-box; width:22px; height:22px; min-width:22px; min-height:22px; max-width:22px; border:1px solid var(--field-border); border-radius:5px; background:var(--surface); cursor:pointer; }
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label input[type="checkbox"].allocation-switch:checked { border-color:var(--accent); background:var(--accent); }
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label input[type="checkbox"].allocation-switch:checked::after { content:""; position:absolute; left:6px; top:2px; width:5px; height:10px; border:solid var(--surface); border-width:0 2px 2px 0; transform:rotate(45deg); }
:is(.allocation-body, .allocation-rules-body, .product-purchase-form) label input[type="checkbox"].allocation-switch:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.allocation-rules-actions { display:flex; flex-wrap:wrap; gap:10px; }
.allocation-rules-actions button { min-height:44px; }
.allocation-rule-changes { margin:12px 20px; }
@media (max-width:700px) {
  .allocation-rule-fields { grid-template-columns:minmax(0,1fr); }
  .allocation-versions > :not(summary) { margin-inline:16px; }
  .allocation-versions > .allocation-versions-summary { padding:0 16px; }
  .billing-clear-filter { margin-inline:16px; }
}
.allocation-rules-drawer .drawer-header .icon-button { width:44px; height:44px; }

/* 0.4.162: Billing setup (Administration's first tab): Who pays for whom | Employee data. */
.billing-setup-host[hidden] { display:none; }
.billing-setup-inline { margin-top:24px; }
.billing-setup-columns { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.25fr); gap:24px; align-items:start; }
.billing-setup-column { display:grid; gap:16px; min-width:0; padding:20px 24px 24px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.billing-setup-column > h2 { margin:0; color:var(--strong); font-size:var(--font-section-title-size); line-height:28px; }
.billing-setup-column > h2:focus { outline:none; }
.billing-setup-column > h2:focus-visible { outline:2px solid var(--focus-ring); outline-offset:2px; }
.billing-setup-column h3 { margin:8px 0 0; color:var(--strong); font-size:16px; line-height:22px; }
.billing-setup-units > summary, .billing-setup .allocation-row-settings > summary, .billing-setup details > summary { display:flex; align-items:center; min-height:44px; cursor:pointer; color:var(--strong); font-weight:600; }
.billing-setup button, .billing-setup a[href], .billing-setup select { min-height:44px; min-width:44px; }
.billing-setup .text-button { min-height:44px; }
.billing-setup .allocation-file-input { display:none; }
.billing-setup-entra { gap:10px; }
.billing-setup-local { display:grid; gap:0; margin:0; padding:0; list-style:none; border:1px solid var(--border); border-radius:8px; }
.billing-setup-local-row { display:flex; align-items:center; gap:16px; padding:12px 16px; border-top:1px solid var(--border); }
.billing-setup-local-row:first-child { border-top:0; }
.billing-setup-local-text { display:grid; gap:2px; flex:1 1 auto; min-width:0; font-size:14px; line-height:20px; }
.billing-setup-local-text strong { color:var(--strong); }
.billing-match { display:grid; gap:6px; }
.billing-match-bar { position:relative; height:8px; overflow:hidden; border-radius:4px; background:var(--surface-muted); box-shadow:inset 0 0 0 1px var(--border-strong); }
.billing-match-fill { position:absolute; inset:0 auto 0 0; width:0; border-radius:4px; background:var(--accent); }
.billing-match-text { display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px; margin:0; color:var(--strong); font-size:14px; }
.billing-match-link { display:inline-flex; align-items:center; min-height:44px; color:var(--accent-text); font-weight:600; }
.billing-unmatched { display:grid; gap:4px; max-height:240px; margin:0; padding:8px 12px 8px 28px; overflow:auto; border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:14px; overflow-wrap:anywhere; }
.billing-unmatched[hidden] { display:none; }
@media (max-width:1100px) { .billing-setup-columns { grid-template-columns:minmax(0, 1fr); } }

/* 0.4.162: Billing's people-without-a-unit status and the Published allocation card. */
.billing-needs-unit { display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; padding:16px 20px; border:1px solid var(--brand-yellow); border-radius:12px; color:var(--warn-fg); background:var(--warn-bg); }
.billing-needs-unit[hidden] { display:none; }
.billing-needs-unit-text { display:grid; gap:2px; flex:1 1 280px; min-width:0; }
.billing-needs-unit-text strong { font-size:16px; }
.billing-needs-unit-text .muted { color:var(--warn-fg); }
.billing-needs-unit .primary-button { min-height:44px; }
.allocation-published-card { display:grid; gap:12px; padding:20px 24px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.allocation-published-card[hidden] { display:none; }
.allocation-published-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.allocation-published-head h2 { margin:0; color:var(--strong); font-size:var(--font-card-title-size); }
.allocation-published-card .allocation-strip-published { margin:0; color:var(--text); }
.allocation-published-card .allocation-strip-published strong { color:var(--strong); }
.allocation-published-card .allocation-strip-actions .primary-button, .allocation-published-card .allocation-strip-actions .secondary-button { min-height:44px; padding:0 16px; }
@media (max-width:660px) {
  .allocation-published-card, .billing-needs-unit { padding:16px; }
}
.allocation-published-card .allocation-published-head { padding:0; align-items:flex-start; }
.billing-setup-local-row .secondary-button { white-space:nowrap; flex:none; }
.billing-setup details > summary { list-style:none; gap:8px; }
.billing-setup details > summary::-webkit-details-marker { display:none; }
.billing-setup details > summary::before { content:"\25B8"; color:var(--muted); }
.billing-setup details[open] > summary::before { content:"\25BE"; }
.billing-setup, .billing-setup-column, .billing-setup .allocation-file, .billing-setup .allocation-files { min-width:0; overflow-wrap:anywhere; }
.billing-setup .allocation-file-head, .billing-setup-local-row { flex-wrap:wrap; }
@media (max-width:660px) { .billing-setup-column { padding:16px; } }
.billing-setup .allocation-drawer-section { justify-items:stretch; }
.billing-setup .allocation-drawer-section > .secondary-button, .billing-setup .allocation-drawer-section > .primary-button { justify-self:start; white-space:normal; text-align:left; line-height:1.3; }
.billing-setup-column, .billing-setup .allocation-drawer-section, .billing-setup .allocation-files { grid-template-columns:minmax(0, 1fr); }
.billing-match { grid-template-columns:auto minmax(80px, 1fr); align-items:center; column-gap:16px; row-gap:4px; }
.billing-match-text { order:-1; }
.billing-unmatched { grid-column:1 / -1; }
.billing-setup .allocation-file { gap:4px 8px; padding:12px 16px; }
.billing-setup .allocation-file { gap:2px 8px; }
.allocation-status-strip.allocation-published-card { display:grid; align-items:stretch; gap:12px; padding:20px 24px; border-radius:12px; background:var(--surface); }
@media (max-width:660px) { .allocation-status-strip.allocation-published-card { padding:16px; } }
.billing-setup-back { display:inline-flex; align-items:center; min-height:44px; margin-bottom:8px; color:var(--accent-text); font-weight:600; }
/* Dark: the yellow status keeps its border; the fill stays dark enough for the green focus ring (3:1). */
:root[data-theme="dark"] .billing-needs-unit { background:var(--surface); border-left-width:4px; }
.allocation-published-card .allocation-strip-period { margin:4px 0 0; color:var(--muted); }

/* Reserve the first summary and people viewport before the selected month arrives. */
.allocation-output { min-height:820px; }
@media (max-width:760px) { .allocation-output { min-height:980px; } }

.allocation-output:empty { display:grid; }
/* The publication card is replaced in place when the workspace resolves. */
.allocation-body:has(.allocation-output:empty) .allocation-status-strip[hidden] { display:flex !important; min-height:267px; visibility:hidden; }

/* Keep setup sections stable as the registry, file state and Entra status arrive. */
@media (min-width:1061px) {
  .billing-setup .allocation-rules-body { min-height:195px; }
  .billing-setup .allocation-files { min-height:986px; align-content:start; }
  .billing-setup-entra { min-height:134px; align-content:start; }
}

/* 0.4.170: on a phone the billing units table keeps unit and cost on screen; who pays, people and credits return on wider screens. */
@media (max-width:640px) {
  .billing-units-table :is(th, td):nth-child(2), .billing-units-table :is(th, td):nth-child(3), .billing-units-table :is(th, td):nth-child(4) { display:none; }
  .billing-units-table { width:100%; min-width:0; }
}
/* 0.4.170: confirm step before publishing an allocation version. */
.allocation-publish-dialog-text { margin:0; padding:0 24px 16px; color:var(--text); }
.allocation-publish-dialog-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; padding:0 24px 24px; }
.allocation-publish-dialog-actions button { min-height:44px; }
/* 0.4.191: Published allocation is one slim bar: state chip, one line of text, the downloads on the right. */
.allocation-status-strip.allocation-published-card { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; padding:12px 20px; }
.allocation-published-card .allocation-strip-published { flex:1 1 280px; margin:0; }
.allocation-published-card .allocation-strip-period { margin:0; color:var(--muted); }
.allocation-published-card .allocation-strip-actions { margin-left:auto; }
.allocation-body:has(.allocation-output:empty) .allocation-status-strip[hidden] { min-height:68px; }
/* 0.4.191: beyond 16 billing units, the rest are in one "More units" list after the buttons. */
.allocation-unit-more { grid-column:1 / -1; min-height:34px; padding:0 8px; border:1px solid var(--field-border); border-radius:8px; color:var(--strong); background:var(--surface); font:inherit; font-size:13px; }
/* CCoE membership (0.4.194): Show members names the members with usage this month and counts the rest. */
.allocation-ccoe-members > strong { display:block; margin:10px 0 6px; color:var(--strong); font-size:14px; }
.allocation-ccoe-members > p { margin:0; }
.allocation-ccoe-member-list small { font-size:13px; }