/* ==========================================================================
   门户登录页 · 分屏式布局（2026-09-26 全面重构）
   适用：agency-login / supplier-login / purchaser-login / expert-login

   ── 设计（替代上一版「浮卡片」布局） ──────────────────────────────
   · 桌面：左 44% 深蓝品牌竖幅（--dloa-nav-bg 实色）+ 右白底表单区，
     取代悬浮卡片在灰色底上的孤立感。
   · 左幅内容：品牌标识 / 服务要点（方形描边符号）/ 底部合规口号。
   · 右区保留既有签名元素：衬线标题 + 左侧 3px 角色强调竖条；
     角色色仅用于竖条与图标瓦片，主按钮四页统一品牌蓝。
   · <960px：品牌竖幅收合为顶部横幅（只留品牌行），表单区全宽。

   ── 设计依据 ────────────────────────────────────────────────────
   · design-tokens.css 规则 3「严肃政务风」：实色背景 + 1px 细边框，
     不使用毛玻璃、装饰渐变、卡片阴影、emoji 图标。
   · 颜色 100% 取自 design-tokens.css 既有令牌，不新发明颜色。

   ── 兼容性注意 ──────────────────────────────────────────────────
   · .portal-auth-shell--solo 使用 display:contents 参与分屏：
     它不生成盒子，因此不会给内部 position:fixed 的注册弹窗创建
     包含块（上一版注释中的约束继续满足）；自定义属性 --pl-accent
     照常沿子树继承。
   · personal-center.html 使用无修饰的 .portal-auth-shell，本层全部
     规则收敛在 --solo / .pl-side 之下，不会外溢。
   · 上游 style.css / ui-optimization.css 大量使用 !important，
     本层为其后加载的最后一张样式表，以同等/更高特异性 + !important 覆盖。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 页面底与角色强调色
   -------------------------------------------------------------------------- */

/* 视口顶部 4px 政务蓝标条：给整页一个品牌锚点 */
.portal-auth-body::before {
  content: '';
  position: fixed;
  inset: 0 0 auto 0;
  height: 4px;
  background: var(--dloa-primary);
  z-index: 10;
  pointer-events: none;
}

/* 角色强调色：仅用于「标题竖条 + 角色图标」，主按钮始终为品牌蓝 */
.portal-auth-shell--solo {
  --pl-accent: var(--dloa-primary);
}
body[data-login-mode='supplier'] .portal-auth-shell--solo {
  --pl-accent: var(--dloa-info);
}
body[data-login-mode='purchaser'] .portal-auth-shell--solo {
  --pl-accent: var(--dloa-accent);
}
body[data-login-mode='expert'] .portal-auth-shell--solo {
  --pl-accent: var(--dloa-success);
}

/* --------------------------------------------------------------------------
   2. 场景背景 + 居中登录卡（2026-09-26 最终版）

   整页：夜空纯色（取自 potala-ridge.svg 山体色 #0a2145）+
   布达拉宫山脊剪影（public/img/opening-hall/potala-ridge.svg，xMidYMax 底部锚定）
   横贯页面底部；白色登录卡居中浮于场景之上。
   单列布局——不依赖 grid/flex 子项拉伸，规避上游 place-items 干扰。
   -------------------------------------------------------------------------- */

.portal-auth-body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100vh !important;
  padding: 44px 20px 200px !important;
  background:
    url('../img/opening-hall/potala-ridge.svg') bottom center / 100% auto no-repeat,
    #0a2145 !important;
}

/* 外壳透传：品牌行与卡片成为 body 的两个居中子项 */
.portal-auth-shell--solo {
  display: contents !important;
}

