/* ═══════════════════════════════════════════════════════════════════
   黑白云（heibaiyun）— 客服后台子站入口登录页样式  /assets/css/heibaiyun/login.css
   挂载页面：app/Views/sub_station/overrides/heibaiyun/customer_login.php（kf.heibaiyun.cc/；2026-10-11 由 kf.leishen8.top 换域名）
   [2026-10-08] 第四轮重做 v4「墨脊长卷 · 实心墨场」：
                v3 的「白底纸纹左区 + 白卡墨框硬影右区」整体替换为
                「实心墨场左区 + 纸面去卡框右区」，左右以 1px 线相接；
                全页唯一硬印（--bw-shadow-stamp）只留给提交按钮，主按钮改紫檀。
   [2026-10-08] 第五轮 v5「色彩职能落地」：登录页可着色处极有限，本轮只做「该着色处着色、
                不该着色处保持灰阶」：
                · 告警/错误态 .pp-login-error → 朱砂族三形态（tint 底 + ink 文字 + 左 3px 条）；
                · 能力药丸 chips → 判定为装饰件且位于实心墨场，**保持灰阶**（理由见该节注释）；
                · 墨场左侧 / 纸面表单 / 输入框 / 结构线 / 提交按钮（紫檀 + 唯一硬印）全部保持不变。
   [2026-10-08] 第六轮 v6「可点击性收口」（仅样式与版本号，未改任何 DOM 钩子 / 功能契约）：
                ① 提交按钮补 :focus-visible 品牌焦点环：原先 theme.css 的
                   `.pp-btn:focus-visible` 与 `.pp-login-submit{box-shadow:stamp}` 同特异性
                   (0,2,0) 且本文件后加载，焦点环被硬印压掉 → 键盘聚焦不可见；
                   现用 (0,3,0) 的 `.pp-login-submit:focus-visible` 直接给出 --bw-focus-ring。
                ② 密码显隐钮由「透明底 + 弱化灰字」的裸控件（违反 §1.3）改为 slate 族
                   功能性控件：--bw-c-slate-bg 底 + 1px 同族描边 + --bw-c-slate-ink 字，
                   并补全 hover / :active / :focus-visible（§6.2 四态统一视觉）。
                ③ 删除装饰件 .pp-visual-chip 的 :hover 变色与 transition：
                   其 DOM 是不可点的 <li>，变色但不给 cursor:pointer 属假可点 affordance。
                ④ 删除文件顶部 @import theme.css：视图已以 <link> 加载同一文件，
                   重复 @import 会造成令牌二次下载（entry.css 已避免此坑，此处对齐）。
                ⑤ 触控目标（契约 §3.4）：≤768 内密码显隐钮 ≥36×36，并同步放宽输入框右侧留位。
                ⑥ 合并基础与媒体查询中同值的冗余声明（.pp-visual-inner 的 text-align）。
                资源版本号提升为 ?v=20261008-hb6。
   设计依据：docs/HEIBAIYUN_UI_DESIGN_SYSTEM.md §1.2（色彩职能映射）/ §1.3（三形态与用量）
             / §3.5（登录页）/ §4.3（登录表单契约）/ §6.2（四态可点击性）
             / §3（硬性约束，尤其 §3.3 登录表单契约）

   ── 桌面端（≥1024px）布局 ──
   左右分栏 1.15 : 520px（与 v3 同分栏比例，但两侧表面、框线、硬印全部改变）：
     左 = 实心墨场：background:--bw-ink + --bw-on-ink-* 文字层级
          + 纸白承托片 logo（logo 本体是墨色圆盘，在墨场上必须承托）
          + 网点大块留白（左上角）+ 低对比云朵描线（右下角）
     右 = 纸面表单：纸面本体即承托面，去边框/去圆角/去阴影（不再是卡片）；
          输入框 1px --bw-border-strong（可交互边界），聚焦 --bw-accent + --bw-focus-ring；
          提交按钮 = 紫檀实底 + --bw-shadow-stamp（全页唯一硬印）。

   ── 约定 ──
   1. 选择器一律以 .heibaiyun-login（本页 body 专属 class）限定，不影响其它品牌/页面。
   2. 颜色只消费 assets/css/heibaiyun/theme.css 的 --bw-* 令牌，不硬编码品牌色。
   3. 禁止：700+ 字重 / backdrop-filter / 彩色柔光阴影 / emoji / 外部 CDN。
      允许例外：错误提示用朱砂族分类色 --bw-c-red / -tint / -ink（语义告警）；
      紫檀 --bw-accent 只用于主按钮与焦点环。
   4. 本文件无内联样式需要对抗（theme.css 由视图以 <link> 先加载，同特异性按顺序取胜），
      故全文不使用 !important。
      [v6] 因此本文件**不再 @import theme.css**：视图已 <link rel="stylesheet"
      href="/assets/css/heibaiyun/theme.css?v=20261008-hb6"> 一次，@import 会造成
      55 个令牌二次下载与二次解析（assets/css/heibaiyun/entry.css 已采用同一处理）。
   5. 本阶段只精修桌面端（≥1024px）；既有移动端断点（≤1024 / ≤768 / ≤480）保留且可用。
   ═══════════════════════════════════════════════════════════════════ */

