/* Sidebar presentation. Navigation, profile and appearance hooks stay unchanged. */
:root{--sidebar-width:224px;--sidebar-pad:14px;--sidebar-logo-size:40px}
@media screen{
 .workspace-ui #appSidebar{
  display:flex;flex-direction:column;width:var(--sidebar-width);height:100dvh;padding:24px var(--sidebar-pad) max(16px,env(safe-area-inset-bottom));
  overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  background:var(--bg-alt);border-right:1px solid var(--line);color:var(--text);
 }
 .workspace-ui #appSidebar .brand{display:flex;flex-shrink:0;align-items:center;gap:10px;margin:0;padding:0 8px 24px;border:0;color:var(--text);font-size:var(--ui-body);font-weight:600;letter-spacing:-.025em;line-height:1.3}
 .workspace-ui #appSidebar .brand>span:last-child{min-width:0}
 .workspace-ui #appSidebar .brand small{display:block;margin-top:4px;color:var(--text-2);font-size:var(--ui-caption);font-weight:400;line-height:1.3;letter-spacing:0;white-space:nowrap}
 .workspace-ui #appSidebar .logo{display:grid;place-items:center;flex:none;width:var(--sidebar-logo-size);min-width:var(--sidebar-logo-size);height:var(--sidebar-logo-size);min-height:var(--sidebar-logo-size);padding:9px;border:0;border-radius:var(--radius-input);background:var(--accent);color:var(--on-primary);box-shadow:none}
 .workspace-ui #appSidebar .logo .ui-icon{width:22px;height:22px;margin:0;stroke-width:1.7}
 .workspace-ui #appSidebar .workspace-nav-label{flex-shrink:0;margin:0 0 10px;padding:0 12px;color:var(--text-2);font-size:var(--ui-caption);font-weight:400;letter-spacing:0;text-transform:lowercase}
 .workspace-ui #appSidebar .workspace-nav-label::first-letter{text-transform:uppercase}
 .workspace-ui #appSidebar nav{display:grid;flex:0 0 auto;gap:4px;margin:0;padding:0;overflow:visible}
 .workspace-ui #appSidebar nav button{display:flex;align-items:center;gap:11px;width:100%;min-height:46px;margin:0;padding:11px 12px;border:0;border-radius:var(--radius-input);background:transparent;color:var(--text-2);text-align:left;font-family:var(--font);box-shadow:none;transition:background var(--ui-speed) var(--ui-ease),color var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar nav button span{min-width:0;color:inherit;font-size:var(--ui-small);font-weight:500;line-height:1.4;letter-spacing:-.015em}
 .workspace-ui #appSidebar nav button .ui-icon{width:19px;height:19px;flex:none;margin:0;color:inherit;stroke-width:1.65}
 .workspace-ui #appSidebar nav button:hover{background:color-mix(in srgb,var(--surface) 70%,var(--bg-alt));color:var(--text)}
 .workspace-ui #appSidebar nav button.active{background:var(--surface);color:var(--accent);box-shadow:var(--shadow)}
 .workspace-ui #appSidebar nav button.active span{font-weight:600}
 .workspace-ui #appSidebar nav button.active .ui-icon{color:var(--accent)}
 .workspace-ui #appSidebar>.theme-picker{display:flex;flex-shrink:0;justify-content:stretch;gap:0;margin:auto 0 0;padding:20px 2px 8px;border:0}
 .workspace-ui #appSidebar #themeToggle{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-width:0;width:100%;height:44px;min-height:44px;margin:0;padding:9px 14px;border:0;border-radius:var(--radius-pill);background:var(--surface);color:var(--text);font-family:var(--font);font-size:var(--ui-small);font-weight:500;filter:none;box-shadow:none;transition:background var(--ui-speed) var(--ui-ease),color var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar #themeToggle .ui-icon{width:18px;height:18px;flex:none;margin:0;color:var(--text-2);stroke-width:1.65}
 .workspace-ui #appSidebar #themeToggle:hover{background:var(--surface);color:var(--accent)}
 .workspace-ui #appSidebar #themeToggle:hover .ui-icon{color:var(--accent)}
 .workspace-ui #appSidebar>.sidebar-account{display:grid;grid-template-columns:34px minmax(0,1fr) 44px;align-items:center;flex-shrink:0;gap:7px;margin:0;padding:12px 4px 0;border:0;border-radius:var(--radius-panel);background:transparent;text-align:left}
 .workspace-ui #appSidebar .sidebar-account-avatar{position:relative;display:grid;place-items:center;overflow:hidden;width:34px;height:34px;border:1px solid var(--line);border-radius:var(--radius-input);background:var(--surface);color:var(--text-2)}
 .workspace-ui #appSidebar .sidebar-account-avatar .ui-icon{width:19px;height:19px;margin:0;stroke-width:1.6}
 .workspace-ui #appSidebar .sidebar-account-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .workspace-ui #appSidebar .sidebar-account-info{display:grid;gap:3px;min-width:0}
 .workspace-ui #appSidebar .sidebar-account-info strong{display:block;overflow:hidden;color:var(--text);font-size:var(--ui-small);font-weight:500;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
 .workspace-ui #appSidebar .sidebar-account-info>span{display:flex;align-items:center;gap:4px;color:var(--text-2);font-size:var(--ui-caption);line-height:1.4;letter-spacing:-.02em;white-space:nowrap}
 .workspace-ui #appSidebar .sidebar-account-info i{width:5px;height:5px;flex:none;border-radius:var(--radius-pill);background:var(--ui-status)}
 .workspace-ui #appSidebar .sidebar-account-logout{display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:12px;border:0;border-radius:var(--radius-input);background:transparent;color:var(--text-2)}
 .workspace-ui #appSidebar .sidebar-account-logout .ui-icon{width:18px;height:18px;margin:0;stroke-width:1.6}
 .workspace-ui #appSidebar .sidebar-account-logout:disabled{opacity:.65;cursor:default}
 .workspace-ui #appSidebar :where(button,a):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
 .workspace-ui #appSidebar nav button:active,.workspace-ui #appSidebar #themeToggle:active{transform:scale(.97)}
 :root[data-theme=dark] .workspace-ui #appSidebar .sidebar-account-info i{background:var(--ui-status-dark)}
}
@media screen and (min-width:901px){.workspace-ui main{margin-left:var(--sidebar-width)}}
@media screen and (max-width:900px){
 .workspace-ui #appSidebar{width:min(290px,calc(100vw - 48px));padding:24px 16px max(20px,env(safe-area-inset-bottom))}
 .workspace-ui #appSidebar .brand{padding:0 44px 24px 8px}
 .workspace-ui #appSidebar .mobile-menu-close{top:20px;right:12px;width:44px;height:44px;min-width:44px;min-height:44px;padding:12px;border-radius:var(--radius-input)}
 .workspace-ui #appSidebar nav button{min-height:48px;padding-block:12px}
 .workspace-ui #appSidebar>.sidebar-account{grid-template-columns:36px minmax(0,1fr) 44px}
 .workspace-ui #appSidebar .sidebar-account-avatar{width:36px;height:36px}
}