/* 品牌行：卡片上方的白色横排标识（夜空底） */
.portal-auth-body .pl-side {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 460px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.pl-side-points,
.pl-side-footnote {
  display: none !important;
}

/* 登录卡：白底浮层（浮层允许柔和投影）；纵向 flex 以支撑身份切换置顶排序 */
.portal-auth-body .portal-auth-card {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 460px !important;
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  min-height: 0 !important;
  padding: 26px 30px 24px !important;
  background: var(--dloa-surface) !important;
  border: 1px solid var(--dloa-border-subtle) !important;
  border-top: 3px solid var(--pl-accent) !important;
  border-radius: var(--dloa-radius-lg) !important;
  box-shadow: 0 12px 32px rgba(4, 18, 40, 0.45) !important;
}

/* --------------------------------------------------------------------------
   3. 品牌行（夜空底上的白色标识，卡片上方）
   -------------------------------------------------------------------------- */

.pl-side .pl-brand {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
  text-decoration: none !important;
  border: 0 !important;
}

.pl-side .pl-brand-mark {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 46px !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface) !important;
  color: var(--dloa-primary) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.pl-side .pl-brand-text {
  display: block !important;
  min-width: 0 !important;
}

.pl-side .pl-brand-text strong {
  display: block !important;
  color: var(--dloa-text-inverse) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-xl) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
}

.pl-side .pl-brand-text small {
  display: block !important;
  margin-top: 2px !important;
  color: rgba(255, 255, 255, 0.72) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-xs) !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.02em !important;
}

.pl-side .pl-brand:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.7) !important;
  outline-offset: 3px !important;
  border-radius: var(--dloa-radius) !important;
}

/* 服务要点：方形描边符号（政务克制风，不用 emoji / 圆点） */
.pl-side-points {
  margin: clamp(32px, 6vh, 56px) 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: grid !important;
  gap: 15px !important;
}

.pl-side-points li {
  position: relative !important;
  padding-left: 20px !important;
  color: rgba(255, 255, 255, 0.88) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-base) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

.pl-side-points li::before {
  content: '' !important;
  position: absolute !important;
  left: 2px !important;
  top: 0.62em !important;
  width: 7px !important;
  height: 7px !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  background: transparent !important;
}

.pl-side-footnote {
  margin: auto 0 0 !important;
  padding-top: 32px !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-xs) !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.6 !important;
}

/* --------------------------------------------------------------------------
   4. 标题区（签名元素：衬线标题 + 左侧 3px 角色强调竖条）
   -------------------------------------------------------------------------- */

.portal-auth-shell--solo .pl-head {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  margin: 0 0 22px !important;
  padding-left: 14px !important;
  border-left: 3px solid var(--pl-accent) !important;
}

.portal-auth-shell--solo .pl-head-icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  border: 1px solid var(--dloa-border-subtle) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface-sunken) !important;
  color: var(--pl-accent) !important;
}

.portal-auth-shell--solo .pl-head-icon .icon {
  width: 20px !important;
  height: 20px !important;
}

.portal-auth-shell--solo .pl-head-text {
  min-width: 0 !important;
}

/* 上游两处 !important 均针对 .portal-auth-card h2：
   style.css:1415（20px/500/居中/rgba）与 ui-optimization.css:1314（24px/700/左对齐）。
   本选择器特异性更高，可稳定覆盖二者。 */
.portal-auth-shell--solo .portal-auth-card .pl-head h2 {
  margin: 0 0 6px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--dloa-text) !important;
  font-family:
    'Songti SC', 'SimSun', 'Noto Serif SC', 'Source Han Serif SC', 'Times New Roman', Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.02em !important;
  text-align: left !important;
  text-shadow: none !important;
}

