/* One navigation geometry across project workspace and procurement pages. */
.project-workspace .workspace{max-width:none}
.project-workspace #header{height:57px;min-height:57px;margin-bottom:24px;flex-wrap:nowrap}
.project-workspace #header .heading{min-width:0}
.project-workspace #header h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.project-workspace .project-tabs,.tabs-in .ws-menu-tabs{display:flex;flex-wrap:nowrap;gap:20px;height:46px;align-items:stretch;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap}
.project-workspace .project-tabs a,.tabs-in .ws-menu-tabs a{flex:none;display:flex;align-items:center;padding:12px 0;font:500 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;border:0;border-bottom:2px solid transparent;border-radius:0}
.project-workspace .project-tabs a:first-child,.tabs-in .ws-menu-tabs a:first-child{margin-left:auto}
.project-workspace .project-tabs a:last-child,.tabs-in .ws-menu-tabs a:last-child{margin-right:auto}
.project-workspace .project-tabs a.active,.tabs-in .ws-menu-tabs a.on{font-weight:500;border-bottom-color:#d6232e}
.tabs-in{max-width:none!important;padding:0 40px!important;border-top:0!important;flex-wrap:nowrap!important}
.tabs-in .ws-menu-tabs{width:100%;max-width:100%;min-width:0}
.tabs-in .ws-menu-tabs::after{display:none!important}
.top-in{max-width:none!important;height:116px;min-height:116px!important;padding:35px 40px 24px!important}
@media(min-width:761px) and (max-width:1100px){.project-workspace .workspace{padding-top:35px}.tabs-in{padding:0 24px!important}.top-in{padding-left:24px!important;padding-right:24px!important}}
@media(max-width:760px){.project-workspace #header{margin-bottom:20px}.top-in{height:101px;min-height:101px!important;padding:24px 16px 20px!important}.tabs-in{padding:0 16px!important}.project-workspace .project-tabs{gap:20px}.tabs-in .ws-menu-tabs{-webkit-mask-image:none;mask-image:none}.project-workspace .project-tabs a:first-child,.tabs-in .ws-menu-tabs a:first-child{margin-left:0}.project-workspace .project-tabs a:last-child,.tabs-in .ws-menu-tabs a:last-child{margin-right:0}}

.top{position:sticky}.tabs-in>.right2{position:absolute;right:40px;top:116px;height:46px;display:flex;align-items:center}
@media(max-width:1200px){.top:has(.right2:not(:empty)){padding-bottom:42px}.tabs-in>.right2{top:162px;right:24px;height:42px}}
@media(max-width:760px){.tabs-in>.right2{top:147px;right:16px}}

html{scrollbar-gutter:stable}

.project-menu-button{display:none}
@media(max-width:760px){
 .top{position:static!important;top:auto!important;padding-bottom:0!important}
 .top-in{height:auto!important;min-height:0!important;padding:14px 16px!important;gap:8px 12px!important}
 .top-in .back{font-size:12px}.top-in .ph{flex-basis:100%;min-width:0}
 .top-in .ptitle{font-size:21px;line-height:1.3;margin:0}.top-in .psub{font-size:12px;line-height:1.5;margin-top:3px}
 .top-in .sharebtn{padding:6px 10px;font-size:12px;min-height:32px}.top-in .linkbtn{font-size:12px;padding:6px}
 .tabs-in{display:flex!important;flex-direction:column;align-items:stretch!important;padding:0 16px 12px!important;gap:8px!important}
 .tabs-in>.right2{position:static;height:auto;justify-content:flex-end;width:100%}
 .project-workspace #mobileHeader{position:static}.project-workspace .workspace{padding-top:16px}
 .project-workspace #header{height:auto;min-height:0;margin-bottom:16px}
 .project-workspace .project-tabs{margin-bottom:18px}
 [data-budget-section]{scroll-margin-top:16px!important}
 .budget-row{min-height:48px;padding:10px 0;touch-action:manipulation}
 .budget-donut{float:none!important;margin:16px auto!important}.budget-rows{overflow:visible!important}
}

.mobile-share-action{display:none!important}
@media(max-width:760px){
.top-in{display:grid!important;grid-template-columns:minmax(0,1fr) 44px;gap:7px 10px!important;padding:10px 16px 12px!important;align-items:start!important}.top-in>.back{grid-column:1/-1;grid-row:1;order:0!important;margin:0!important;line-height:20px}.top-in>.ph{grid-column:1;grid-row:2;order:0!important;min-width:0;width:100%}.top-in>.more{grid-column:2;grid-row:2;order:0!important;align-self:start;justify-self:end}.top-in .more>.linkbtn{width:44px;height:36px;min-height:36px;font-size:0;border:1px solid var(--line);border-radius:8px;padding:0}.top-in .more>.linkbtn:after{content:'⋯';font-size:23px;line-height:1}.top-in .sharebtn{display:none!important}.top-in>.saved{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.top-in .ptitle{font-size:20px;line-height:1.3}.top-in .psub{font-size:12px;margin-top:3px;overflow-wrap:anywhere}.top-in .mobile-share-action{display:block!important}.top-in .more .menu{max-width:calc(100vw - 32px);min-width:220px}.tabs-in{padding-bottom:10px!important}
}

/* Keep the project title above the full-width history controls on phones. */
@media(max-width:760px){
 .project-workspace #header{flex-wrap:wrap;gap:12px}
 .project-workspace #header .heading{flex:1 1 100%;width:100%}
 .project-workspace #header>.action-history-dock{flex:0 0 100%;width:100%;margin-left:0}
}

/* All project sections stay visible on phones and compact tablet layouts. */
@media(max-width:1100px){
 .project-workspace .project-tabs,.tabs-in .ws-menu-tabs{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px;height:auto;overflow:visible;white-space:normal;padding:0 0 12px;margin:0 0 18px;border-bottom:1px solid var(--line,#dee2e8)}
 .tabs-in .ws-menu-tabs{margin-bottom:0}
 .project-workspace .project-tabs a,.tabs-in .ws-menu-tabs a{display:flex!important;flex:0 0 auto;align-items:center;justify-content:center;min-height:44px;margin:0!important;padding:8px 8px;border:1px solid var(--line,#dee2e8);border-radius:8px;background:var(--card,#fff);color:var(--mut,#69717c);font:500 12px/18px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;white-space:nowrap;text-decoration:none}
 .project-workspace .project-tabs a.active,.tabs-in .ws-menu-tabs a.on{background:var(--chip,#f2f3f6);border-color:#9aa2ad;color:var(--ink,#1a1d21)}
 .project-workspace .project-tabs a:focus-visible,.tabs-in .ws-menu-tabs a:focus-visible{outline:2px solid var(--ink,#1a1d21);outline-offset:2px}
}

/* A distinct navigation surface, shared by every project section. */
.project-workspace .project-tabs,.ws-menu-tabs{
 width:max-content;max-width:100%;height:auto;min-height:52px;
 margin:0 auto 20px;padding:4px;gap:4px;align-items:center;
 background:#2b2e33;border:1px solid #2b2e33;border-radius:12px;
 overflow:visible;box-shadow:0 2px 6px #1a1d2110;
}
.ws-menu-tabs{margin-bottom:12px}
.project-workspace .project-tabs a,.ws-menu-tabs a{
 min-height:42px;padding:10px 12px;margin:0!important;
 border:0;border-radius:8px;background:transparent;color:#fff;
 font:500 14px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 text-decoration:none;white-space:nowrap;
}
.project-workspace .project-tabs a:hover,.ws-menu-tabs a:hover{background:#41454b;color:#fff}
.project-workspace .project-tabs a.active,.ws-menu-tabs a.on{
 background:#fff;color:#1a1d21;border:0;font-weight:600;box-shadow:0 1px 3px #0002;
}
.project-workspace .project-tabs a:focus-visible,.ws-menu-tabs a:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.project-workspace .project-tabs a.active:focus-visible,.ws-menu-tabs a.on:focus-visible{outline-color:#1a1d21}
.tabs-in{flex-wrap:wrap!important;gap:8px 24px!important}
.ws-menu-tabs{flex:none}
.tabs-in>.right2{position:static;height:52px;flex:none;margin-left:auto}
@media(max-width:1200px){.top:has(.right2:not(:empty)){padding-bottom:0}}
@media(max-width:1100px){
 .project-workspace .project-tabs,.ws-menu-tabs{flex-wrap:wrap;justify-content:center}
}
@media(max-width:760px){
 .project-workspace .project-tabs,.ws-menu-tabs{width:100%;margin-left:0;margin-right:0;padding:6px;gap:4px;justify-content:flex-start}
 .project-workspace .project-tabs a,.ws-menu-tabs a{min-height:44px;padding:8px;font-size:12px;line-height:18px}
 .ws-menu-tabs{margin-bottom:0}
 .tabs-in>.right2{height:auto}
}

/* Shared content edges and deliberate spacing across all project sections. */
:root{--project-edge:40px}
#main.wrap{padding-left:var(--project-edge);padding-right:var(--project-edge)}
.project-workspace .project-tabs,.ws-menu-tabs,.tabs-in .ws-menu-tabs{
 display:flex;flex-wrap:wrap;width:100%;max-width:100%;min-width:0;height:auto;
 flex:1 1 100%;margin:0 0 20px;padding:8px;gap:8px;
 align-items:stretch;justify-content:flex-start;box-sizing:border-box;
}
.project-workspace .project-tabs a,.ws-menu-tabs a,.tabs-in .ws-menu-tabs a{
 display:flex;flex:1 1 auto;align-items:center;justify-content:center;
 margin:0!important;min-height:44px;padding:12px 16px;
 border:0;border-radius:8px;background:transparent;color:#fff;line-height:20px;
}
.project-workspace .project-tabs a.active,.ws-menu-tabs a.on,.tabs-in .ws-menu-tabs a.on{
 border:0;border-radius:8px;background:#fff;color:#1a1d21;
}
.tabs-in .ws-menu-tabs{margin-bottom:0}
.tabs-in>.right2{height:auto;min-height:40px;margin-bottom:12px}
@media(min-width:761px) and (max-width:1100px){:root{--project-edge:24px}}
@media(max-width:760px){
 :root{--project-edge:16px}
 .project-workspace .project-tabs,.ws-menu-tabs,.tabs-in .ws-menu-tabs{padding:6px;gap:6px}
 .project-workspace .project-tabs a,.ws-menu-tabs a,.tabs-in .ws-menu-tabs a{
  flex:1 1 auto;padding:10px 8px;font-size:12px;line-height:18px;
 }
 .tabs-in>.right2{margin-bottom:0}
}

/* Compact title and navigation share the existing content edges. */
@media(min-width:761px){
 .top-in{height:auto;min-height:64px!important;padding:10px var(--project-edge) 10px!important}
 .project-workspace .workspace{padding-top:20px}
 .project-workspace #header{height:auto;min-height:44px;margin-bottom:12px}
 .project-workspace .project-tabs,.ws-menu-tabs,.tabs-in .ws-menu-tabs{min-height:0;padding:5px;gap:6px;border-radius:10px}
 .project-workspace .project-tabs a,.ws-menu-tabs a,.tabs-in .ws-menu-tabs a{min-height:32px;padding:6px 12px}
 .project-workspace .project-tabs{margin-bottom:12px}
}
@media(min-width:761px) and (pointer:coarse){
 .project-workspace .project-tabs a,.ws-menu-tabs a,.tabs-in .ws-menu-tabs a{min-height:44px}
}

/* A small persistent arrow replaces the fully hidden desktop sidebar. */
.sidebar-toggle{display:none}
.sidebar-toggle[hidden]{display:none!important}
@media(min-width:761px){
 html.v-sidebar-managed{--main-sidebar-width:216px}
 .sidebar-toggle{display:flex;align-items:center;justify-content:center;position:fixed;left:calc(var(--main-sidebar-width) - 30px);top:25px;width:24px;height:64px;min-height:64px;padding:0;border:1px solid #d6232e;border-radius:7px;background:#d6232e;color:#fff;z-index:46;cursor:pointer;font:inherit}
 body.demo-shell .sidebar-toggle{top:81px}
 .sidebar-toggle:hover{color:#fff;border-color:#b71b25;background:#b71b25}
 .sidebar-toggle:focus-visible{outline:2px solid var(--ink,#1a1d21);outline-offset:2px}
 .sidebar-toggle svg{display:block;width:18px;height:22px;flex:none;pointer-events:none}
 html.v-sidebar-collapsed :is(.sidebar,.ws-sidebar){transform:translateX(-100%);pointer-events:none}
 html.v-sidebar-collapsed.v-sidebar-legacy body{padding-left:0!important}
 html.v-sidebar-collapsed .workspace{margin-left:0!important}
 html.v-sidebar-collapsed .sidebar-toggle{left:0}
 html.v-sidebar-collapsed .sidebar-toggle svg{transform:rotate(180deg)}
}
@media(min-width:761px) and (max-width:1100px){html.v-sidebar-managed{--main-sidebar-width:190px}}

/* The legacy sheet keeps four desktop roles; measured table fonts stay intact. */
@media(min-width:761px){
 html.v-sidebar-legacy body{font-size:12.5px}
 html.v-sidebar-legacy :is(.ws-sidebar,.ws-sidebar a,.ws-tariff-title strong,.ws-menu-tabs a,.top-in button,.top-in .back,.action-history,.action-history button,.action-history-message,.filterbar,.filterbar input,.filterbar select,.filterbar .freset,.filterbar .fcount,.section-count,.sec-tot){font-size:12.5px}
 html.v-sidebar-legacy #main :is(.strip-view button,.quote-add-title,.quote-methods button,.quote-methods a,.quote-progress,.quote-link-hint,.quote-error,.addbar input,.addbar select,.sec-h .addpos,.section-order-toolbar button,.budget-panel,.budget-panel summary,.budget-center strong,.budget-row-title){font-size:12.5px}
 html.v-sidebar-legacy :is(.ws-tariff-title span,.ws-tariff-metric>div,.ws-sidebar-bottom small,.psub,.saved,.mode-chip,.viewchip){font-size:11.5px}
 html.v-sidebar-legacy #main :is(.strip .stat .l,.strip .stat .v small,.budget-center span,.budget-row-values,.budget-note){font-size:11.5px}
 html.v-sidebar-legacy .ws-sidebar a.ws-logo{font-size:20px}
}

@media(max-width:760px){
 html.v-sidebar-legacy body{font-size:12.5px}
 html.v-sidebar-legacy :is(.top-in button,.action-history,.action-history button,.action-history-message,.quote-add-title,.quote-methods button,.quote-methods a,.quote-progress,.quote-link-hint,.quote-error,.addbar input,.addbar select,.section-order-toolbar button,.sec-h .addpos,.budget-panel summary,.filterbar,.filterbar input,.filterbar select,.filterbar .freset,.filterbar .fcount){font-size:12.5px}
 html.v-sidebar-legacy :is(.psub,.saved,.mode-chip,.viewchip,.strip .stat .l,.strip .stat .v small,.budget-center span,.budget-row-values,.budget-note){font-size:11.5px}
 html.v-sidebar-legacy .compact-item :is(.isub,.comm,.supl,.room-chip,.room-summary,.room-summary-button,.reserve-line,.chip,.lead-value,.order-dates,.eta-cell,.attention-reasons){font-size:11.5px}
 html.v-sidebar-legacy .compact-item :is(.title,.num,.price,.sum,.cost-value){font-size:12.5px}
 html.v-sidebar-legacy .top-in .back,
 html.v-sidebar-legacy .tabs-in .tab,
 html.v-sidebar-legacy #main .strip-view button,
 html.v-sidebar-legacy .ws-mobile-profile,
 html.v-sidebar-legacy #main .budget-center strong{font-size:12.5px}
}

/* The demo notice uses the same caption role as its surrounding shell. */
body.demo-shell #demo-banner{font-size:12px}
html.v-sidebar-legacy body.demo-shell #demo-banner{font-size:11.5px}

/* Drag instructions use the same compact caption scale on every screen. */
.drag-hint{margin:6px 0 12px;padding:0;color:var(--muted,var(--mut,#747d89));font:400 12px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:left;overflow-wrap:anywhere}
.drag-hint-touch{display:none}
html.v-sidebar-legacy #main>.drag-hint,#boardDragHint,#calendarDragHint{font-size:11.5px}
.filters+.drag-hint{margin-left:40px;margin-right:40px}
@media(max-width:1100px){.filters+.drag-hint{margin-left:24px;margin-right:24px}}
@media(max-width:760px),(hover:none),(pointer:coarse){.drag-hint-mouse{display:none}.drag-hint-touch{display:inline}}
@media(max-width:760px){.filters+.drag-hint{margin-left:16px;margin-right:16px}}
@media print{.drag-hint{display:none}}

/* Tablet tabs keep their natural width and position when the active page changes. */
@media(min-width:761px) and (max-width:1366px){
 .project-workspace .project-tabs,.tabs-in .ws-menu-tabs{justify-content:flex-start;gap:6px}
 html.v-sidebar-managed :is(.project-workspace .project-tabs,.tabs-in .ws-menu-tabs) a{
  flex:0 0 auto;font:500 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 }
 html.v-sidebar-managed :is(.project-workspace .project-tabs,.tabs-in .ws-menu-tabs) a:is(.active,.on){font-weight:500}
}

/* In the client portal, wrapped tabs retain their width and stay together. */
@media(max-width:1100px){
 #nav.ws-menu-tabs{justify-content:flex-start;align-content:flex-start}
 #nav.ws-menu-tabs a{flex:0 0 auto;min-height:44px;padding:8px;font:500 12px/18px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
 #nav.ws-menu-tabs a[aria-current="page"]{font-weight:500}
}

/* Project navigation stays left aligned even before the sidebar script runs. */
@media(max-width:1366px){
 .project-workspace #projectTabs.project-tabs,.tabs-in .ws-menu-tabs{
  justify-content:flex-start;align-content:flex-start;gap:4px;
 }
 .project-workspace #projectTabs.project-tabs a,.tabs-in .ws-menu-tabs a{
  flex:0 0 auto;min-height:44px;padding:8px 9px;
  font:500 12px/18px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 }
 .project-workspace #projectTabs.project-tabs a.active,.tabs-in .ws-menu-tabs a.on{font-weight:500}
 html.v-sidebar-managed :is(.project-workspace .project-tabs,.tabs-in .ws-menu-tabs) a{
  flex:0 0 auto;padding:8px 9px;
  font:500 12px/18px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 }
}
/* In narrow iPad portrait view, keep Journal and Checklist together at the left. */
@media(min-width:761px) and (max-width:880px){
 html:not(.v-sidebar-collapsed) body.project-workspace #projectTabs.project-tabs,
 html:not(.v-sidebar-collapsed) .tabs-in .ws-menu-tabs{
  display:grid;grid-template-columns:repeat(5,max-content);grid-auto-rows:minmax(44px,auto);
  justify-content:start;justify-items:stretch;align-items:stretch;
 }
 html:not(.v-sidebar-collapsed) body.project-workspace #projectTabs.project-tabs a,
 html:not(.v-sidebar-collapsed) .tabs-in .ws-menu-tabs a{justify-content:flex-start}
}

/* Same navigation role across the workspace and legacy procurement screens. */
:root{--project-nav-text:13px;--project-title-text:20px}
html :is(.project-workspace #projectTabs.project-tabs,.tabs-in .ws-menu-tabs) a{font-size:var(--project-nav-text)!important;font-weight:500}
html :is(.project-workspace #projectTabs.project-tabs,.tabs-in .ws-menu-tabs) a:is(.active,.on){font-weight:600}
.project-workspace #header h1,.top-in .ptitle{font-size:var(--project-title-text);line-height:1.3;font-weight:650;letter-spacing:-.02em}
@media(max-width:1100px){:root{--project-nav-text:12px}}