/* ═══ 页面根：整体布局与基础重设（仅本页 body class 生效） ═══ */
.heibaiyun-login {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--bw-paper);
    color: var(--bw-text-primary);
    font-family: var(--bw-font);
    overflow-x: hidden;
}
.heibaiyun-login h1,
.heibaiyun-login h2,
.heibaiyun-login p,
.heibaiyun-login ul,
.heibaiyun-login li {
    margin: 0;
    padding: 0;
}
.heibaiyun-login ul { list-style: none; }
.heibaiyun-login img { display: block; max-width: 100%; }

.heibaiyun-login .pp-login-shell {
    display: flex;
    align-items: stretch;
    min-height: 100vh;
    min-height: 100dvh;
}

/* ═══ 左侧：实心墨场（v3 的白底纸纹 → v4 的墨色实底） ═══ */
.heibaiyun-login .pp-login-visual {
    position: relative;
    flex: 1.15 1 0;                    /* 桌面端略宽于右侧，形成主视觉重心 */
    min-width: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 64px 60px;
    background: var(--bw-ink);         /* 实心墨场：本页唯一大面积深色面 */
    color: var(--bw-on-ink-secondary); /* 墨场上的一切文字走 on-ink 层级，不用纸面灰 */
    border-right: 1px solid var(--bw-hairline);   /* 与右侧纸面的 1px 接缝 */
}
/* 网点大块留白（左上角）：--bw-dots-image 是墨色点（rgba(34,29,23,.07)），
   落在墨场上会隐形，故用纸白令牌 --bw-paper 生成同间距网点，间距仍取令牌 --bw-dots-size。
   只出现在页头留白区，不铺在任何正文文本之下（设计标准 §4.8）。 */
.heibaiyun-login .pp-login-visual::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 46%;
    height: 54%;
    pointer-events: none;
    background-image: radial-gradient(var(--bw-paper) 1px, transparent 1.1px);
    background-size: var(--bw-dots-size);
    opacity: .10;
}

/* 云朵母题：纯装饰（aria-hidden），v4 改为纸白细描线 + 极低描边透明度，
   让它在墨场上只留一点余韵，不与网点留白争视线。零彩色零渐变。 */
.heibaiyun-login .pp-visual-art {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    color: var(--bw-paper);            /* SVG 用 currentColor，颜色仍来自令牌 */
}
.heibaiyun-login .pp-cloud {
    position: absolute;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-opacity: .07;
}
.heibaiyun-login .pp-cloud-a { width: 320px; height: 320px; bottom: -56px; right: -48px; }
.heibaiyun-login .pp-cloud-b { width: 196px; height: 196px; bottom: 12%;  right: 12%; stroke-opacity: .05; }
.heibaiyun-login .pp-cloud-c { width: 112px; height: 112px; bottom: 30%;  right: 26%; stroke-opacity: .04; }

/* 视觉区内容：v3 居中 → v4 左对齐（结构级改变，配合墨场留白） */
.heibaiyun-login .pp-visual-inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 470px;
    text-align: left;
}

/* 纸白承托片 logo：v3 的 .pp-disc（墨描边 + 硬印）取消，改纸白圆片静置。
   logo.png 本体是墨色圆盘，只有纸白底才能让它读出来。 */