.portal-auth-shell--solo .pl-head p {
  margin: 0 !important;
  color: var(--dloa-text-muted) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

/* --------------------------------------------------------------------------
   5. 表单与字段
   -------------------------------------------------------------------------- */

.portal-auth-shell--solo .portal-auth-card .form-group {
  margin-bottom: 16px !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group label {
  display: block !important;
  margin: 0 0 6px !important;
  color: var(--dloa-text-secondary) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.01em !important;
  text-align: left !important;
}

.portal-auth-shell--solo .pl-control {
  position: relative !important;
}

.portal-auth-shell--solo .pl-control .pl-control-icon {
  position: absolute !important;
  top: 50% !important;
  left: 13px !important;
  width: 16px !important;
  height: 16px !important;
  transform: translateY(-50%) !important;
  color: var(--dloa-text-disabled) !important;
  stroke: currentColor !important;
  pointer-events: none !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group .pl-control input {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 14px 0 39px !important;
  border: 1px solid var(--dloa-border) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface) !important;
  color: var(--dloa-text) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-base) !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group .pl-control--action input {
  padding-right: 46px !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group .pl-control input::placeholder {
  color: var(--dloa-text-disabled) !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group .pl-control input:hover {
  border-color: var(--dloa-border-strong) !important;
}

.portal-auth-shell--solo .portal-auth-card .form-group .pl-control input:focus {
  outline: 0 !important;
  border-color: var(--dloa-primary) !important;
  box-shadow: 0 0 0 3px rgba(11, 104, 218, 0.14) !important;
}

/* 密码显隐按钮 */
.portal-auth-shell--solo .pl-reveal {
  position: absolute !important;
  top: 50% !important;
  right: 6px !important;
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  border: 0 !important;
  border-radius: var(--dloa-radius) !important;
  background: none !important;
  color: var(--dloa-text-muted) !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.portal-auth-shell--solo .pl-reveal .icon {
  width: 16px !important;
  height: 16px !important;
}

.portal-auth-shell--solo .pl-reveal:hover {
  color: var(--dloa-primary) !important;
  background: var(--dloa-surface-sunken) !important;
}

.portal-auth-shell--solo .pl-reveal:focus-visible {
  outline: 2px solid var(--dloa-primary) !important;
  outline-offset: 1px !important;
}

.portal-auth-shell--solo .pl-reveal[aria-pressed='true'] {
  color: var(--dloa-primary) !important;
}

/* --------------------------------------------------------------------------
   6. 按钮
   -------------------------------------------------------------------------- */

/* 主按钮：四页统一品牌蓝 */
.portal-auth-shell--solo .portal-auth-card .pl-submit {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 8px 0 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--dloa-primary) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-primary) !important;
  color: var(--dloa-text-inverse) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0.04em !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-submit .icon {
  width: 17px !important;
  height: 17px !important;
  opacity: 0.9 !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-submit:hover {
  background: var(--dloa-primary-hover) !important;
  border-color: var(--dloa-primary-hover) !important;
  color: var(--dloa-text-inverse) !important;
  box-shadow: none !important;
  transform: none !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-submit:active {
  background: var(--dloa-primary-active) !important;
  border-color: var(--dloa-primary-active) !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-submit:focus-visible {
  outline: 2px solid var(--dloa-primary-active) !important;
  outline-offset: 2px !important;
}

/* 「或」分隔 */
.portal-auth-shell--solo .pl-divider {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 18px 0 !important;
  color: var(--dloa-text-disabled) !important;
  font-size: var(--dloa-font-size-xs) !important;
  line-height: 1 !important;
}

.portal-auth-shell--solo .pl-divider::before,
.portal-auth-shell--solo .pl-divider::after {
  content: '' !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  background: var(--dloa-divider) !important;
}

.portal-auth-shell--solo .pl-register {
  margin: 0 !important;
}

/* 次级动作：描边按钮 */
.portal-auth-shell--solo .portal-auth-card .pl-register-btn {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--dloa-primary-border) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface) !important;
  color: var(--dloa-primary) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-base) !important;
  font-weight: 500 !important;
  line-height: 42px !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-register-btn:hover {
  border-color: var(--dloa-primary) !important;
  background: var(--dloa-primary-bg) !important;
  color: var(--dloa-primary-active) !important;
  box-shadow: none !important;
  transform: none !important;
}

.portal-auth-shell--solo .portal-auth-card .pl-register-btn:active {
  background: var(--dloa-primary-border) !important;
}

/* 忘记密码链接行（登录提交按钮上方右侧） */
.pl-forgot-row {
  display: flex;
  justify-content: flex-end;
  margin: -6px 0 12px;
}

.pl-forgot-link {
  border: 0;
  background: none;
  padding: 0;
  font-size: 13px;
  color: var(--dloa-primary);
  cursor: pointer;
}

.pl-forgot-link:hover {
  text-decoration: underline;
}

.pl-forgot-link:focus-visible {
  outline: 2px solid var(--dloa-primary);
  outline-offset: 2px;
  border-radius: 2px;
}

.portal-auth-shell--solo .portal-auth-card .pl-register-btn:focus-visible {
  outline: 2px solid var(--dloa-primary) !important;
  outline-offset: 2px !important;
}

/* --------------------------------------------------------------------------
   7. 状态提示（文字 + 形状 + 颜色三重表达）
   -------------------------------------------------------------------------- */

.portal-auth-shell--solo .portal-auth-status {
  display: none !important;
  margin: 0 !important;
}

.portal-auth-shell--solo .portal-auth-card .portal-auth-status.is-visible {
  display: block !important;
  margin: 0 0 18px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--dloa-border) !important;
  border-left: 3px solid var(--dloa-info) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-info-bg) !important;
  color: var(--dloa-info) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

.portal-auth-shell--solo .portal-auth-card .portal-auth-status.is-visible.alert-danger {
  border-color: var(--dloa-danger-border) !important;
  border-left-color: var(--dloa-danger) !important;
  background: var(--dloa-danger-bg) !important;
  color: var(--dloa-danger) !important;
}

.portal-auth-shell--solo .portal-auth-card .portal-auth-status.is-visible.alert-warning {
  border-color: var(--dloa-warning-border) !important;
  border-left-color: var(--dloa-warning) !important;
  background: var(--dloa-warning-bg) !important;
  color: var(--dloa-warning) !important;
}

.portal-auth-shell--solo .portal-auth-card .portal-auth-status.is-visible.alert-success {
  border-color: var(--dloa-success-border) !important;
  border-left-color: var(--dloa-success) !important;
  background: var(--dloa-success-bg) !important;
  color: var(--dloa-success) !important;
}

/* --------------------------------------------------------------------------
   8. 页脚与身份切换
   身份切换提升至卡片顶部（等宽标签式）：进错角色页时第一眼可见可换；
   工具行（返回/个人中心）留在卡片底部。
   实现方式：.pl-footer 设为 display:contents，两个子块用 order 排序——
   .pl-switch (order:1) 在 .pl-head 之前，.pl-footer-utility (order:10) 殿后。
   -------------------------------------------------------------------------- */

.portal-auth-shell--solo .pl-footer {
  display: contents !important;
}

.portal-auth-shell--solo .pl-footer-utility {
  order: 10 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 20px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid var(--dloa-divider) !important;
}

.portal-auth-shell--solo .pl-footer-utility a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--dloa-text-muted) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.portal-auth-shell--solo .pl-footer-utility a:hover {
  color: var(--dloa-primary) !important;
  text-decoration: none !important;
}

.portal-auth-shell--solo .pl-footer-utility a:focus-visible {
  outline: 2px solid var(--dloa-primary) !important;
  outline-offset: 2px !important;
}

.portal-auth-shell--solo .pl-back-arrow {
  font-size: 14px !important;
  line-height: 1 !important;
}

/* 身份切换：卡片顶部等宽标签式 */
.portal-auth-shell--solo .pl-switch {
  order: 1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin: 0 0 20px !important;
}

.portal-auth-shell--solo .pl-switch-label {
  display: none !important;
}

.portal-auth-shell--solo .pl-switch-chip {
  flex: 1 1 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 9px 8px !important;
  border: 1px solid var(--dloa-border) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface) !important;
  color: var(--dloa-text-secondary) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  text-decoration: none !important;
  transition:
    color 0.15s ease,
    border-color 0.15s ease,
    background-color 0.15s ease !important;
}

.portal-auth-shell--solo .pl-switch-chip:hover {
  border-color: var(--dloa-primary) !important;
  background: var(--dloa-primary-bg) !important;
  color: var(--dloa-primary) !important;
}

.portal-auth-shell--solo .pl-switch-chip:focus-visible {
  outline: 2px solid var(--dloa-primary) !important;
  outline-offset: 2px !important;
}

/* --------------------------------------------------------------------------
   9. 注册弹窗（保持既有结构与行为，仅统一视觉）

   ⚠️ 不得重声明 .portal-auth-modal 的 display：
   一旦写成 `.portal-auth-shell--solo .portal-auth-modal { display:flex !important }`，
   其特异性 (0,2,0) 会压过全局 `.hidden { display:none !important }` (0,1,0)，
   弹窗将无视 hidden 常驻显示，变成覆盖全页的透明遮罩并吞掉所有点击。
   -------------------------------------------------------------------------- */

.portal-auth-shell--solo .portal-auth-modal-content {
  max-height: 100% !important;
  overflow-y: auto !important;
  border: 1px solid var(--dloa-border-subtle) !important;
  border-radius: var(--dloa-radius-lg) !important;
}

/* 注册弹窗「宽体 + 分区双列」版式
   替代原 500px 单列纵向长表：880px 宽体卡，固定标题栏 + 可滚动正文 +
   分区（分区标题 + 两列字段栅格）+ 底部吸附操作条。

   层级三档（渲染后一眼可扫读，避免全篇同色同重的「灰汤」）：
     弹窗标题 20px/700 → 分区标题 16px/600/主文字色 → 字段标签 13px/500/正文色。

   容器线只保留三类，其余一律去掉：
     标题栏下边线、分区上边线、操作条上边线；
     说明文字改为扁平辅助文本（不再做成第二个面板），
     附加身份展开区用浅底内嵌面板表达从属关系。

   字段顺序与提交逻辑解耦（portal-auth.js 一律按 id 取值），
   因此重排 DOM 不影响注册链路。 */
.portal-auth-shell--solo .portal-auth-modal-content--wide {
  width: min(100%, 880px) !important;
  max-width: 880px !important;
  max-height: 100% !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.portal-auth-shell--solo .portal-auth-modal-content--wide .portal-auth-modal-header {
  flex: none !important;
  margin: 0 !important;
  padding: 18px 28px !important;
  background: var(--dloa-surface) !important;
}

/* 正文独立滚动：标题栏与操作条固定，只有字段区滚动 */
.portal-auth-shell--solo .pl-modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 22px 28px 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

/* 顶部说明：扁平辅助文本。渲染成第二个「面板」会和附加身份区抢层级 */
.portal-auth-shell--solo .pl-modal-intro {
  margin: 0 0 22px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--dloa-text-muted) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  line-height: 1.7 !important;
}

/* 分区：细线分隔 + 比字段标签重一档的标题（不加装饰色条，避免模板化） */
.portal-auth-shell--solo .pl-form-section {
  margin-top: 22px !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--dloa-divider) !important;
}

.portal-auth-shell--solo .pl-form-section:first-of-type {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

.portal-auth-shell--solo .pl-form-section-title {
  margin: 0 0 14px !important;
  color: var(--dloa-text) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-md) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* 字段两列栅格；需整行的字段加 .pl-span-2 */
.portal-auth-shell--solo .pl-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 24px !important;
  align-items: start !important;
}

/* 折叠态：JS 通过切换 .hidden 控制「附加身份」展开区显隐。
   上面 .pl-form-grid 的 display 规则特异性为 (0,2,0)，高于全局
   `.hidden { display:none !important }` (0,1,0)，若不在此用更高特异性压回，
   展开区会无视 hidden 常显。故必须写成 (0,3,0)。 */
.portal-auth-shell--solo .pl-form-grid.hidden {
  display: none !important;
}

.portal-auth-shell--solo .pl-form-grid > .pl-span-2 {
  grid-column: 1 / -1 !important;
}

.portal-auth-shell--solo .pl-form-grid .form-group {
  margin-bottom: 0 !important;
}

.portal-auth-shell--solo .pl-form-grid .form-group:has(> input[required]) > label::after {
  content: ' *';
  color: var(--dloa-danger);
}

/* 字段级帮助文字（如密码规则）：紧贴字段下方，字号再降一档 */
.portal-auth-shell--solo .pl-field-help {
  margin: 6px 0 0 !important;
  color: var(--dloa-text-muted) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-xs) !important;
  line-height: 1.6 !important;
}

