/* Approved sidebar only. Header, page typography and controls retain production styles. */
.app { grid-template-columns:232px minmax(0,1fr); padding:0; }
.app.collapsed { grid-template-columns:64px minmax(0,1fr); }
.app .aside { top:0; height:100vh; height:100dvh; margin:0; border-left:0; border-block:0; border-radius:0 18px 18px 0; overflow:visible; }
.app .aside-top { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px; min-height:64px; flex-shrink:0; }
.app .aside-top::after { left:12px; right:12px; }
.app .aside-top .brand { min-width:0; gap:8px; margin:0; }
.app .aside-top .brand-mark { width:36px; height:36px; }
.app .aside-toggle { position:static; flex:0 0 32px; width:32px; height:32px; border:0; border-radius:9px; background:transparent; color:var(--t2); box-shadow:none; transform:none; transition:background .15s,color .15s; }
.app .aside-toggle:hover { background:var(--accent-hover); color:var(--a); transform:none; }
.app .aside-toggle:focus-visible { outline:2px solid var(--ds-accent); outline-offset:2px; }
.app .aside-toggle svg { width:20px; height:20px; stroke-width:1.7; transform:none; transition:transform var(--dur) var(--ease); }
.app .aside-nav { min-height:0; padding:12px; overflow-x:hidden; overscroll-behavior:contain; }
.app .aside-nav .nav-item { min-height:40px; padding:9px 10px; }
.app .aside-bottom { flex-shrink:0; padding:12px; }
.app.collapsed .aside-top { justify-content:center; padding:12px; }
.app.collapsed .aside-top .brand { margin:0; }
.app.collapsed .aside-toggle { position:static; flex-basis:40px; width:40px; height:40px; background:transparent; color:var(--a); }
.app.collapsed .aside-toggle svg { transform:rotate(180deg); }
.app.collapsed .aside-toggle:hover,.app.collapsed .aside-toggle:focus-visible { background:var(--accent-soft); }
.app.collapsed .aside-nav .nav-item { padding:9px; }
.app.collapsed .aside-nav .nav-icon { width:20px; height:20px; }
.app.collapsed .aside-bottom { padding:12px 6px; }
.app.collapsed .aside-nav :is(#questionsNavCount,#chatNavCount):not([hidden]) { display:inline-flex; }
/* Keep live counts in the DOM; the desktop rail shows presence without a number. */
@media(min-width:769px) {
 /* Layout changes once. The motion helper translates at natural text size. */
 .app { transition:none; }
 .app.aside-moving { overflow-x:clip; }
 .app.aside-moving .aside { background:transparent; box-shadow:none; border-right-color:transparent; isolation:isolate; }
 .aside-motion-surface { position:absolute; inset:0 auto 0 0; pointer-events:none; z-index:-1; }
 .app .aside-nav .nav-icon { flex:0 0 20px; width:20px; height:20px; }
 .app .aside-nav .nav-item { overflow:clip; }
 .app .aside :is(.nav-label,.user-help-l,.user-meta,.brand-l) { white-space:nowrap; }
 .app .aside :is(.user-help,.user-trigger) { position:relative; }
 .app.collapsed .aside .user-help { padding-block:9px; }
 .app .aside .user-trigger { height:53.5px; }
 .app .aside .user-ava { flex:0 0 34px; width:34px; height:34px; }
 .app .aside .nav-item .nav-label,
 .app .aside .user-help-l,
 .app .aside .user-meta {
  display:block; position:absolute; top:50%; transform:translateY(-50%);
  opacity:1; visibility:visible;
  transition:opacity var(--dur-fast) var(--ease),visibility 0s;
 }
 .app .aside .nav-item .nav-label,.app .aside .user-help-l { left:40px; }
 .app .aside .user-meta { left:54px; width:143px; }
 .app.collapsed .aside .user-help-l { left:46px; }
 .app.collapsed .aside .user-meta { left:60px; }
 .app .aside .user-meta :is(.user-name,.user-role) { overflow:hidden; text-overflow:ellipsis; }
 .app.collapsed .aside .nav-item .nav-label,
 .app.collapsed .aside .user-help-l,
 .app.collapsed .aside .user-meta {
  display:block; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity var(--dur-fast) var(--ease),visibility 0s var(--dur-fast);
 }
 .app .aside { top:8px; margin-block:8px; height:calc(100vh - 16px); height:calc(100dvh - 16px); }
 .app.collapsed .aside-top .brand { display:none; }
 .app.collapsed .aside-nav :is(#questionsNavCount,#chatNavCount) {
  position:absolute; right:3px; top:3px; width:7px; min-width:7px; height:7px;
  padding:0; border:0; border-radius:50%; background:var(--ds-accent);
  box-shadow:0 0 0 2px var(--ds-surface); color:transparent;
  overflow:hidden; white-space:nowrap; text-indent:-9999px;
 }
}
.app.collapsed .aside-nav #askNavPlanBadge { display:none; }
.app.collapsed .aside-nav .nav-pill:not([id]) { display:none; }
@media(max-width:768px) {
 .app,.app.collapsed { grid-template-columns:minmax(0,1fr); padding:0; }
 .app .aside,.app.collapsed .aside { width:280px; max-width:88vw; }
 .app .aside-toggle { display:none; }
 /* Desktop collapsed preference must not hide labels in the mobile drawer. */
 .app.collapsed .aside-top { justify-content:flex-start; }
 .app.collapsed .aside .brand-l,.app.collapsed .aside .brand-name,.app.collapsed .aside .brand-sub,.app.collapsed .aside .nav-label,.app.collapsed .aside .user-meta { display:block; }
 .app.collapsed .aside .nav-section { display:block; }
 .app.collapsed .aside-nav .nav-item { justify-content:flex-start; gap:10px; padding:9px 10px; }
 .app.collapsed .aside-nav .nav-pill { position:static; }
 .app.collapsed .aside-nav :is(#askNavPlanBadge,.nav-pill:not([id])):not([hidden]) { display:inline-flex; }
 .app.collapsed .aside-bottom { padding:12px; }
 .app.collapsed .aside .user-trigger { justify-content:flex-start; }
 .app.collapsed .aside .user-help-l { display:block; }
 .app.collapsed .aside .user-menu { left:0; right:0; bottom:100%; width:auto; margin-bottom:8px; }

}
@media(prefers-reduced-motion:reduce) { .app,.app .aside-toggle,.app .aside-toggle svg { transition:none; } }
@media(prefers-reduced-motion:reduce) {
 .app .aside .nav-item .nav-label,.app .aside .user-help-l,.app .aside .user-meta,
 .app.collapsed .aside .nav-item .nav-label,.app.collapsed .aside .user-help-l,.app.collapsed .aside .user-meta { transition:none; }
}