.heibaiyun-login .pp-visual-logo {
    width: 88px;
    height: 88px;
    margin-bottom: 28px;
    display: grid;
    place-items: center;
    border-radius: var(--bw-radius-disc);
    background: var(--bw-paper);
    box-shadow: var(--bw-shadow-sm);   /* 柔影（非硬印，硬印只留给提交按钮） */
}
.heibaiyun-login .pp-visual-logo img {
    width: 68px;
    height: 68px;
    object-fit: contain;
}

/* 品牌眉标：墨场上的细描线药丸（形态编码，不靠颜色） */
.heibaiyun-login .pp-visual-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 30px;
    padding: 0 14px;
    margin-bottom: 20px;
    border: 1px solid var(--bw-on-ink-muted);
    border-radius: var(--bw-radius-pill);
    background: transparent;
    color: var(--bw-on-ink-secondary);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .4px;
}
.heibaiyun-login .pp-visual-eyebrow-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--bw-on-ink-secondary);   /* 非交互装饰不得用紫檀 */
}

/* 品牌名：墨场反白大字，600 字重（禁止 700+） */
.heibaiyun-login .pp-visual-title {
    font-size: 40px;
    font-weight: 600;
    line-height: 1.22;
    letter-spacing: .5px;
    color: var(--bw-text-inverse);
    margin-bottom: 14px;
}
.heibaiyun-login .pp-visual-slogan {
    font-size: 15px;
    line-height: 1.8;
    color: var(--bw-on-ink-secondary);
}

/* 能力药丸：墨场上的空心描边（v3 的白底硬影药丸取消）
   [v5 色彩职能判定] 本组 chips 为「品牌能力展示」装饰件（≤768px 与云朵/网点/页脚同组隐藏），
   **不属「信息分类」**，故不给分类色；且其所处为实心墨场（--bw-ink），
   依据 §1.3「tint 只铺纸面」与 §3.7④「深墨底上不得直接放 base 色」，此处亦无合规的
   黛青/墨青 on-ink 令牌可用（令牌仅有 --bw-on-ink-secondary/muted/accent）。
   → 结论：保持灰阶（on-ink 描边 + on-ink 文字），靠形态编码而非颜色区分。
   [v6 可点击性收口] DOM 为不可点的 <li>（无 href / 无 onclick / 无 role="button"），
   故**删除原 :hover 变色与 transition**：非交互件给 hover 反馈却不给 cursor:pointer，
   是「假可点 affordance」（§6.2 要求可交互件四态齐备，非交互件则不得伪装）。
   现为纯静态展示形态，保持灰阶空心描边，读者不会再误判为可点。 */
.heibaiyun-login .pp-visual-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 30px;
}
.heibaiyun-login .pp-visual-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--bw-on-ink-muted);
    border-radius: var(--bw-radius-pill);
    background: transparent;
    color: var(--bw-on-ink-secondary);
    font-size: 13px;
    font-weight: 600;
}
.heibaiyun-login .pp-visual-chip svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: var(--bw-paper);
}

.heibaiyun-login .pp-visual-foot {
    position: absolute;
    left: 60px;
    right: 60px;
    bottom: 28px;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--bw-on-ink-muted);     /* 墨场弱化文字必须用 on-ink 档（§7①） */
    letter-spacing: .3px;
}
.heibaiyun-login .pp-visual-foot-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--bw-on-ink-muted);
}

/* ═══ 右侧：纸面表单（v3 的白卡墨框硬影 → v4 去卡框纸面） ═══ */
.heibaiyun-login .pp-login-panel {
    position: relative;
    flex: 0 0 520px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 64px 56px;
    background: var(--bw-paper);       /* 纸面本体即承托面，不再是「灰底 + 白卡」 */
}
/* 去卡框：无边框、无圆角、无阴影、无自身底 */
.heibaiyun-login .pp-login-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 420px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.heibaiyun-login .pp-login-heading {
    font-size: 26px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--bw-text-primary);
}
/* 副标题下方的 1px 模块线：v4 用「大标题 + 细线分段」代替 v3 的短墨条装饰 */
.heibaiyun-login .pp-login-sub {
    margin-top: 8px;
    padding-bottom: 26px;
    margin-bottom: 26px;
    border-bottom: 1px solid var(--bw-hairline);
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--bw-text-secondary);
}