/* 「同时注册另一身份」：普通选项行（无外框），与字段区同一节奏 */
.portal-auth-shell--solo .pl-form-switch {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

.portal-auth-shell--solo .pl-form-switch .portal-auth-checkbox {
  color: var(--dloa-text-body) !important;
  font-size: var(--dloa-font-size-base) !important;
  line-height: 1.6 !important;
}

/* 附加身份展开区：浅底内嵌面板，明确这些字段从属于上方选项 */
.portal-auth-shell--solo .pl-form-subpanel {
  margin-top: 14px !important;
  padding: 16px !important;
  border: 1px solid var(--dloa-border-subtle) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface-muted) !important;
}

/* 底部操作条：吸附在正文底部，长表单滚动时操作始终可见 */
.portal-auth-shell--solo .pl-form-actions {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  margin: 24px -28px 0 !important;
  padding: 14px 28px !important;
  border-top: 1px solid var(--dloa-divider) !important;
  background: var(--dloa-surface) !important;
}

/* 必填图例：填实操作条左侧，交代星号含义（政务表单惯例） */
.portal-auth-shell--solo .pl-form-legend {
  margin-right: auto !important;
  color: var(--dloa-text-muted) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  line-height: 1.5 !important;
}

.portal-auth-shell--solo .pl-form-legend em {
  color: var(--dloa-danger) !important;
  font-style: normal !important;
}

