/* Shared navigation: charcoal glass with pointer and touch driven reflections. */
.office{--sidebar-width:248px;--sidebar-gap:12px;--sidebar-rail:80px;--sidebar-ease:cubic-bezier(.22,.8,.22,1)}
.office>.sidebar{inset:var(--sidebar-gap) auto var(--sidebar-gap) var(--sidebar-gap);width:var(--sidebar-width);height:calc(100dvh - var(--sidebar-gap)*2);display:flex;flex-direction:column;padding:22px 14px 14px;border:1px solid rgba(255,255,255,.13);border-radius:23px;color:#edf0f3;background:radial-gradient(ellipse at 0% 0%,rgba(255,255,255,.065),transparent 52%),linear-gradient(155deg,rgba(28,31,32,.88),rgba(17,20,21,.84));backdrop-filter:blur(36px) saturate(115%);-webkit-backdrop-filter:blur(36px) saturate(115%);box-shadow:0 20px 48px rgba(0,0,0,.25),0 2px 8px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(255,255,255,.035);isolation:isolate;overflow:hidden;transition:width .38s var(--sidebar-ease),border-radius .38s var(--sidebar-ease),padding .38s var(--sidebar-ease),box-shadow .38s,transform .3s var(--sidebar-ease);font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',Arial,sans-serif}
html[data-theme=dark] .office>.sidebar{background:radial-gradient(ellipse at 0% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(160deg,rgba(28,31,32,.83),rgba(17,20,21,.79))}
.office>.stage{--stage-offset:calc(var(--sidebar-width) + var(--sidebar-gap)*2);width:calc(100% - var(--stage-offset));margin-left:var(--stage-offset);transition:margin-left .38s var(--sidebar-ease),width .38s var(--sidebar-ease)}
.office>.sidebar::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(280px circle at var(--glass-x,30%) var(--glass-y,15%),rgba(244,249,255,.075),transparent 75%);opacity:0;transition:opacity .4s}
.office>.sidebar[data-glass-hover=true]::before{opacity:1}
.office>.sidebar::after{content:"";position:absolute;inset:1px;z-index:0;border:1px solid rgba(255,255,255,.025);border-radius:21px;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.035),transparent 20%,transparent 80%,rgba(255,255,255,.015))}
.sidebar-heading{flex-shrink:0;padding:0 5px 22px;margin-bottom:17px}
.sidebar-heading>.brand{display:flex;align-items:center;gap:10px;padding:0;margin:0;min-height:40px;white-space:nowrap}
.sidebar .brand-mark{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:13px;border:1px solid rgba(255,255,255,.75);background:linear-gradient(145deg,#fff,#e8ebf1);box-shadow:0 4px 12px rgba(0,0,0,.13),inset 0 1px 1px white}
.sidebar .brand-mark img{filter:none;width:82%;height:82%}
.sidebar .brand-wordmark{width:136px;max-width:none;transition:opacity .16s,transform .3s}
.sidebar-toggle{position:absolute;top:83px;right:17px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(255,255,255,.23);border-radius:50%;color:#edf0f6;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.035));box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 6px rgba(0,0,0,.08);cursor:pointer;transition:background .2s,top .38s var(--sidebar-ease),right .38s var(--sidebar-ease)}
.sidebar-toggle svg{width:19px;height:19px;transition:transform .35s var(--sidebar-ease)}
.sidebar-toggle:hover{background:rgba(255,255,255,.22)}
.sidebar>.nav-caption{height:34px;line-height:34px;margin:0 46px 15px 13px;font-size:9px;letter-spacing:.16em;font-weight:500;color:#919b9e;white-space:nowrap;transition:opacity .16s}
.sidebar>nav{display:grid;gap:5px;align-content:start;min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;padding:3px 2px 10px;margin:0 -2px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.sidebar .nav-item{position:relative;isolation:isolate;display:flex;align-items:center;gap:11px;min-height:49px;width:100%;margin:0;padding:7px 10px;border:1px solid transparent;border-radius:12px;color:#aeb4b6;font-size:13px;line-height:1.35;font-weight:400;letter-spacing:-.1px;white-space:nowrap;text-align:left;background:transparent;box-shadow:none;transform:none;transition:background .22s,border-color .22s,box-shadow .22s,color .22s,transform .22s}
.sidebar .nav-item::before,.sidebar .profile::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(130px circle at var(--glass-x,50%) var(--glass-y,50%),rgba(255,255,255,.17),transparent 80%);opacity:0;transition:opacity .22s;z-index:-1}
.sidebar .nav-item:hover,.sidebar .profile:hover{color:#fff;border-color:rgba(255,255,255,.07);background:rgba(255,255,255,.045);box-shadow:none}
.sidebar .nav-item:hover::before,.sidebar .profile:hover::before{opacity:1}
 .sidebar .nav-item.selected,.sidebar .nav-item[aria-current=page]{color:#fff;font-weight:500;border-color:transparent;background:rgba(255,255,255,.035);box-shadow:none}
.sidebar .nav-item.selected::after{display:none}
.sidebar .nav-glyph{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;border:0;border-radius:0;color:#aeb4b6;background:transparent;box-shadow:none;transition:color .22s,filter .22s}
.sidebar .nav-glyph svg{display:block;width:19px;height:19px;stroke-width:1.6}
.sidebar .nav-item:hover .nav-glyph,.sidebar .nav-item.selected .nav-glyph{color:#fff;background:transparent;box-shadow:none;filter:drop-shadow(0 1px 2px rgba(255,255,255,.12))}
.sidebar .nav-item.selected .nav-glyph svg rect{fill:currentColor;stroke-width:1}
.sidebar .nav-item>span:last-child{padding-right:10px;min-width:0;transition:opacity .16s,transform .3s var(--sidebar-ease)}
.sidebar>.sidebar-bottom{flex-shrink:0;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06);display:grid;gap:10px}
.sidebar .profile{position:relative;isolation:isolate;display:flex;align-items:center;min-height:62px;padding:10px;gap:10px;border:1px solid rgba(255,255,255,.045);border-radius:15px;background:rgba(0,0,0,.17);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);color:#fff;transition:background .22s,border-color .22s,box-shadow .22s,transform .22s}
.sidebar .profile>.avatar{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:linear-gradient(145deg,#43494b,#252b2d);border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 1px rgba(255,255,255,.12);color:white;font-size:11px;font-weight:500}
.sidebar .profile>span:nth-child(2){min-width:0;flex:1;transition:opacity .16s,transform .3s var(--sidebar-ease)}
.sidebar .profile strong{font-size:12px;font-weight:500;line-height:1.4;overflow-wrap:anywhere}.sidebar .profile small{font-size:10px;line-height:1.4;color:#929b9e;margin-top:3px}
.sidebar .profile>svg{width:15px;height:15px;flex-shrink:0;color:#d9dfeb;transition:opacity .16s,transform .3s var(--sidebar-ease)}
.sidebar :is(.nav-item,.profile,.sidebar-toggle):focus-visible{outline:2px solid #e8efff;outline-offset:3px}.sidebar :is(.nav-item,.profile,.sidebar-toggle):active{transform:scale(.975)}
/* A moving light through the glass, with a soft specular edge around each control. */
.office>.sidebar{border-color:rgba(255,255,255,.21);backdrop-filter:blur(40px) saturate(145%);-webkit-backdrop-filter:blur(40px) saturate(145%)}
.office>.sidebar::before{background:radial-gradient(170px circle at var(--glass-x,30%) var(--glass-y,15%),rgba(245,250,255,.19),rgba(225,236,255,.045) 48%,transparent 78%)}
.office>.sidebar::after{border-color:rgba(255,255,255,.085);background:radial-gradient(210px circle at var(--glass-x,30%) var(--glass-y,15%),rgba(255,255,255,.09),transparent 75%),linear-gradient(125deg,rgba(255,255,255,.09),transparent 22%,transparent 78%,rgba(255,255,255,.04));box-shadow:inset 1px 1px 1px rgba(255,255,255,.12),inset -1px -1px 1px rgba(255,255,255,.04)}
.sidebar :is(.nav-item,.profile,.sidebar-toggle){-webkit-tap-highlight-color:transparent;transition:background .22s,border-color .22s,box-shadow .22s,color .22s,transform .32s cubic-bezier(.2,.9,.25,1.25)}
.sidebar .sidebar-toggle{transition:background .22s,border-color .22s,box-shadow .22s,transform .32s cubic-bezier(.2,.9,.25,1.25),top .38s var(--sidebar-ease),right .38s var(--sidebar-ease)}
.sidebar :is(.nav-item,.profile)::before{background:radial-gradient(90px circle at var(--glass-x,50%) var(--glass-y,50%),rgba(255,255,255,.25),rgba(255,255,255,.05) 52%,transparent 85%)}
.sidebar :is(.nav-item,.profile,.sidebar-toggle)[data-glass-active=true]{color:#fff;border-color:rgba(255,255,255,.24);background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.035));box-shadow:inset 0 1px 1px rgba(255,255,255,.28),inset 0 -1px 1px rgba(255,255,255,.07),0 5px 14px rgba(0,0,0,.13);transform:scale(1.025)}
.sidebar :is(.nav-item,.profile)[data-glass-active=true]::before{opacity:1}
.sidebar :is(.nav-item,.profile,.sidebar-toggle)[data-glass-pressed=true]{transform:scale(.96);box-shadow:inset 0 1px 2px rgba(255,255,255,.32),0 2px 8px rgba(0,0,0,.1)}
.sidebar .nav-item[data-glass-active=true] .nav-glyph{color:#fff;filter:drop-shadow(0 0 5px rgba(255,255,255,.24))}
.sidebar .nav-item.selected{border-color:rgba(255,255,255,.1);background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));box-shadow:inset 0 1px 1px rgba(255,255,255,.1)}
@media(prefers-reduced-motion:reduce){.sidebar :is(.nav-item,.profile,.sidebar-toggle)[data-glass-active=true],.sidebar :is(.nav-item,.profile,.sidebar-toggle)[data-glass-pressed=true]{transform:none}}
@media(min-width:801px){
 .office[data-sidebar-collapsed=true]>.stage{--stage-offset:calc(var(--sidebar-rail) + var(--sidebar-gap)*2)}
 /* Reclaim the whole work area; hover expansion stays above the content. */
 .office[data-sidebar-collapsed=true]>.stage{--workspace-frame-width:100%}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true])>.sidebar{width:var(--sidebar-rail);padding-inline:10px;border-radius:23px}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .sidebar-heading{padding-inline:10px;padding-bottom:16px;margin-bottom:66px}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) :is(.brand-wordmark,.nav-caption,.nav-item>span:last-child,.profile>span:nth-child(2),.profile>svg){opacity:0;pointer-events:none;position:absolute;transform:translateX(-6px)}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .nav-caption{height:0;margin:0;overflow:hidden}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .sidebar-toggle{top:82px;right:22px}
 .office[data-sidebar-collapsed=true] .sidebar-toggle svg{transform:rotate(180deg)}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .nav-item{justify-content:center;width:58px;padding:7px 0;gap:0;border-radius:12px}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .nav-item.selected::after{display:none}
 .office[data-sidebar-collapsed=true]:not([data-sidebar-peek=true]) .profile{justify-content:center;width:58px;min-height:58px;padding:7px 0;gap:0}
 .office[data-sidebar-collapsed=true][data-sidebar-peek=true]>.sidebar{box-shadow:0 24px 60px rgba(0,0,0,.33),0 4px 12px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.14)}
}
@media(min-width:801px) and (max-width:1150px){.office{--sidebar-width:220px}.sidebar .brand-wordmark{width:116px}.sidebar-heading{padding-inline:0}.sidebar-heading>.brand{gap:8px}.sidebar .nav-item{font-size:12px;gap:9px}}
/* Mobile navigation is a named modal drawer, with independent menu scrolling. */
.sidebar-close,.sidebar-mobile-context{display:none}
@media(max-width:800px){
 .office{--sidebar-width:100vw;--sidebar-gap:0px}
 .office>.sidebar{
  inset:0;width:100%;max-width:none;height:100dvh;
  padding:calc(env(safe-area-inset-top,0px) + 14px) calc(env(safe-area-inset-right,0px) + 16px) calc(env(safe-area-inset-bottom,0px) + 12px) calc(env(safe-area-inset-left,0px) + 16px);
  border:0;border-radius:0;z-index:121;
  background:linear-gradient(155deg,rgba(37,42,44,.98),rgba(21,25,27,.97));
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  transform:translateX(-100%);
 }
 .office>.sidebar::after{inset:0;border:0;border-radius:0}
 html[data-theme=dark] .office>.sidebar{background:linear-gradient(155deg,rgba(33,38,40,.98),rgba(18,22,24,.97))}
 .office.nav-open>.sidebar{transform:translateX(0)}
 .office>.stage{--stage-offset:0px;width:100%;margin-left:0}
 .sidebar-toggle,.sidebar>.nav-caption{display:none}
 .sidebar-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 2px 14px;margin:0;border-bottom:1px solid rgba(255,255,255,.10)}
 .sidebar-heading>.brand{flex:1;min-width:0;min-height:44px;gap:8px;margin:0}
 .sidebar .brand-mark{width:34px;height:34px;flex-basis:34px;border-radius:11px}
 .sidebar .brand-wordmark{width:132px;max-width:calc(100% - 42px);height:auto;object-fit:contain}
 .sidebar-close{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:10px;border:1px solid rgba(255,255,255,.24);border-radius:50%;color:#fff;background:rgba(255,255,255,.08);cursor:pointer;touch-action:manipulation}
 .sidebar-close>svg{width:22px;height:22px}
 .sidebar-close:focus-visible{outline:2px solid #fff;outline-offset:2px}
 .sidebar>nav{min-height:0;gap:4px;margin:0 -2px;padding:12px 2px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-padding-block:8px}
 .sidebar .nav-item{min-height:50px;gap:10px;padding:10px 12px;font-size:15px;line-height:1.4;color:#d3dadd;white-space:normal;overflow-wrap:anywhere;border-radius:13px;touch-action:manipulation}
 .sidebar .nav-item>span:last-child{padding-right:0}
 .sidebar .nav-glyph{width:28px;height:28px;flex-basis:28px;color:inherit}
 .sidebar .nav-glyph svg{width:21px;height:21px}
 .sidebar .nav-item.selected,.sidebar .nav-item[aria-current=page]{color:#fff;background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);box-shadow:inset 3px 0 #ef5362}
 .sidebar :is(.nav-item,.profile)[data-glass-active=true],.sidebar :is(.nav-item,.profile)[data-glass-pressed=true]{transform:none}
 .sidebar>.sidebar-bottom{gap:6px;margin-top:0;padding-top:10px;border-color:rgba(255,255,255,.12)}
 .sidebar .profile{min-height:64px;gap:10px;padding:10px 12px;border-color:rgba(255,255,255,.14)}
 .sidebar .profile strong{font-size:14px;line-height:1.4}
 .sidebar .profile small{font-size:12px;line-height:1.4;color:#b9c3c7}
 .sidebar .profile>.avatar{width:38px;height:38px;flex-basis:38px;font-size:12px}
 .sidebar .profile>svg{width:18px;height:18px}
 .sidebar-mobile-context{display:block;margin-bottom:6px;min-width:0}
 .office .sidebar-mobile-context .department-switcher{display:block;width:100%;min-width:0;max-width:none}
 .office .sidebar-mobile-context summary.department{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;min-height:58px;width:100%;min-width:0;max-width:none;margin:0;padding:10px 12px;border:1px solid rgba(255,255,255,.16);border-radius:13px;background:rgba(255,255,255,.055);color:#fff;cursor:pointer;list-style:none}
 .office .sidebar-mobile-context summary::-webkit-details-marker{display:none}
 .office .sidebar-mobile-context summary>span{min-width:0;letter-spacing:normal;text-transform:none;color:inherit;font-weight:400}
 .office .sidebar-mobile-context summary small{display:block;font-size:11px;line-height:1.4;color:#b9c3c7}
 .office .sidebar-mobile-context summary strong{display:block;font-size:15px;line-height:1.4;font-weight:500;white-space:normal}
 .office .sidebar-mobile-context summary>svg{width:18px;height:18px;flex-shrink:0}
 .office .sidebar-mobile-context .department-menu{position:static;display:grid;gap:4px;inset:auto;width:100%;min-width:0;max-width:none;max-height:none;overflow:visible;margin:6px 0 0;padding:5px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:#1c2225;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none}
 .office .sidebar-mobile-context details:not([open])>.department-menu{display:none}
 .office .sidebar-mobile-context .department-menu-label{padding:8px;color:#b9c3c7;font-size:11px;letter-spacing:normal;text-transform:none}
 .office .sidebar-mobile-context .department-menu button{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 8px;border:1px solid transparent;border-radius:10px;background:transparent;color:#d3dadd;text-align:left;font-size:14px;white-space:normal;cursor:pointer}
 .office .sidebar-mobile-context .department-menu button.selected{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(255,255,255,.16)}
 .office .sidebar-mobile-context .department-menu-icon{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;color:inherit;background:transparent;border:0}
 .office .sidebar-mobile-context .department-menu svg{width:20px;height:20px;flex-shrink:0}
 .office .sidebar-mobile-context .department-menu-copy{min-width:0;flex:1}
 .office .sidebar-mobile-context .department-menu-copy strong{font-size:14px;font-weight:500;line-height:1.4;color:inherit;white-space:normal}
 .office .sidebar-mobile-context .department-menu-copy small{display:none}
 .office .sidebar-mobile-context :is(summary,button):focus-visible,.sidebar :is(.nav-item,.profile):focus-visible{outline:2px solid #fff;outline-offset:-3px}
 .office.nav-open>.scrim{z-index:120;background:rgba(5,10,16,.44);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);touch-action:none}
 .office.is-preview>.sidebar{top:0}
}
@media(max-width:800px) and (max-height:500px){
 .office>.sidebar{padding-block:calc(env(safe-area-inset-top,0px) + 8px) calc(env(safe-area-inset-bottom,0px) + 8px)}
 .sidebar-heading{padding-bottom:6px}
 .sidebar>nav{padding-block:6px}
 .sidebar>.sidebar-bottom{padding-top:6px;gap:4px}
 .sidebar .profile{min-height:52px;padding-block:6px}
 .sidebar .profile small{display:none}
}
@media(prefers-reduced-motion:reduce){.office>.sidebar,.office>.stage,.sidebar *,.sidebar *::before,.sidebar::before{transition:none!important;animation:none!important}.sidebar :is(.nav-item,.profile,.sidebar-toggle):active{transform:none}.office>.sidebar::before{display:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.office>.sidebar{background:linear-gradient(155deg,#25292a,#171b1c)}}
@media(forced-colors:active){.office>.sidebar{background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none}.office>.sidebar::before,.office>.sidebar::after,.sidebar .nav-item::before,.sidebar .profile::before{display:none}.sidebar :is(.nav-item,.profile,.sidebar-toggle,.sidebar-close,.nav-glyph),.sidebar-mobile-context :is(summary,button){color:ButtonText;background:ButtonFace;border-color:ButtonText;box-shadow:none}.sidebar .nav-item.selected{outline:2px solid Highlight}.sidebar .nav-item.selected .nav-glyph{color:HighlightText;background:Highlight}.sidebar .brand-mark img{filter:none}}

/* Page content and the header share one frame and one horizontal gutter. */
.office>.stage{--workspace-frame-width:100%;min-width:0}
.office>.stage>.topbar{width:calc(min(var(--workspace-frame-width),100%) - var(--header-gutter)*2)}
.office>.stage>.content,.office.is-estimation-dashboard>.stage>.content{box-sizing:border-box;width:min(var(--workspace-frame-width),100%);max-width:none;margin-inline:auto;padding-inline:var(--header-gutter);min-width:0}