/* 告警/错误态（JS 通过 #errorMsg.classList.add("show") 控制显隐；本规则不得改动显隐逻辑）
   [v5 色彩职能] 归类为「告警」→ 朱砂族三形态：朱砂 tint 底 + 朱砂 ink 文字 + 左侧 3px 朱砂条。
   依据 §1.3 三形态铁律：常驻态不得整块实色，base(#A82A1E) 只作条/描边/图形，不作文字色；
   tint(#FAE8E4) 只铺在 --bw-paper 上（本块位于 .pp-login-panel / --bw-paper 之上，合规）。
   v4 的「danger 色 1px 全描边 + danger 当文字色」在此统一为 v5 三形态。 */
.heibaiyun-login .pp-login-error {
    display: none;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 18px;
    padding: 11px 14px 11px 17px;                    /* 左侧多让 3px，给朱砂条留出条宽 */
    background: var(--bw-c-red-tint);                /* 朱砂 8% tint 底（仅铺纸面） */
    border: 0;                                       /* 取消 v4 的 1px 全描边，改左侧 3px 条 */
    border-radius: var(--bw-radius-sm);
    box-shadow: inset 3px 0 0 0 var(--bw-c-red);     /* 左 3px 朱砂条：base 只作条 */
    color: var(--bw-c-red-ink);                      /* 朱砂 ink 文字（tint 底上 ≥4.5:1） */
    font-size: 13px;
    font-weight: 400;                                /* 不加重（禁止 700+，彩色小字非 600 亦不作正文） */
    line-height: 1.55;
}
.heibaiyun-login .pp-login-error.show { display: flex; }
.heibaiyun-login .pp-login-error svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    margin-top: 1px;
}

/* ═══ 表单（复用 .pp-input，1px --bw-border-strong 可交互边界） ═══ */
.heibaiyun-login .pp-login-field { margin-bottom: 18px; }
.heibaiyun-login .pp-login-field label {
    display: block;
    margin-bottom: 9px;
    font-size: 13px;
    font-weight: 600;
    color: var(--bw-text-secondary);
}
.heibaiyun-login .pp-login-field .pp-input {
    height: 48px;
    padding: 0 14px;
    border: 1px solid var(--bw-border-strong);
    border-radius: var(--bw-radius-sm);
    background: var(--bw-bg-surface);
    color: var(--bw-text-primary);
    font-family: var(--bw-font);
    font-size: 14px;
}
.heibaiyun-login .pp-login-field .pp-input::placeholder { color: var(--bw-text-muted-on-tint); }
.heibaiyun-login .pp-login-field .pp-input:focus {
    border-color: var(--bw-accent);    /* 紫檀：焦点环（可点元素允许） */
    background: var(--bw-bg-surface);
    box-shadow: var(--bw-focus-ring);
}
.heibaiyun-login .pp-login-field .pp-input.error {
    border-color: var(--bw-danger);
    background: var(--bw-danger-bg);
    box-shadow: none;
}

/* 密码显隐（功能按钮：只调外观，保持可点可见）
   [v6 可点击性收口] 原为「透明底 + --bw-text-muted-on-tint 灰字」= §1.3 禁止的裸控件，
   现改为 slate 族功能件：--bw-c-slate-bg 常驻底 + 1px 同族描边 + --bw-c-slate-ink 字，
   并补 :hover（-bg-h 加深）/ :active（瞬态同族实底反白，§6.2）/ :focus-visible（紫檀焦点环）。
   注：本按钮用 transform:translateY(-50%) 做垂直居中，故 hover 不做 §6.2 的 translateY(-1px)
   位移（会破坏居中），改以「底色加深一档」表达悬停；描边仍是可交互边界（同族 base ≥3.18:1）。
   尺寸：桌面 32×32；≤768 提升到 36×36（契约 §3.4 触控目标，见文末断点块）。 */