.portal-auth-shell--solo .pl-form-actions .btn {
  width: auto !important;
  min-width: 108px !important;
  min-height: 40px !important;
  padding: 0 24px !important;
  font-size: var(--dloa-font-size-base) !important;
}

/* 次要操作（取消）：白底细边，向上游 .btn-secondary 的灰底取值对齐政务风 */
.portal-auth-shell--solo .pl-form-actions .btn-secondary {
  background: var(--dloa-surface) !important;
  border: 1px solid var(--dloa-border) !important;
  color: var(--dloa-text-secondary) !important;
}

.portal-auth-shell--solo .pl-form-actions .btn-secondary:hover {
  border-color: var(--dloa-primary) !important;
  color: var(--dloa-primary) !important;
}

/* 文件字段：与文本输入同一观感 */
.portal-auth-shell--solo .portal-auth-modal .form-group > input[type='file'] {
  height: auto !important;
  min-height: 40px !important;
  padding: 5px 10px !important;
  color: var(--dloa-text-secondary) !important;
  font-size: var(--dloa-font-size-sm) !important;
  cursor: pointer !important;
}

.portal-auth-shell--solo
  .portal-auth-modal
  .form-group
  > input[type='file']::file-selector-button {
  margin-right: 10px !important;
  padding: 6px 12px !important;
  border: 1px solid var(--dloa-border) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface-sunken) !important;
  color: var(--dloa-text-secondary) !important;
  font-family: inherit !important;
  font-size: var(--dloa-font-size-sm) !important;
  cursor: pointer !important;
}

