/* Shared compact project context; keep the existing controls and topmenu. */
/* Semantic lifecycle tones are shared by project badges and schedule bars. */
:root{--status-hold-ink:#984311;--status-review-ink:#7041A7;--status-changes-ink:#B52C36;--status-preliminary-ink:#076E70;--status-ordered-ink:#484FA3;--status-draft-ink:#526173;--status-pink-ink:#A02D69}
[data-theme=dark]{--status-hold-ink:#FFB079;--status-review-ink:#C5A3FA;--status-changes-ink:#FF919B;--status-preliminary-ink:#78D8CF;--status-ordered-ink:#A8B5FF;--status-draft-ink:#BDC9DA;--status-pink-ink:#F49ACB}
:is([data-status-tone=hold],[data-tone=hold]){--status-colour:var(--project-orange);--status-ink:var(--status-hold-ink)}
:is([data-status-tone=review],[data-tone=review]){--status-colour:var(--project-purple);--status-ink:var(--status-review-ink)}
:is([data-status-tone=changes],[data-tone=changes]){--status-colour:#C23B46;--status-ink:var(--status-changes-ink)}
:is([data-status-tone=preliminary],[data-tone=preliminary]){--status-colour:var(--project-teal);--status-ink:var(--status-preliminary-ink)}
:is([data-status-tone=ordered],[data-tone=ordered]){--status-colour:#6169BF;--status-ink:var(--status-ordered-ink)}
:is([data-status-tone=draft],[data-tone=draft]){--status-colour:var(--project-slate);--status-ink:var(--status-draft-ink)}
:is([data-status-tone=pink],[data-tone=pink]){--status-colour:var(--project-pink);--status-ink:var(--status-pink-ink)}
[data-tone=planning]{--status-colour:var(--project-amber);--status-ink:var(--project-planning-ink)}
[data-tone=progress]{--status-colour:var(--project-blue);--status-ink:var(--project-progress-ink)}
[data-tone=completed]{--status-colour:var(--project-green);--status-ink:var(--project-completed-ink)}
.projects-status-label[data-status-tone]:not([data-status-tone=""]),.mw-screen .mm-timebar[data-tone]{background:color-mix(in srgb,var(--status-colour) 14%,var(--surface-work));color:var(--status-ink)}
.mw-screen .mm-timebar[data-tone]{background:color-mix(in srgb,var(--status-colour) 24%,var(--surface-work))}
:is([data-theme=yellow-black],[data-theme=black-yellow]) :is(.projects-status-label[data-status-tone],.mw-screen .mm-timebar[data-tone]){color:var(--hc-fg);background:var(--hc-bg);outline:1px solid var(--hc-fg);outline-offset:-1px}
main:has(>.ml-screen){display:flex;min-height:0;overflow:hidden;scrollbar-gutter:auto;padding-right:12px}
main>.ml-screen{flex:1;min-height:0;min-width:0;overflow:hidden;padding-bottom:0}
.ml-screen>.mg-layout{flex:1;min-height:0;overflow:hidden;align-items:stretch}
.ml-screen>.mg-layout>#mg-content{min-height:0;overflow:auto;scrollbar-gutter:stable}
.ml-screen>.mg-layout>.mg-detail{min-height:0;height:100%;max-height:none;overflow:auto}
.pi-screen:is(.pi-details,.pi-budget),.ml-screen,.pf-screen{gap:12px}
.pi-page-head.project-context{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;min-height:40px;padding:0 12px;margin:0;flex:none}
.project-context>.ml-heading-copy,.project-context>.pf-heading-copy{flex:1 1 320px;min-width:0}
.project-context .ml-heading-copy{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap}
.project-context-description{font-size:12px;line-height:20px;color:var(--muted)}
.project-context .ml-result-count{font-size:12px;line-height:20px;padding:0}
.project-context>.ml-controls,.project-context>.pf-toolbar{flex:1 1 auto;padding:0;min-width:0}
.project-context .ml-toolbar-end{margin-left:auto}
.project-context .pf-toolbar{flex-wrap:nowrap;gap:8px}
.project-context .pf-selection-tools{flex-wrap:wrap}
.project-context .pf-display-tools{flex-wrap:wrap;gap:8px;width:auto}
.project-context:has(#mg-bulk:not([hidden]))>.ml-heading-copy,.project-context:has(.pf-selected-count)>.pf-heading-copy{display:none}
.project-context .pf-toolbar-caption{display:none}
.pf-mobile-panes[hidden]{display:none!important}
.pi-details .pi-metrics,.pi-budget .pi-metrics{gap:16px}
.pi-details .pi-project-cards>.pi-panel,.pi-budget .pi-budget-metric{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:4px;min-height:88px}
.pi-scope-panel>.pi-spaces-heading{margin:0 0 12px;min-height:32px}
.pi-scope-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}
.pi-scope-heading .pi-scope-total{font-size:20px;line-height:28px}
.pi-details .pi-project-cards .pi-detail-value,.pi-budget .pi-budget-metric .pi-metric{font-size:20px;line-height:28px;margin:0}
.pi-details .pi-project-cards .pi-detail-caption{margin:0}
.pi-details .pi-budget-metric-head,.pi-budget .pi-budget-metric-head{min-height:24px}
.pi-details .pi-space{min-height:88px;align-items:center}
.pi-details .pi-space>.projects-more{align-self:center}
.pi-details .pi-space-links>.cta{align-self:flex-start}
.pi-details .pi-space-links small{line-height:16px}
.pi-details .pi-space :is(h3,p,small){overflow-wrap:anywhere}
/* Scroll rails occupy the existing inset, never the content or an extra margin. */
.sl-workspace{gap:4px}
.sl-tools>.sl-tool-group:first-child{min-width:0;max-width:100%}
.sl-tools .sl-inline-title{flex:1 1 auto;min-width:0;max-width:100%}
.sl-list-scroll{padding-right:max(0px,calc(12px - var(--project-rail-width,8px)));overscroll-behavior:none;overflow-anchor:none}
.sl-details-scroll,.pf-details-scroll{scrollbar-gutter:stable;scrollbar-width:thin;margin-right:-12px;padding-right:max(0px,calc(12px - var(--project-rail-width,8px)));overscroll-behavior:none;overflow-anchor:none;overflow-x:hidden;padding-bottom:12px}
.sl-details,.pf-details{overflow:hidden}
.ml-screen .mg-detail{scrollbar-width:thin;scrollbar-gutter:stable;padding-right:max(0px,calc(12px - var(--project-rail-width,8px)));border-radius:var(--radius-work)}
.pf-content-scroll{margin-right:-12px;padding-right:max(0px,calc(12px - var(--project-rail-width,8px)));overscroll-behavior:none;overflow-anchor:none}
.pf-screen .pf-pane-heading{min-height:48px;padding-block:4px}
.pf-details>header{flex:none;gap:8px}
.pf-details h2{line-height:24px}
@media(min-width:1400px){.project-context>.ml-controls,.project-context>.pf-toolbar{flex:0 1 auto}}
@media(max-width:1399px){.project-context>.ml-controls,.project-context>.pf-toolbar{flex-basis:100%}}
@media(min-width:1101px){.pi-details .pi-space{height:88px}.pi-space-columns,.pi-details .pi-space{grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr) minmax(0,1.4fr) minmax(0,1fr) 32px}.pi-details .pi-space>div:first-child :is(h3,p){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:700px){.project-context .ml-toolbar-end{width:auto;margin-left:0}.project-context>.ml-controls,.project-context>.pf-toolbar{flex-wrap:wrap}.project-context .pf-display-tools{margin-left:0}.pi-page-head.project-context{padding-inline:12px}.project-context .ml-result-count{display:inline}}

/* Project inspectors share the Management / fourth Products column width. */
.sl-workspace>.sl-details,.pf-workspace.has-details>.pf-details{width:max(300px,calc((100% - 48px)/4));min-width:0}
@media(min-width:1101px){.sl-workspace.has-detail>.sl-details,.pf-workspace.has-details>.pf-details{position:relative;inset:auto;box-shadow:none}}
@media(max-width:1100px){.sl-workspace>.sl-details,.pf-workspace.has-details>.pf-details{width:300px}}
@media(max-width:700px){.sl-workspace>.sl-details,.pf-workspace.has-details>.pf-details{width:min(360px,100%)}}
/* Image area of a 252 × 237 Variants card: 66.24% of its height. */
.sl-quick-product>.sl-photo,.sl-details-scroll>.sl-photo{height:auto;aspect-ratio:var(--product-image-ratio);width:100%;flex:none}
.sl-quick-product{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.sl-col-quantity>.sl-value{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}
.sl-col-quantity>.sl-value>small{display:inline}
.sl-quick-dialog footer{flex-wrap:wrap;gap:8px}
.sl-quick-dialog footer>[data-sl-quick-add]{margin-left:auto}
@media(max-width:600px){.sl-quick-product{grid-template-columns:minmax(0,1fr)}}