/* Compact geometry comes from the dock allocator, including narrow stacks.
   Legacy window minimums must not stretch a fixed slot across its neighbour. */
.area-window[data-area-state="rail"]{min-height:0;min-width:0}

/* Wide Compact Areas use the column's available width rather than keeping
   their narrow-panel layout. Headers stay one row high at every shared size. */
.area-window[data-area-state="rail"][data-compact-layout="grid"]{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-width:0;
  min-height:0;
  padding:5px;
  gap:0!important;
}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar{
  flex:0 0 36px!important;
  min-height:36px!important;
  max-height:36px;
  width:auto;
  min-width:0;
  max-width:none;
  margin:-5px -5px 4px!important;
  padding:3px 7px;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity{
  flex:1;
  min-width:0;
  flex-direction:row;
  justify-content:flex-start;
  gap:7px;
  width:100%;
}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity::after{content:none!important;display:none!important}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity>span:last-child{display:block;min-width:0;flex:1}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity :is(b,small){display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity b{font-size:12px;line-height:1.2}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-identity small{font-size:9px;line-height:1.25;margin-top:2px}
.area-window[data-area-state="rail"][data-compact-layout="grid"]>.area-window-bar .area-window-icon{width:28px;height:28px;flex:0 0 28px}

/* System retains its existing action buttons and anchored popovers. */
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"]>.system-scroll-region{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 0;
  min-width:0;
  min-height:0;
  align-items:stretch;
  gap:7px!important;
  padding:0 2px 4px;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region>.system-local-scopes{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(42px,1fr));
  grid-auto-rows:minmax(52px,auto);
  align-content:start;
  align-items:stretch;
  gap:4px;
  flex:0 0 auto;
  min-width:0;
  min-height:0;
  overflow:visible!important;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .system-rail-desktop:has(.has-system-request),
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .system-rail-project:not([hidden]),
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .system-rail-middle{display:contents!important}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-action{
  width:100%;
  min-width:0;
  max-width:none;
  min-height:48px;
  height:auto;
  padding:4px 2px;
  gap:2px;
  justify-content:center;
  align-self:stretch;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-action>svg{width:17px;height:17px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-action>span{font-size:10px;line-height:1.15}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-action>small{display:block;max-width:100%;font-size:9px;line-height:1.2}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailTimerValue{font-size:11px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemScopeSystem{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(42px,1fr));
  grid-auto-rows:minmax(44px,auto);
  align-items:stretch;
  gap:4px;
  flex:0 0 auto;
  min-width:0;
  min-height:0;
  max-height:none;
  margin:0!important;
  padding:6px 0 0;
  border-top:1px solid var(--sd-glass-groove);
  border-left:0;
  overflow:visible;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemScopeSystem>.system-rail-global{display:contents!important}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .system-rail-global>.rail-clock{
  grid-column:span 2;
  min-width:0;
  min-height:44px;
  padding:4px 2px;
  justify-content:center;
  gap:3px;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-clock strong{font-size:17px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .rail-clock small{font-size:9px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailWideAlerts,
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailQuickSettings{grid-column:auto;width:100%;min-width:0;max-width:none;min-height:44px;padding:4px 2px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailWorkspaceNotifications{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  grid-column:span 2;
  align-items:center;
  align-content:center;
  justify-content:center;
  min-width:0;
  gap:3px;
  padding:3px 0;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailWorkspaceNotifications .workspace-notification-badge{
  flex:1 1 22px;
  flex-direction:row;
  min-width:22px;
  max-width:none;
  min-height:32px;
  padding:4px 2px;
  gap:2px;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailWorkspaceNotifications .workspace-notification-badge svg{width:13px;height:13px}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailWorkspaceNotifications .workspace-notification-badge small{font-size:9px;line-height:1.1}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemScopeSystem>.quick-settings{display:contents!important;grid-column:auto}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemScopeSystem>.quick-settings .system-rail-sound{
  width:100%;
  min-width:0;
  min-height:44px;
  height:auto;
  padding:4px 2px!important;
  gap:3px;
}
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region #systemRailQuickSettings>span,
.area-window.systems-zone[data-area-state="rail"][data-compact-layout="grid"] .system-scroll-region .system-rail-sound>span{font-size:10px}

/* The wrapper has no box in existing layouts. A wide Compact Apps Area gives
   all three regions one viewport while its header and resize edge stay fixed. */
.apps-area-body{display:contents}
.apps-zone[data-area-state="rail"]:is([data-dock-edge="left"],[data-dock-edge="right"])>.apps-area-body{
  display:flex;flex:1 1 0;flex-direction:column;min-width:0;min-height:0;
  overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
}
.apps-zone[data-area-state="rail"]:is([data-dock-edge="left"],[data-dock-edge="right"]) .apps-scroll-region{
  flex:0 0 auto;min-height:min-content;overflow:visible;
}
.apps-zone[data-area-state="rail"]:is([data-dock-edge="left"],[data-dock-edge="right"]) :is(.apps-quick-launch,.app-rack,.app-rack-group,.background-apps){
  flex:0 0 auto;max-height:none;min-height:min-content;overflow:visible;
}
/* In a full narrow dock, shared background activity stays at its bottom.
   Launchers and parked work share the remaining scroll viewport above it. */
.apps-zone[data-area-state="rail"]:not([data-compact-layout="grid"])>.apps-area-body{
  overflow:hidden;
}
.apps-zone[data-area-state="rail"]:not([data-compact-layout="grid"]) .apps-scroll-region{
  flex:1 1 0;min-height:0;overflow-x:hidden;overflow-y:auto;
  overscroll-behavior:contain;scrollbar-width:thin;
}
.apps-zone[data-area-state="rail"]:not([data-compact-layout="grid"]) .background-apps{
  min-height:0;max-height:30%;overflow:auto;
}
/* Keep an actual launcher row in Expanded Apps; a percentage ceiling alone
   can otherwise shrink its grid to zero above the Compact threshold. */
.apps-zone[data-area-state="expanded"]:is([data-dock-edge="left"],[data-dock-edge="right"]) .apps-quick-launch{
  min-height:112px;
  max-height:max(112px,35%);
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"]{overflow:hidden!important}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"]>.apps-area-body{
  display:flex;
  flex:1 1 0;
  flex-direction:column;
  min-width:0;
  min-height:0;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scroll-padding-block:3px;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .area-window-bar .apps-header-actions{flex-direction:row}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .apps-scroll-region{
  display:flex;
  flex:0 0 auto;
  flex-direction:column;
  justify-content:flex-start;
  gap:0;
  min-height:min-content;
  overflow:visible;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .apps-quick-launch{
  flex:0 0 auto;
  max-height:none;
  max-width:none;
  width:100%;
  padding:0 0 5px;
  border-right:0;
  border-bottom:1px solid var(--sd-glass-groove);
  overflow:visible;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .apps-quick-launch-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(42px,1fr));
  gap:3px;
  overflow:visible;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .apps-quick-launch-key{width:100%}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .app-rack{
  flex:0 0 auto;
  flex-direction:column;
  width:100%;
  min-height:min-content;
  padding:5px 0 0;
  overflow:visible;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .app-rack-group{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(42px,1fr));
  grid-auto-rows:44px;
  gap:3px;
  max-height:none;
  overflow:visible;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .app-rack-group .app-key{
  width:100%;
  height:44px;
  min-height:44px;
}
.apps-zone[data-area-state="rail"][data-compact-layout="grid"] .background-apps{
  display:grid;
  flex:0 0 auto;
  grid-template-columns:repeat(auto-fill,minmax(36px,1fr));
  grid-auto-rows:36px;
  align-content:start;
  justify-items:center;
  gap:3px;
  max-height:none;
  max-width:none;
  width:100%;
  margin-top:6px;
  padding:5px 0 0;
  border-left:0;
  border-top:1px solid var(--soft-line);
  overflow:visible;
}

/* Current material tools and pinned items share a compact grid. The complete
   grid scrolls, so a short slot never hides Files, More or a pinned item. */
.project-area[data-area-state="rail"][data-project-rail-ready]>.project-closed-state.project-library,
.project-area[data-area-state="rail"][data-project-rail-ready]>:is(.project-space-content,.project-switcher,.project-session-bar,.project-rail-tools,.memory-rail-entry){display:none!important}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-rail{
  display:grid;
  flex:1 1 0;
  grid-template-columns:repeat(auto-fill,minmax(48px,1fr));
  grid-auto-rows:minmax(44px,auto);
  align-content:start;
  align-items:stretch;
  gap:4px;
  padding-bottom:3px;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-context{display:none}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-rail :is(.project-material-pinned,footer){display:contents}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-pinned-label{display:none}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-rail :is(.rail-action,.project-material-item){
  width:100%!important;
  min-width:0;
  min-height:44px;
  justify-content:center;
  gap:3px;
  padding:4px 2px!important;
}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-rail .rail-action>span{font-size:10px!important}
.project-area[data-area-state="rail"][data-compact-layout="grid"] .project-material-stash>small{display:block}

/* Assistant keeps its current chat and new-chat action side by side; the
   existing quick-chat popover retains all of its content and controls. */
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-tools{
  display:grid;
  flex:1 1 0;
  grid-template-columns:minmax(0,1fr) 64px;
  grid-auto-rows:minmax(48px,auto);
  align-content:start;
  align-items:stretch;
  gap:5px;
  padding:0 0 3px;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
}
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-chat{
  position:relative;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  padding:5px 7px!important;
  text-align:left;
}
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-chat-title{-webkit-line-clamp:2;flex:1;font-size:11px;line-height:1.3}
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-sources{flex:none;font-size:10px}
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-chat>small:not([hidden]){position:absolute;right:4px;top:2px;font-size:8px}
.ai-area[data-area-state="rail"][data-compact-layout="grid"] .ai-rail-new{width:100%;min-width:0;justify-content:center;gap:2px;padding:4px 2px!important}

/* The seam belongs to both neighbours. Its eight-pixel pointer target adds
   no visual gutter or extra material to the shared column or row. */
.desktop-shell>.area-share-handle{
  position:absolute;
  z-index:225;
  display:block;
  box-sizing:border-box;
  touch-action:none;
  user-select:none;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  outline:0;
  background:transparent;
  box-shadow:none;
  color:var(--text);
}
.desktop-shell>.area-share-handle[data-axis="vertical"]{cursor:row-resize}
.desktop-shell>.area-share-handle[data-axis="horizontal"]{cursor:col-resize}
.desktop-shell>.area-share-handle::before,
.desktop-shell>.area-share-handle::after{
  content:"";
  position:absolute;
  pointer-events:none;
  background:var(--sd-glass-groove);
}
.desktop-shell>.area-share-handle[data-axis="vertical"]::before{left:0;right:0;top:50%;height:1px}
.desktop-shell>.area-share-handle[data-axis="horizontal"]::before{top:0;bottom:0;left:50%;width:1px}
.desktop-shell>.area-share-handle::after{left:50%;top:50%;transform:translate(-50%,-50%);background:var(--text);opacity:0}
.desktop-shell>.area-share-handle[data-axis="vertical"]::after{width:32px;height:2px}
.desktop-shell>.area-share-handle[data-axis="horizontal"]::after{width:2px;height:32px}
.desktop-shell>.area-share-handle:is(:hover,:focus-visible,:active,.is-active)::after{opacity:.65}
.desktop-shell>.area-share-handle:focus-visible::after{background:var(--workspace-accent);opacity:1}
.desktop-shell>.area-share-handle[hidden],
.area-window[data-area-state="rail"][data-compact-layout="grid"] [hidden]{display:none!important}

/* A visible stop before a deliberate Compact snap, shared by both handles. */
.desktop-shell>.area-share-handle.is-snap-pressure::after,
.area-resize-handle.is-snap-pressure::after{
  background:var(--workspace-accent,var(--blue))!important;
  opacity:calc(.35 + .65 * var(--area-snap-pressure,0))!important;
  box-shadow:0 0 5px color-mix(in srgb,var(--workspace-accent,var(--blue)) 45%,transparent);
}
