/* SDZ Product Shell 类名约定（HUI-2823，HUI-2824 页面层组装用）。
 *
 * pattern-level 移植自 Whirl（MIT）：
 *   - apps/v2/components/page-slide.tsx:24-28 + apps/v2/app/globals.css:925-968
 *     —— 两面常驻：隐藏面 opacity:0 + visibility 延迟退场（退出动画播完才出 tab 序）；
 *   - apps/v2/components/sidebar.tsx:39-40 —— rail 折叠滑动的统一过渡曲线。
 *
 * 纪律：本文件不定义颜色；时长/缓动一律引用 motion.css 的 --sdz-motion-* 令牌，
 *   且 var() 不带字面量 fallback（SDZ-F2 收口：冻结值只在 motion.css 物化一次，
 *   token 缺失时声明按 unset 降级为无过渡，功能不受损）。
 * 宽度布局走 --sdz-rail-width（页面层由 createRail 的 width 写入）。
 */

/* :not([hidden])：#app 即 .sdz-shell（app.html:57），登出态 hidden 在位时
 * 无此守卫的作者 display:flex 会击穿 UA [hidden]{display:none}，整壳泄漏。
 * 走查修复 A（P2-a）：登出态深链只显示登录卡。 */
.sdz-shell:not([hidden]) {
  display: flex;
  min-height: 100dvh;
  width: 100%;
}

/* 面：常驻挂载，元素带 data-face="<face 注册名>" 显形。
 * 显隐由页面层同步（把 createAppShell 的 shell.face 写到各面的 data-active）。
 * 隐藏面延迟出 tab 序：visibility 过渡带时长延迟，退出动画播完才生效。 */
.sdz-shell-face[data-face] {
  flex: 1;
  min-width: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--sdz-motion-base) var(--sdz-ease-standard),
    visibility 0s linear var(--sdz-motion-base);
}

.sdz-shell-face[data-face][data-active="true"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

/* Navigation Rail：宽度走变量，折叠滑到窄条（内容不卸载，标签由页面层淡出）。 */
.sdz-rail {
  width: var(--sdz-rail-width, 256px);
  transition:
    width var(--sdz-motion-base) var(--sdz-ease-standard);
}

.sdz-rail--collapsed {
  width: 64px;
}