.heibaiyun-login .pp-pw-wrap { position: relative; }
.heibaiyun-login .pp-pw-wrap .pp-input { padding-right: 50px; }
.heibaiyun-login .pp-pw-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 32px;
    height: 32px;
    padding: 0;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    border: 1px solid var(--bw-c-slate);        /* 同族彩色描边（可交互边界） */
    border-radius: var(--bw-radius-sm);
    background: var(--bw-c-slate-bg);           /* 22% 静态淡底（不依赖 color-mix） */
    color: var(--bw-c-slate-ink);               /* 同族 ink 文字（对淡底 ≥4.69:1） */
    cursor: pointer;
    transition: color var(--bw-transition), background var(--bw-transition),
                border-color var(--bw-transition);
}
.heibaiyun-login .pp-pw-toggle:hover {
    background: var(--bw-c-slate-bg-h);         /* 悬停加深一档 */
    border-color: var(--bw-c-slate);
    color: var(--bw-c-slate-ink);
}
.heibaiyun-login .pp-pw-toggle:active {
    /* 瞬态实底反白（§6.2：按下可辨；常驻态仍为 22% 淡底） */
    background: var(--bw-c-slate);
    border-color: var(--bw-c-slate);
    color: var(--bw-text-inverse);
}
.heibaiyun-login .pp-pw-toggle:focus-visible {
    outline: none;
    box-shadow: var(--bw-focus-ring);
}
.heibaiyun-login .pp-pw-toggle svg { width: 18px; height: 18px; }

/* 提交按钮：紫檀实底 + --bw-shadow-stamp（全页唯一硬印），按压平移影消失 */
.heibaiyun-login .pp-login-submit {
    width: 100%;
    height: 52px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 2px;
    border: 1px solid var(--bw-accent);
    border-radius: var(--bw-radius-sm);
    background: var(--bw-accent);
    color: var(--bw-text-inverse);
    box-shadow: var(--bw-shadow-stamp);
    transition: transform var(--bw-transition), box-shadow var(--bw-transition),
                background var(--bw-transition);
}
.heibaiyun-login .pp-login-submit:hover {
    background: var(--bw-accent-hover);
    border-color: var(--bw-accent-hover);
    color: var(--bw-text-inverse);
    transform: translate(-1px, -1px);
}
.heibaiyun-login .pp-login-submit:active {
    background: var(--bw-accent-active);
    transform: translate(2px, 2px);
    box-shadow: var(--bw-shadow-none);
}
/* [v6 缺陷①] 键盘聚焦可见性：theme.css 的 `.pp-btn:focus-visible{box-shadow:var(--bw-focus-ring)}`
   与上面的 `.pp-login-submit{box-shadow:var(--bw-shadow-stamp)}` 同为 (0,2,0)，
   而本文件在 <link theme.css> 之后加载 → 同特异性后者胜，焦点环被硬印覆盖，键盘用户看不到焦点。
   此处用 (0,3,0) 的 :focus-visible 直接给出品牌焦点环（紫檀 + 纸白双环），
   比 :hover/:active 更晚，按住 Enter/Space 时焦点环仍在（可见焦点不因按压消失）。 */
.heibaiyun-login .pp-login-submit:focus-visible {
    outline: none;
    box-shadow: var(--bw-focus-ring);
}
.heibaiyun-login .pp-login-submit:disabled {
    /* 禁用态沿用主题的虚线描边语义，不靠颜色区分状态 */
    background: var(--bw-bg-sunken);
    border-style: dashed;
    border-color: var(--bw-text-disabled);
    color: var(--bw-text-disabled);
    box-shadow: var(--bw-shadow-none);
    cursor: not-allowed;
    transform: none;
}
.heibaiyun-login .pp-login-submit svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}
.heibaiyun-login .spin { animation: pp-spin .8s linear infinite; }
@keyframes pp-spin { to { transform: rotate(360deg); } }

.heibaiyun-login .pp-login-note {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--bw-divider);
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--bw-text-muted-on-tint);
    text-align: center;
}

/* ═══ 响应式（既有断点全部保留）═══ */

/* ≤1024px：收窄两侧，保持分栏 */
@media (max-width: 1024px) {
    .heibaiyun-login .pp-login-visual { padding: 44px 34px; }
    .heibaiyun-login .pp-visual-inner { max-width: 400px; }
    .heibaiyun-login .pp-visual-logo { width: 76px; height: 76px; margin-bottom: 22px; }
    .heibaiyun-login .pp-visual-logo img { width: 58px; height: 58px; }
    .heibaiyun-login .pp-visual-title { font-size: 32px; }
    .heibaiyun-login .pp-visual-foot { left: 34px; right: 34px; }
    .heibaiyun-login .pp-login-panel { flex: 0 0 440px; padding: 44px 32px; }
}