/* Expand/collapse control shares the section-caption row. */
@media screen{
 .workspace-ui #appSidebar .sidebar-section-row{display:flex;align-items:center;justify-content:space-between;flex:none;gap:4px;min-height:44px;margin-bottom:8px}
 .workspace-ui #appSidebar .sidebar-section-row .workspace-nav-label{flex:1;min-width:0;margin:0;padding-right:0}
 .workspace-ui #appSidebar #sidebarToggle{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:11px;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--text-2)}
 .workspace-ui #appSidebar #sidebarToggle::before{content:'';position:absolute;inset:6px;z-index:-1;border-radius:var(--radius-pill);background:var(--surface);box-shadow:var(--shadow);transition:background var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar #sidebarToggle .ui-icon{width:18px;height:18px;margin:0;stroke-width:1.8}
 .workspace-ui #appSidebar #sidebarToggle:hover{background:transparent;color:var(--accent)}
 .workspace-ui #appSidebar #sidebarToggle:active{transform:scale(.97)}
 .workspace-ui #appSidebar #sidebarToggle[hidden]{display:none}
}
/* Keep row geometry stable while the rail and its labels animate together. */
@media screen and (min-width:901px){
 .workspace-ui #appSidebar{--sidebar-motion:300ms;transition:width var(--sidebar-motion) var(--ui-ease),padding-inline var(--sidebar-motion) var(--ui-ease)}
 .workspace-ui main{transition:margin-left 300ms var(--ui-ease)}
 .workspace-ui #appSidebar .brand{height:64px;min-height:64px;overflow:hidden;transition:padding-inline var(--sidebar-motion) var(--ui-ease)}
 .workspace-ui #appSidebar :is(.brand>span:last-child,.workspace-nav-label,nav button span,#themeStatus,.sidebar-account-info){white-space:nowrap;opacity:1;transition:opacity var(--sidebar-motion) var(--ui-ease)}
 .workspace-ui #appSidebar .brand>span:last-child{flex:none}
 .workspace-ui #appSidebar .sidebar-section-row{position:relative;overflow:hidden}
 .workspace-ui #appSidebar .sidebar-section-row .workspace-nav-label{overflow:hidden;white-space:nowrap;padding-right:44px}
 .workspace-ui #appSidebar #sidebarToggle{position:absolute;right:0;top:0}
 .workspace-ui #appSidebar #sidebarToggle .ui-icon{transition:transform var(--sidebar-motion) var(--ui-ease)}
 .workspace-ui #appSidebar nav button{overflow:hidden;transition:padding-inline var(--sidebar-motion) var(--ui-ease),background var(--ui-speed) var(--ui-ease),color var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar nav button span{flex:none}
 .workspace-ui #appSidebar>.theme-picker{padding-inline:0}
 .workspace-ui #appSidebar #themeToggle{overflow:hidden;padding-inline:16px;transition:padding-inline var(--sidebar-motion) var(--ui-ease),background var(--ui-speed) var(--ui-ease),color var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar #themeStatus{flex:none}
 .workspace-ui #appSidebar>.sidebar-account{position:relative;display:block;height:100px;padding:0}
 .workspace-ui #appSidebar .sidebar-account-avatar{position:absolute;left:4px;top:12px;transition:left var(--sidebar-motion) var(--ui-ease)}
 .workspace-ui #appSidebar .sidebar-account-info{position:absolute;left:45px;right:48px;top:12px;overflow:hidden}
 .workspace-ui #appSidebar .sidebar-account-logout{position:absolute;right:0;top:7px;transition:top var(--sidebar-motion) var(--ui-ease),right var(--sidebar-motion) var(--ui-ease)}
 :root[data-sidebar-collapsed=true] body.workspace-ui{--sidebar-width:76px;--sidebar-pad:12px}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar .brand{padding-inline:5px}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar :is(.brand>span:last-child,.workspace-nav-label,nav button span,#themeStatus,.sidebar-account-info){opacity:0;pointer-events:none}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar #sidebarToggle .ui-icon{transform:rotate(180deg)}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar nav button{padding-inline:16px}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar #themeToggle{padding-inline:17px}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar .sidebar-account-avatar{left:9px}
 :root[data-sidebar-collapsed=true] .workspace-ui #appSidebar .sidebar-account-logout{right:4px;top:54px}
}

/* A single frosted surface follows the accepted navigation selection. */
@media screen{
 .workspace-ui #appSidebar nav{position:relative;isolation:isolate;background:radial-gradient(ellipse at 18% 50%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 75%)}
 .workspace-ui #appSidebar nav::before{content:'';position:absolute;inset:0 0 auto;height:var(--sidebar-active-height,46px);transform:translateY(var(--sidebar-active-y,0px));pointer-events:none;z-index:0;border:1px solid color-mix(in srgb,var(--surface) 70%,var(--line));border-radius:var(--radius-input);background:linear-gradient(115deg,color-mix(in srgb,var(--surface) 84%,transparent),color-mix(in srgb,var(--surface) 62%,transparent));backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);box-shadow:var(--shadow),inset 0 1px 0 color-mix(in srgb,var(--surface) 65%,transparent);visibility:hidden}
 .workspace-ui #appSidebar nav.sidebar-selection-ready::before{visibility:visible;transition:transform 340ms var(--ui-ease),height 300ms var(--ui-ease),background var(--ui-speed) var(--ui-ease)}
 .workspace-ui #appSidebar nav button{position:relative;z-index:1}
 .workspace-ui #appSidebar nav.sidebar-selection-ready button.active{background:transparent;box-shadow:none}
 :root[data-theme=dark] .workspace-ui #appSidebar nav::before{border-color:color-mix(in srgb,var(--text) 12%,transparent);background:linear-gradient(115deg,color-mix(in srgb,var(--surface) 88%,transparent),color-mix(in srgb,var(--surface) 72%,transparent));box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 7%,transparent)}
}