/* One navigation surface for work, conversations and account. */
.cs-unified .cs-panel {margin-left:0;padding:16px;height:100%;}
.cs-unified .cs-heading {padding-right:32px;gap:8px;margin-bottom:16px;}
.cs-unified .cs-heading strong {font-size:14px;}
.cs-unified .cs-brand {width:40px;min-width:40px;}
.cs-unified .cs-brand img {width:40px;}
html.conversation-design body #app .cs-unified .cs-expand {display:flex!important;top:16px;left:auto;right:8px;min-width:32px;width:32px;border-radius:8px;}
.cs-unified-nav {display:flex;flex-direction:column;padding:4px 0 16px;border-bottom:1px solid var(--cs-edge);}
.cs-unified-nav button {display:flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:var(--cs-ink);font-family:inherit;font-size:12px;text-align:left;cursor:pointer;}
.cs-unified-nav button.is-active {background:var(--cs-canvas);font-weight:500;}
.cs-unified .cs-scroll {padding-top:20px;}
.cs-unified-account {display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--cs-edge);padding-top:8px;flex-shrink:0;}
.cs-unified-account .cs-rail-button {justify-content:flex-start;gap:8px;padding:0 12px;font-size:13px;border-radius:8px;color:var(--cs-ink);}
.cs-unified-account .cs-avatar {padding:8px;min-height:56px;}
.cs-unified-account .cs-avatar>span {display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;}
.cs-unified-account strong {font-size:12px;font-weight:500;}.cs-unified-account small {font-size:11px;color:var(--cs-muted);}
@media(hover:hover){.cs-unified-nav button:hover {background:var(--cs-canvas);}}
.cs-unified-nav button:active {transform:scale(.97);}
@media(min-width:721px){
 .cs-collapsed .cs-unified .cs-panel {display:flex!important;padding:16px 8px;}
 .cs-collapsed .cs-unified .cs-heading {padding:0;margin-bottom:56px;}
 .cs-collapsed .cs-unified .cs-heading>strong,.cs-collapsed .cs-unified .cs-heading>[data-cs="search"],.cs-collapsed .cs-unified .cs-new,.cs-collapsed .cs-unified .cs-search,.cs-collapsed .cs-unified .cs-scroll {display:none!important;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-expand {top:64px;right:8px;width:40px;}
 .cs-collapsed .cs-unified .cs-today {margin:0;}
 .cs-collapsed .cs-unified .cs-today,.cs-collapsed .cs-unified-nav button {padding:0;justify-content:center;}
 .cs-collapsed .cs-unified .cs-today span,.cs-collapsed .cs-unified .cs-today small,.cs-collapsed .cs-unified-nav span,.cs-collapsed .cs-unified-account span {display:none;}
 .cs-collapsed .cs-unified-nav {border:0;}
 .cs-collapsed .cs-unified-account {margin-top:auto;border:0;}
 .cs-collapsed .cs-unified-account .cs-rail-button {padding:0;justify-content:center;}
 html.conversation-design:not(.cs-collapsed) body #app .sidebar .account-center {left:268px!important;bottom:16px!important;}
}
/* Reference 2: restrained navy material, small type and clear grouping. */
.cs-unified {--nav-ink:#465269;--nav-muted:#929baa;--nav-blue:#2867eb;--nav-selected:#edf3ff;--nav-button-top:#22364d;--nav-button-bottom:#101c32;--nav-button-edge:#415b83;--nav-button-shadow:0 4px 10px rgb(23 43 78 / 12%);}
.cs-unified .cs-panel {padding:16px 20px;}
.cs-unified .cs-heading {gap:8px;margin-bottom:20px;}
.cs-unified .cs-heading strong {font-size:13px;font-weight:600;}
.cs-unified .cs-new {position:relative;justify-content:center;gap:8px;min-height:40px;height:40px;border-radius:12px;border:1px solid var(--nav-button-edge);background:linear-gradient(150deg,var(--nav-button-top),var(--nav-button-bottom) 65%,#1c2856);color:white;box-shadow:inset 0 1px 1px rgb(255 255 255 / 20%),var(--nav-button-shadow);font-size:12px;font-weight:500;margin-bottom:8px;}
.cs-unified .cs-new span {flex:none;text-align:center;}
.cs-unified .cs-new>svg:last-child {display:block;position:absolute;right:14px;width:13px;opacity:.85;}
.cs-unified .cs-today,.cs-unified-nav button {font-size:12px;font-weight:400;color:var(--nav-ink);line-height:20px;gap:12px;min-height:40px;border-radius:10px;padding:0 12px;}
.cs-unified .cs-today.is-active,.cs-unified-nav button.is-active {background:var(--nav-selected);color:var(--nav-blue);font-weight:500;}
.cs-unified .cs-today small {font-size:10px;color:inherit;opacity:.7;}
.cs-unified .cs-today svg,.cs-unified-nav svg {stroke-width:1.5;flex-shrink:0;}
.cs-unified-nav {gap:4px;padding:4px 0 20px;border-bottom-color:var(--cs-edge);}
.cs-unified .cs-scroll {padding-top:20px;}
.cs-unified .cs-panel h3 {font-size:11px;color:var(--nav-muted);margin:0 10px 6px;letter-spacing:0;}
.cs-unified .cs-thread-open {font-size:12px;line-height:20px;padding:8px 10px;color:var(--nav-ink);font-weight:400;}
.cs-unified .cs-history-group {margin-bottom:20px;}
.cs-unified-account .cs-rail-button {font-size:12px;color:var(--nav-ink);}
.cs-unified-account {padding-top:12px;}
.cs-utility-links {display:flex;gap:16px;padding:0 10px;}
.cs-utility-links button {background:none;border:0;padding:0;min-height:40px;font:inherit;font-size:11px;color:var(--nav-muted);cursor:pointer;}
@media(hover:hover){.cs-unified .cs-new:hover {filter:brightness(1.08);}.cs-unified-nav button:not(.is-active):hover {background:var(--cs-canvas);}.cs-utility-links button:hover {color:var(--nav-ink);}}
@media(min-width:721px){.cs-collapsed .cs-unified .cs-utility-links {display:none;}.cs-collapsed .cs-unified .cs-today,.cs-collapsed .cs-unified-nav button {padding:0;}}
.cs-unified .cs-heading {display:grid;grid-template-columns:72px 1fr;gap:12px 10px;padding:0;margin-bottom:20px;min-height:72px;}
.cs-unified .cs-brand {width:72px;min-width:72px;height:44px;}
.cs-unified .cs-brand img {width:72px;max-height:40px;height:auto;}
.cs-product-name {min-width:0;}.cs-unified .cs-product-name strong {font-size:18px;font-weight:600;letter-spacing:2px;color:var(--cs-ink);}
.cs-product-name small {display:block;font-size:10px;line-height:1.6;color:var(--nav-muted);white-space:nowrap;margin-top:5px;letter-spacing:0;}
.cs-unified .cs-heading>[data-cs="search"] {position:absolute;top:86px;right:48px;min-height:32px;}
html.conversation-design body #app .cs-unified .cs-expand {top:86px;}
.cs-unified .cs-heading {padding-bottom:28px;}
.cs-unified .cs-heading {grid-template-columns:48px minmax(0,1fr) 32px 32px;gap:4px;min-height:0;padding:0;margin-bottom:20px;align-items:center;}
.cs-unified .cs-brand {width:48px;min-width:48px;height:40px;}
.cs-unified .cs-brand img {width:48px;max-height:30px;}
.cs-unified .cs-product-name strong {font-size:13px;letter-spacing:0;font-weight:600;white-space:nowrap;}
.cs-unified .cs-heading>[data-cs="search"],html.conversation-design body #app .cs-unified .cs-heading>.cs-expand {position:static!important;min-width:32px;width:32px;min-height:40px;height:40px;margin:0;}
.cs-brand-slogan {grid-column:1/-1;font-size:10px;line-height:16px;color:var(--nav-muted);padding:0 2px;letter-spacing:.3px;}
.cs-unified .cs-heading {grid-template-columns:40px minmax(0,1fr) 32px 32px;column-gap:4px;min-height:44px;margin-bottom:20px;}
.cs-unified .cs-brand {width:40px;min-width:40px;height:40px;}
.cs-unified .cs-brand img {width:40px;max-height:30px;}
.cs-unified .cs-product-name {padding-left:4px;}
.cs-unified .cs-product-name strong {display:block;font-size:13px;line-height:18px;}
.cs-unified .cs-product-name small {font-size:10px;line-height:15px;margin-top:2px;color:var(--nav-muted);}
.cs-unified-nav {gap:0;padding-top:0;padding-bottom:12px;}
.cs-unified .cs-today {margin-top:4px;}
.cs-unified .cs-new {margin-bottom:4px;}
.cs-unified .cs-scroll {padding-top:12px;}
.cs-unified .cs-history-group {margin-bottom:12px;}
.cs-unified .cs-panel h3 {margin-bottom:2px;}
.cs-unified .cs-thread-open {padding-top:6px;padding-bottom:6px;}
.cs-unified-account {gap:0;padding-top:4px;}
.cs-unified .cs-heading {grid-template-columns:minmax(0,1fr) 32px 32px;}
.cs-unified .cs-product-name {padding-left:0;}
/* Keep header controls anchored to the right on every business route. */
html.conversation-design body #app .cs-unified .cs-heading {display:flex!important;align-items:center;width:100%;box-sizing:border-box;gap:0!important;padding:0;}
html.conversation-design body #app .cs-unified .cs-heading .cs-product-name {display:flex;align-items:center;flex:1;min-width:0;height:40px;margin:0 auto 0 0;padding:0;}
html.conversation-design body #app .cs-unified .cs-heading .cs-product-name strong {margin:0;padding:0;font-size:14px;line-height:20px;letter-spacing:0;}
html.conversation-design body #app .cs-unified .cs-heading>[data-cs="search"],
html.conversation-design body #app .cs-unified .cs-heading>.cs-expand {display:flex!important;position:static!important;flex:0 0 40px;width:40px;min-width:40px;height:40px;min-height:40px;padding:0;margin:0;align-items:center;justify-content:center;}
html.conversation-design body #app .cs-unified .cs-heading>button svg {width:18px;height:18px;flex:none;stroke-width:1.5;}
html.conversation-design body #app .cs-unified .cs-heading>[data-cs="search"] svg{transform:translateX(4px);}
html.conversation-design body #app .cs-unified .cs-new{justify-content:flex-start;padding-left:12px;padding-right:40px;gap:12px;}
html.conversation-design body #app .cs-unified .cs-new span{text-align:left;flex:none;}
.cs-unified-account .cs-avatar>span{flex:1;min-width:0;}
.cs-account-chevron{display:flex;align-items:center;justify-content:center;flex:0 0 16px;margin-left:auto;color:var(--nav-muted);}
.cs-account-chevron svg{width:16px;height:16px;stroke-width:1.5;}
@media(min-width:721px){.cs-collapsed .cs-account-chevron{display:none;}}
@media(min-width:721px){
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-scroll,html.conversation-design.cs-collapsed body #app .cs-unified .cs-product-name,html.conversation-design.cs-collapsed body #app .cs-unified .cs-expand,html.conversation-design.cs-collapsed body #app .cs-unified .cs-brand-slogan {display:none!important;}
 .cs-collapsed .cs-unified .cs-heading {display:flex;padding:0;min-height:44px;margin-bottom:24px;}
 .cs-collapsed .cs-unified .cs-brand {width:40px;min-width:40px;}.cs-collapsed .cs-unified .cs-brand img {width:40px;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading>.cs-expand {display:flex!important;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading>[data-cs="search"] {display:none!important;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading {justify-content:center;gap:0!important;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading>.cs-expand {visibility:visible!important;opacity:1!important;transform:none!important;overflow:visible;}
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading>.cs-expand svg {display:block!important;visibility:visible!important;opacity:1!important;}
}

@media(min-width:721px){
 html.conversation-design.cs-collapsed body #app .cs-unified .cs-heading {margin-bottom:16px;}
 html.conversation-design.cs-collapsed body #app .cs-unified-nav {gap:4px;padding:0;}
 html.conversation-design.cs-collapsed body #app .cs-unified-nav>.cs-nav-group>button,
 html.conversation-design.cs-collapsed body #app .cs-unified-account .cs-rail-button {width:40px;height:40px;min-height:40px;margin:0 auto;padding:0;gap:0;justify-content:center;}
 html.conversation-design.cs-collapsed body #app .cs-unified-nav .branch-chevron,
 html.conversation-design.cs-collapsed body #app .cs-unified-nav>.cs-nav-group>button+button {display:none;}
}