/* ≤768px：单栏 —— 墨场压缩为顶部墨条，纸面表单随即衔接 */
@media (max-width: 768px) {
    .heibaiyun-login .pp-login-shell { flex-direction: column; }
    .heibaiyun-login .pp-login-visual {
        flex: 0 0 auto;
        min-height: 210px;
        padding: 30px 24px 40px;
        border-right: 0;
        border-bottom: 1px solid var(--bw-hairline);
    }
    .heibaiyun-login .pp-visual-inner {
        display: flex;
        align-items: center;
        gap: 16px;
        max-width: 560px;
        /* [v6 合并冗余] 原此处重复声明 text-align:left，与基础规则同值 → 已删（基础规则已生效） */
    }
    .heibaiyun-login .pp-visual-text { text-align: left; }
    .heibaiyun-login .pp-visual-logo {
        flex: 0 0 auto;
        width: 64px;
        height: 64px;
        margin: 0;
    }
    .heibaiyun-login .pp-visual-logo img { width: 50px; height: 50px; }
    /* 窄屏隐藏眉标，避免与品牌名挤在一行 */
    .heibaiyun-login .pp-visual-eyebrow { display: none; }
    .heibaiyun-login .pp-visual-title {
        font-size: 22px;
        margin-bottom: 5px;
    }
    .heibaiyun-login .pp-visual-slogan { font-size: 13px; line-height: 1.6; }
    /* 单栏下隐藏纯装饰元素（云朵描线/网点留白/能力药丸/页脚，均非功能项） */
    .heibaiyun-login .pp-visual-chips,
    .heibaiyun-login .pp-visual-foot,
    .heibaiyun-login .pp-visual-art { display: none; }
    .heibaiyun-login .pp-login-visual::before { display: none; }

    .heibaiyun-login .pp-login-panel {
        flex: 1 1 auto;
        padding: 32px 20px 36px;
    }
    .heibaiyun-login .pp-login-card { max-width: 520px; }

    /* 触控目标（契约 §3.4）：≤768 内功能控件 ≥36px。
       显隐钮由桌面 32×32 提升为 36×36；right:10px + 36px = 46px < 基础留位 50px，故输入框
       右侧 padding 无需改动（仍留 4px 间隙）。次控件中提交按钮 52/48px 本身已 ≥36px。 */
    .heibaiyun-login .pp-pw-toggle { width: 36px; height: 36px; }
    .heibaiyun-login .pp-pw-toggle svg { width: 20px; height: 20px; }
}

/* ≤480px：极窄屏细化 */
@media (max-width: 480px) {
    .heibaiyun-login .pp-login-visual {
        min-height: 176px;
        padding: 24px 18px 32px;
    }
    .heibaiyun-login .pp-visual-inner { gap: 12px; }
    .heibaiyun-login .pp-visual-logo { width: 54px; height: 54px; }
    .heibaiyun-login .pp-visual-logo img { width: 42px; height: 42px; }
    .heibaiyun-login .pp-visual-title { font-size: 19px; margin-bottom: 4px; }
    .heibaiyun-login .pp-visual-slogan { font-size: 12px; }

    .heibaiyun-login .pp-login-panel { padding: 26px 14px 28px; }
    .heibaiyun-login .pp-login-heading { font-size: 21px; }
    .heibaiyun-login .pp-login-sub { padding-bottom: 20px; margin-bottom: 20px; font-size: 12.5px; }
    .heibaiyun-login .pp-login-field { margin-bottom: 15px; }
    .heibaiyun-login .pp-login-field .pp-input { height: 46px; }
    /* 显隐钮在 ≤480 仍为 36×36（承 ≤768 规则），右侧原留位 46px 会贴住按钮 → 放宽到 52px */
    .heibaiyun-login .pp-pw-wrap .pp-input { padding-right: 52px; }
    .heibaiyun-login .pp-login-submit { height: 48px; letter-spacing: 1px; }
    .heibaiyun-login .pp-login-note { margin-top: 18px; padding-top: 15px; font-size: 12px; }
}

/* 尊重系统「减少动态效果」偏好（页面装饰动画已全部改为静态，仅保留加载转圈）
   [v6] .pp-visual-chip 已改为纯静态件（无 transition），此处保留其选择器无害；
   同时把两个功能件（显隐钮 / 提交按钮）的过渡一并关闭。 */
@media (prefers-reduced-motion: reduce) {
    .heibaiyun-login .pp-visual-chip,
    .heibaiyun-login .pp-pw-toggle,
    .heibaiyun-login .pp-login-submit { transition: none; }
}