.portal-auth-shell--solo
  .portal-auth-modal
  .form-group
  > input[type='file']::file-selector-button:hover {
  border-color: var(--dloa-primary) !important;
  color: var(--dloa-primary) !important;
}

.portal-auth-shell--solo .portal-auth-modal-header {
  border-bottom: 1px solid var(--dloa-divider) !important;
}

.portal-auth-shell--solo .portal-auth-modal-header h3 {
  color: var(--dloa-text) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-xl) !important;
  font-weight: 700 !important;
}

.portal-auth-shell--solo .portal-auth-modal-close {
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: var(--dloa-radius) !important;
  background: none !important;
  color: var(--dloa-text-muted) !important;
  font-size: var(--dloa-font-size-2xl) !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.portal-auth-shell--solo .portal-auth-modal-close:hover {
  background: var(--dloa-surface-sunken) !important;
  color: var(--dloa-text) !important;
}

/* 弹窗内的表单保持与主卡片一致的字段观感（弹窗内不使用前置图标） */
.portal-auth-shell--solo .portal-auth-modal .form-group {
  margin-bottom: 14px !important;
}

/* 字段标签：13px/500/正文色，与 16px/600 的分区标题明确拉开一档 */
.portal-auth-shell--solo .portal-auth-modal .form-group > label {
  display: block !important;
  margin-bottom: 6px !important;
  color: var(--dloa-text-body) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.portal-auth-shell--solo .portal-auth-modal .form-group > input,
.portal-auth-shell--solo .portal-auth-modal .form-group > select {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 12px !important;
  border: 1px solid var(--dloa-border) !important;
  border-radius: var(--dloa-radius) !important;
  background: var(--dloa-surface) !important;
  color: var(--dloa-text) !important;
  font-family: var(--dloa-font-sans) !important;
  font-size: var(--dloa-font-size-base) !important;
  box-shadow: none !important;
}

.portal-auth-shell--solo .portal-auth-modal .form-group > input:focus,
.portal-auth-shell--solo .portal-auth-modal .form-group > select:focus {
  outline: 0 !important;
  border-color: var(--dloa-primary) !important;
  box-shadow: 0 0 0 3px rgba(11, 104, 218, 0.14) !important;
}

.portal-auth-shell--solo .portal-auth-checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  color: var(--dloa-text-body) !important;
  font-size: var(--dloa-font-size-sm) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

.portal-auth-shell--solo .portal-auth-checkbox input {
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 2px 0 0 !important;
}

/* --------------------------------------------------------------------------
   10. 断点
   -------------------------------------------------------------------------- */

/* ≤960px：结构不变（本就是单列），仅收紧留白与卡宽 */
@media (max-width: 960px) {
  .portal-auth-body {
    padding: 32px 16px 180px !important;
  }

  .portal-auth-body .pl-side {
    max-width: 460px !important;
    margin-bottom: 14px !important;
  }

  .portal-auth-body .portal-auth-card {
    padding: 28px 22px 22px !important;
  }
}

/* ≤860px：注册弹窗双列栅格收起为单列，操作条换行、按钮等宽撑满 */
@media (max-width: 860px) {
  .portal-auth-shell--solo .pl-form-grid {
    grid-template-columns: 1fr !important;
  }

  .portal-auth-shell--solo .pl-form-grid > .pl-span-2 {
    grid-column: auto !important;
  }

  .portal-auth-shell--solo
    .portal-auth-modal-content--wide
    .portal-auth-modal-header {
    padding: 16px 20px !important;
  }

  .portal-auth-shell--solo .pl-modal-body {
    padding: 18px 20px 0 !important;
  }

  .portal-auth-shell--solo .pl-form-actions {
    flex-wrap: wrap !important;
    margin: 20px -20px 0 !important;
    padding: 12px 20px !important;
  }

  /* 必填图例独占一行，两个操作按钮等宽平分 */
  .portal-auth-shell--solo .pl-form-legend {
    width: 100% !important;
    margin: 0 0 10px !important;
  }

  .portal-auth-shell--solo .pl-form-actions .btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
}

/* 上游 ui-optimization.css 在 768/390 以下会改 body 布局并拉伸卡片；
   本层在最后加载，这里重申居中卡片约束。 */
@media (max-width: 768px) {
  .portal-auth-body {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .portal-auth-body .portal-auth-card {
    min-height: 0 !important;
    max-width: 460px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 26px 20px 20px !important;
  }
}

@media (max-width: 390px) {
  .portal-auth-body {
    padding: 24px 14px 150px !important;
  }
  .portal-auth-body .portal-auth-card {
    padding: 22px 16px 18px !important;
  }
  .portal-auth-shell--solo .portal-auth-card .pl-head h2 {
    font-size: 23px !important;
  }
  .pl-side .pl-brand-mark {
    flex-basis: 38px !important;
    width: 38px !important;
    height: 38px !important;
    font-size: 18px !important;
  }
  .pl-side .pl-brand-text strong {
    font-size: var(--dloa-font-size-lg) !important;
  }
}

/* --------------------------------------------------------------------------
   11. 动效降级
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .portal-auth-shell--solo *,
  .portal-auth-shell--solo *::before,
  .portal-auth-shell--solo *::after {
    transition: none !important;
    animation: none !important;
  }
}