/* ============================================================
 * next-chrome 认证页换肤（/simple/login、/simple/reg2、/simple/find_password）
 * 作用域：.auth-page（由三个页面模板按需引入）。
 * UI 参考 laravel 新项目 front/auth/{login,register,find-password}.blade.php
 * 的视觉设计，仅借鉴布局与配色，未引入其框架代码；不涉及任何业务逻辑。
 * 设计令牌对齐 site-chrome.css（紫 #3d1e58/#6c3a96、琥珀 #efa95a、底色 #f5f2f7）。
 * ============================================================ */

/* 新头部在认证页不再保留顶部悬浮间隙（对齐 laravel auth 页） */
body:has(.auth-page) .site-chrome-header.n6-header {
    margin-top: 0;
}

/* 认证页：头部购物车悬停清单（#div_mycart，380px 绝对定位）在 ≤1420 视口会产生
   横向溢出（T1 公共头尾既有形态，主站同样存在）。认证页未登录购物车为空、
   悬停清单价值低，改为悬停时才渲染；公共样式不动，仅认证页作用域生效。 */
body:has(.auth-page) .site-chrome-header .n6-cart-widget .cart-block {
    display: none;
}

body:has(.auth-page) .site-chrome-header .n6-cart-widget:hover .cart-block {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: translate(0, 0);
}

/* ---- 页面底色与令牌（覆盖旧 .mi_body 的 display:table/黄色底） ---- */
.mi_body.auth-page {
    --auth-ink: var(--site-chrome-purple, #3d1e58);
    --auth-purple: var(--site-chrome-purple-2, #6c3a96);
    --auth-amber: var(--site-chrome-amber, #efa95a);
    --auth-muted: var(--site-chrome-muted, #8a8294);
    --auth-line: rgba(61, 30, 88, .12);
    --auth-hero: var(--site-chrome-gradient, linear-gradient(120deg, #4a2375 0%, #6b3a94 55%, #8e5ba6 100%));
    --auth-shadow: 0 26px 60px -22px rgba(30, 12, 48, .45);
    display: block;
    width: 100%;
    height: auto;
    box-sizing: border-box;
    padding: 28px clamp(14px, 3vw, 48px) 44px;
    background: #f5f2f7;
}

.auth-page a {
    text-decoration: none;
}

/* ============================================================
 * 登录 / 注册：auth 双栏壳（左品牌 + 右表单卡）
 * ============================================================ */
.auth-shell {
    position: relative;
    display: flex;
    max-width: 1400px;
    min-height: 560px;
    box-sizing: border-box;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 24px;
    background:
        radial-gradient(circle at 80% 14%, rgba(239, 169, 90, .24), transparent 384px),
        var(--auth-hero);
    box-shadow: var(--auth-shadow);
}

.auth-shell::before,
.auth-shell::after {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    content: '';
    pointer-events: none;
}

.auth-shell::before {
    top: -288px;
    left: -160px;
    width: 672px;
    height: 672px;
}

.auth-shell::after {
    right: -192px;
    bottom: -384px;
    width: 832px;
    height: 832px;
}

/* ---- 左侧品牌面板 ---- */
.auth-brand-panel {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 1 50%;
    align-items: center;
    justify-content: center;
    min-width: 0;
    box-sizing: border-box;
    padding: 48px clamp(32px, 5vw, 88px);
    color: #fff;
}

.auth-brand-content {
    width: min(100%, 448px);
}

.auth-brand-mark {
    display: inline-flex;
    width: 52px;
    height: 52px;
    margin-bottom: 9px;
    border-radius: 17.60px;
    object-fit: contain;
}

.auth-brand-eyebrow {
    margin: 0 0 13.60px;
    color: #ffe9c4;
    font-size: 16.80px;
    font-weight: 700;
    letter-spacing: .24em;
}

.auth-brand-title {
    margin: 0;
    color: #fff;
    font-size: clamp(32px, 3vw, 48px);
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: -.04em;
}

.auth-brand-description {
    max-width: 448px;
    margin: 22.40px 0 0;
    color: rgba(255, 255, 255, .78);
    font-size: 16.80px;
    line-height: 1.9;
}

.auth-brand-link {
    color: #ffe9c4;
    font-weight: 700;
}

.auth-brand-points {
    display: grid;
    gap: 13.60px;
    margin: 32px 0 0;
    padding: 0;
    list-style: none;
}

.auth-brand-points li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: rgba(255, 255, 255, .84);
    font-size: 16px;
}

.auth-brand-points li::before {
    flex: 0 0 auto;
    width: 7.20px;
    height: 7.20px;
    border-radius: 50%;
    background: var(--auth-amber, #efa95a);
    box-shadow: 0 0 0 4.80px rgba(239, 169, 90, .2);
    content: '';
}

/* 运营登录广告图（site_config->login_ad 真实配置数据） */
.auth-brand-ad {
    display: block;
    margin-top: 32px;
    overflow: hidden;
    border-radius: 14px;
}

.auth-brand-ad img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---- 右侧表单面板与白卡 ---- */
.auth-panel {
    position: relative;
    z-index: 2;
    display: flex;
    flex: 1 1 50%;
    align-items: center;
    justify-content: center;
    min-width: 0;
    box-sizing: border-box;
    padding: 24px clamp(20px, 3vw, 56px);
}

.lycoLoginBody.auth-card {
    box-sizing: border-box;
    width: min(100%, 544px);
    height: auto;
    min-height: 0;
    margin: 0;
    padding: clamp(28px, 3vw, 40px);
    border: 1px solid rgba(61, 30, 88, .12);
    border-radius: 20px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 32px 80px rgba(74, 35, 117, .3);
}

.auth-register-page .lycoLoginBody.auth-card {
    width: min(100%, 600px);
}

.auth-card-header {
    margin-bottom: 18.40px;
}

.auth-card-kicker {
    margin: 0 0 7.20px;
    color: var(--auth-purple, #6c3a96);
    font-size: 12.80px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.auth-card-title {
    margin: 0;
    color: var(--auth-ink, #3d1e58);
    font-size: 27.20px;
    font-weight: 800;
    letter-spacing: -.03em;
}

.auth-card-title-name {
    margin-left: 8px;
    color: var(--auth-purple, #6c3a96);
    font-size: 15.20px;
    font-weight: 700;
    letter-spacing: 0;
}

.auth-card-tip {
    margin: 10.40px 0 0;
    color: var(--auth-muted, #8a8294);
    font-size: 14.40px;
}

.auth-card-tip a,
.auth-links a,
.auth-page a.auth-forgot {
    color: var(--auth-purple, #6c3a96);
    font-weight: 700;
}

.auth-links a.auth-forgot {
    margin-right: 6.40px;
}

/* 覆盖旧 .lyLogin_title 的 span 浮动与绿色链接 */
.auth-page .lyLogin_title span {
    float: none;
}

/* ---- 错误提示（旧 li.ly_err 的替代展示形态） ---- */
.auth-error {
    display: flex;
    align-items: flex-start;
    gap: 9.60px;
    margin: 0 0 16px;
    padding: 12px 13.60px;
    border: 1px solid #f0cf82;
    border-radius: 11.20px;
    background: #fff8e6;
    color: #9a6b13;
    font-size: 15.20px;
    line-height: 1.5;
}

.auth-error span[aria-hidden] {
    flex: 0 0 auto;
    display: inline-flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f2b04e;
    color: #fff;
    font-size: 13.60px;
    font-weight: 800;
}

/* ---- 表单字段 ---- */
.auth-form {
    margin: 0;
}

.auth-field {
    position: relative;
    margin-bottom: 12px;
}

.auth-field label {
    display: block;
    margin: 0 0 5.60px;
    color: var(--auth-ink, #3d1e58);
    font-size: 14.40px;
    font-weight: 700;
}

.auth-field .form-control,
.auth-field input[type="text"],
.auth-field input[type="password"] {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    height: 41.60px;
    margin: 0;
    padding: 0 14.40px !important;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
    border-radius: 12px;
    background: #fdfbfe;
    color: var(--auth-ink, #3d1e58);
    font-size: 14.40px;
    line-height: 1.2;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.auth-field .form-control:focus,
.auth-field input[type="text"]:focus,
.auth-field input[type="password"]:focus {
    border-color: var(--auth-amber, #efa95a);
    outline: 0;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(74, 35, 117, .1);
}

.auth-form .form-control.invalid-text,
.auth-form input.invalid-text,
.auth-form select.invalid-text {
    border-color: #eab15e !important;
    background: #fffaf0 !important;
    box-shadow: 0 0 0 4px rgba(239, 169, 90, .18) !important;
}

.auth-form .invalid-msg {
    display: block;
    width: 100%;
    margin-top: 5.60px;
    color: #b8860b;
    font-size: 13.60px;
    line-height: 1.45;
    white-space: nowrap;
}

.auth-field select.form-control {
    height: 41.60px;
    padding: 0 11.20px !important;
}

.auth-field-hint {
    margin: 5.60px 0 0;
    color: var(--auth-muted, #8a8294);
    font-size: 12.80px;
    line-height: 1.5;
}

/* 注册页：+86 区号前缀 + 手机号并排 */
.auth-mobile-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9.60px;
    align-items: stretch;
}

.auth-page .select-country {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54.40px;
    margin: 0;
    padding: 0 9.60px;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
    border-radius: 12px;
    background: #f6f1fb;
    color: var(--auth-ink, #3d1e58);
    font-size: 14.40px;
    font-weight: 800;
    line-height: 1;
    cursor: default;
}

/* ---- 验证码并排行 ---- */
.auth-code-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10.40px;
}

.auth-code-row input[type="button"] {
    min-width: 132px;
    min-height: 41.60px;
    margin: 0;
    padding: 0 12.80px;
    border: 1px solid rgba(239, 169, 90, .45);
    border-radius: 11.20px;
    background: #fff4dd;
    color: var(--auth-purple, #6c3a96);
    font-size: 14.40px;
    font-weight: 700;
    cursor: pointer;
}

.auth-code-row input[type="button"]:disabled {
    color: #9ca3af;
    cursor: not-allowed;
}

/* ---- 主按钮（琥珀胶囊，对齐 T5/T6 主操作） ---- */
/* 按钮外层 label 通栏（bootstrap 默认 inline-block 收缩包裹会把 width:100% 挤窄） */
.auth-page .auth-submit-row {
    display: block;
    width: 100%;
    margin: 0;
}

.auth-page .auth-submit {
    display: block;
    width: 100%;
    height: 41.60px;
    margin-top: 12px;
    padding: 0 24px;
    border: 0;
    border-radius: 12px;
    background: var(--auth-amber, #efa95a);
    color: #4a2410;
    font-size: 15.20px;
    font-weight: 800;
    line-height: 41.60px;
    letter-spacing: .08em;
    box-shadow: 0 11.20px 24px rgba(239, 169, 90, .6);
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.auth-page .auth-submit:hover {
    background: #e78f3a;
    transform: translateY(-1px);
    box-shadow: 0 14.40px 28.80px rgba(239, 169, 90, .7);
}

/* ---- 记住密码 / 切换链接行 ---- */
.auth-options {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8.80px;
    margin-top: 12px;
    color: var(--auth-muted, #8a8294);
    font-size: 14.40px;
}

.auth-page .auth-check {
    display: inline-flex;
    align-items: center;
    gap: 7.20px;
    margin: 0;
    color: var(--auth-muted, #8a8294);
    font-size: 14.40px;
    font-weight: 400;
    cursor: pointer;
}

.auth-page .auth-check input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    flex: none;
    box-sizing: border-box;
    width: 18.40px;
    height: 18.40px;
    margin: 0;
    padding: 0;
    border: 1.6px solid rgba(61, 30, 88, .30);
    border-radius: 5.20px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 11px 11px;
    cursor: pointer;
    vertical-align: middle;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.auth-page .auth-check input[type="checkbox"]:hover {
    border-color: var(--auth-purple, #6c3a96);
}

.auth-page .auth-check input[type="checkbox"]:checked {
    border-color: var(--auth-purple, #6c3a96);
    background-color: var(--auth-purple, #6c3a96);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.8 12.8l4.8 4.8L19.2 7.2'/%3E%3C/svg%3E");
    box-shadow: 0 0 0 3.20px rgba(108, 58, 150, .14);
}

.auth-page .auth-check input[type="checkbox"]:focus-visible {
    outline: 2px solid rgba(108, 58, 150, .45);
    outline-offset: 2px;
}

/* 屏蔽 new_style.css 的全局复选框伪元素（红底白✓，会叠在自绘样式上层） */
.auth-page .auth-check input[type="checkbox"]::before,
.auth-page .auth-check input[type="checkbox"]::after {
    content: none;
}

/* ============================================================
 * 第三方登录（覆盖旧 .getOauthList 全局样式）
 * ============================================================ */
.auth-page .getOauthList {
    margin-top: 17.60px;
    padding-top: 12.80px;
    overflow: visible;
    border-top: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
}

.auth-page .getOauthList h2 {
    position: relative;
    display: block;
    margin: 0 0 12px;
    overflow: visible;
    color: var(--auth-muted, #8a8294);
    font-size: 14.40px;
    font-weight: 700;
    text-align: center;
}

.auth-page .getOauthList h2::after {
    width: 100%;
    background: var(--auth-line, rgba(61, 30, 88, .12));
}

.auth-page .getOauthList h2 span {
    position: relative;
    z-index: 1;
    padding: 0 10.40px;
    background: transparent;
}

.auth-page .getOauthList p {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8.80px;
    margin: 0;
    margin-top: 0;
}

.auth-page .getOauthList p a {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 6.40px;
    width: auto;
    min-width: 72px;
    padding: 7.20px 8.80px;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
    border-radius: 10.40px;
    color: #4a4460;
    font-size: 14.40px;
    text-align: center;
    transition: border-color .2s ease, background .2s ease;
}

.auth-page .getOauthList p a:last-child {
    border-right: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
}

.auth-page .getOauthList p a:hover {
    border-color: rgba(239, 169, 90, .6);
    background: #f3eff7;
}

.auth-page .getOauthList p a img {
    width: 21.60px;
    height: 21.60px;
    margin: 0;
    object-fit: contain;
}

.auth-page .getOauthList p a span {
    line-height: 1.2;
}

/* ============================================================
 * 微信扫码登录形态
 * ============================================================ */
.auth-page .click_wechat_show {
    display: none;
    text-align: center;
}

.auth-wechat .wechat-heading {
    margin: 0 0 16px;
    color: var(--auth-ink, #3d1e58);
    font-size: 20px;
    font-weight: 800;
}

.auth-page #login_container {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    max-width: 300px;
    height: 400px !important;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
    border-radius: 13.60px;
    background: #fff;
}

.auth-wechat .wechat-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7.20px;
    margin-top: 24px;
    color: var(--auth-muted, #8a8294);
    font-size: 16px;
}

.auth-wechat .wechat-actions a,
.auth-wechat .wechat-actions .c_w_show_login {
    color: var(--auth-purple, #6c3a96);
    font-weight: 700;
    cursor: pointer;
}

/* 微信二维码加载遮罩（weChatLogin() 动态插入的纯展示节点） */
#qrcode_loading {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13.60px;
    background: rgba(255, 255, 255, .82);
}

#qrcode_loading .qr-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid rgba(108, 58, 150, .25);
    border-top-color: var(--auth-purple, #6c3a96);
    border-radius: 50%;
    animation: auth-spin .8s linear infinite;
}

@keyframes auth-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ============================================================
 * 保障条（对齐 laravel auth 页 n6-assurances）
 * ============================================================ */
.auth-assurance-band {
    max-width: 1400px;
    box-sizing: border-box;
    margin: 16px auto 0;
}

.auth-page .n6-assurances {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    min-height: 88px;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12));
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 28px -14px rgba(74, 35, 117, .16);
}

.auth-page .n6-assurance {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 8px;
}

.auth-page .n6-assurance-icon {
    display: grid;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--auth-hero, linear-gradient(120deg, #4a2375 0%, #6b3a94 55%, #8e5ba6 100%));
    box-shadow: 0 8px 18px -6px rgba(74, 35, 117, .55);
    font-size: 18px;
    transform-origin: center;
    transition: transform .25s ease;
}

@media (hover: hover) {
    .auth-page .n6-assurance-icon:hover {
        transform: scale(1.12) rotate(-7deg);
    }
}

.auth-page .n6-assurance b {
    display: block;
    color: var(--auth-ink, #3d1e58);
    font-size: 16px;
}

.auth-page .n6-assurance small {
    display: block;
    color: var(--auth-muted, #8a8294);
    font-size: 13px;
}

/* ============================================================
 * 注册页步骤（ul 展示形态；不设置 display，交给既有 JS 显隐控制）
 * ============================================================ */
.auth-page ul.auth-step {
    margin: 0;
    padding: 0;
    list-style: none;
}

.auth-page .reg-step-heading {
    margin: 0 0 14.40px;
    color: var(--auth-muted, #8a8294);
    font-size: 14px;
    font-weight: 700;
}

/* 注册页会员服务协议（.form-agreen.getOauthList，第二步由 JS 显示） */
.auth-page .auth-agreement {
    margin-top: 17.60px;
    padding: 0;
    border-top: 0;
}

/* ============================================================
 * 找回密码页（recovery，紫底居中白卡）
 * ============================================================ */
.mi_body.recovery-page {
    padding: clamp(40px, 6vw, 96px) clamp(14px, 3vw, 48px);
    background:
        radial-gradient(circle at 84% 10%, rgba(239, 169, 90, .25), transparent 26%),
        radial-gradient(circle at 6% 100%, rgba(255, 255, 255, .12), transparent 32%),
        var(--auth-hero, linear-gradient(120deg, #4a2375 0%, #6b3a94 55%, #8e5ba6 100%));
}

.recovery-page .container {
    width: auto;
    max-width: 680px;
    height: auto;
    margin: 0 auto;
    padding: 0;
    min-width: 0 !important;
}

.recovery-page .find_container {
    width: 100%;
    box-sizing: border-box;
    height: auto;
    padding: clamp(28px, 4vw, 40px);
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 20px;
    background: rgba(255, 255, 255, .97);
    box-shadow: var(--auth-shadow, 0 26px 60px -22px rgba(30, 12, 48, .45));
}

.recovery-page .find_process_h {
    margin: 0;
    color: var(--auth-ink, #3d1e58);
    font-size: 24px;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.recovery-page .find_process {
    width: auto;
    height: auto;
    margin: 28px auto 32px;
}

.recovery-page .find_process ul {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: min(100%, 500px);
    height: auto;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

/* 旧 .clearfix 的 ::before/::after 伪元素在 grid 中会成为隐形 item 占格，禁用之 */
.recovery-page .find_process ul::before,
.recovery-page .find_process ul::after {
    content: none !important;
    display: none !important;
}

/* 覆盖旧 new_style.css 的 nth-child em 定宽（width:100%） */
.recovery-page .find_process li:nth-child(2) em {
    width: calc(100% - 36px);
    left: calc(50% + 18px);
}

.recovery-page .find_process li {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    float: none;
    min-width: 0;
    width: auto;
    height: auto;
    margin: 0;
    color: #b0a8b9;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

/* 步骤连接线（em：Vue 通过 opacitys 类标记已完成段）；
   几何对齐 36px 圆圈（半径 18px）：起点=本圆右缘，终点=下一圆左缘，两端无缝衔接 */
.recovery-page .find_process li em {
    position: absolute;
    z-index: 0;
    top: 17px;
    left: calc(50% + 18px);
    display: block;
    width: calc(100% - 36px);
    height: 2px;
    border-radius: 999px;
    background: #d8ccdf;
    opacity: 1;
}

/* 末步（完成）后没有下一格，去掉多余线头 */
.recovery-page .find_process li:last-child em {
    display: none;
}

/* 覆盖旧 new_style.css 的 nth-child(1) em{left:50%}，几何与基础规则一致 */
.recovery-page .find_process li:nth-child(1) em {
    top: 17px;
    left: calc(50% + 18px);
    width: calc(100% - 36px);
    background: #d8ccdf;
    opacity: 1;
}

.recovery-page .find_process li em.opacitys {
    background: var(--auth-purple, #6c3a96);
}

.recovery-page .find_process li p {
    position: relative;
    z-index: 1;
    width: auto;
    margin: 0;
}

.recovery-page .find_process .FF1A2b {
    color: var(--auth-purple, #6c3a96);
}

/* 数字圆圈步骤图标 */
.recovery-page .find_process .recovery-step-icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
    border: 1px solid #e5ddea;
    border-radius: 50%;
    color: #9b92a5;
    background: #f8f6fa;
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: 1;
}

.recovery-page .find_process .recovery-step-icon.is-active {
    border-color: var(--auth-purple, #6c3a96);
    color: #fff;
    background: var(--auth-purple, #6c3a96);
    box-shadow: 0 8px 18px -8px rgba(108, 58, 150, .7);
}

/* ---- 表单区 ---- */
.recovery-page .find_phone_input {
    width: min(100%, 470px);
    height: auto;
    margin: 0 auto;
}

.recovery-page .find_phone_input ul {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    width: auto;
    max-width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.recovery-page .find_phone_input ul li {
    display: grid;
    gap: 7px;
    min-width: 0;
    margin: 0;
    padding: 0;
}

.recovery-page .find_phone_input ul li > span:first-child {
    width: auto !important;
    color: var(--auth-ink, #3d1e58);
    font-size: 14px;
    font-weight: 700;
    text-align: left;
}

.recovery-page .find_phone_input .form-control {
    box-sizing: border-box;
    display: block;
    width: 100% !important;
    min-height: 42px;
    height: auto;
    margin: 0;
    padding: 8px 12px !important;
    border: 1px solid var(--auth-line, rgba(61, 30, 88, .12)) !important;
    border-radius: 10px;
    background: #fdfbfe;
    color: #352f42;
    font-size: 14px;
    line-height: 1.6;
    box-shadow: none;
}

.recovery-page .find_phone_input .form-control:focus {
    border-color: var(--auth-purple, #6c3a96) !important;
    outline: 3px solid rgba(108, 58, 150, .1);
    background: #fff;
    box-shadow: none;
}

/* 验证码行：输入框 + 发送按钮 */
.recovery-page .find_phone_input li.recovery-field-code {
    grid-template-columns: minmax(0, 1fr) 148px;
    align-items: end;
}

.recovery-page .find_phone_input li.recovery-field-code > span:first-child {
    grid-column: 1 / -1;
}

.recovery-page .find_phone_input li.recovery-field-code > input {
    grid-column: 1;
}

.recovery-page .find_phone_input .btn-yanzheng {
    grid-column: 2;
    width: 148px;
    min-height: 42px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid rgba(108, 58, 150, .2);
    border-radius: 999px;
    color: var(--auth-purple, #6c3a96);
    background: #f6f1fb;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
    white-space: nowrap;
    cursor: pointer;
    transition: background .2s ease;
}

.recovery-page .find_phone_input .btn-yanzheng:hover:not(:disabled) {
    background: #ede3f7;
}

.recovery-page .find_phone_input .btn-yanzheng.dark_button,
.recovery-page .find_phone_input .btn-yanzheng:disabled {
    color: #9b92a5;
    background: #f3f1f5;
    cursor: wait;
}

.recovery-page .find_phone_input li > p {
    grid-column: 1 / -1;
    margin: -7px 0 0;
    color: var(--auth-muted, #8a8294);
    font-size: 12px;
    line-height: 1.5;
}

/* ---- 操作按钮行 ---- */
.recovery-page .find_phone_input li.recovery-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 8px;
}

.recovery-page .find_phone_input li.recovery-actions > span {
    display: none;
}

.recovery-page .find_phone_input li.recovery-actions a,
.recovery-page .find_phone_input li.recovery-actions button {
    display: inline-flex;
    flex: 1 1 0;
    min-width: 0;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 9px 18px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
    text-decoration: none;
    cursor: pointer;
}

.recovery-page .find_phone_input li.recovery-actions a.recovery-switch {
    color: var(--auth-purple, #6c3a96);
    border-color: rgba(108, 58, 150, .18);
    background: #f6f1fb;
}

.recovery-page .find_phone_input li.recovery-actions a.recovery-switch:hover {
    background: #ede3f7;
}

.recovery-page .find_container .find_phone_input .btn-find {
    color: #4a2410;
    background: var(--auth-amber, #efa95a);
    box-shadow: 0 10px 22px -8px rgba(239, 169, 90, .55);
    transition: background .2s ease;
}

.recovery-page .find_container .find_phone_input .btn-find:hover:not(:disabled) {
    background: #e78f3a;
}

.recovery-page .find_container .find_phone_input .btn-find:disabled {
    cursor: wait;
    opacity: .6;
}

/* ---- 完成态 / 邮件发送态 ---- */
.recovery-page .find_container .completed,
.recovery-page .find_container .emit_success {
    padding: 16px 0 8px;
    text-align: center;
}

.recovery-page .find_container .completed_box,
.recovery-page .find_container .emit_box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin: 0 0 24px;
}

.recovery-page .find_container .completed i {
    display: inline-flex;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: var(--auth-purple, #6c3a96);
    box-shadow: 0 8px 18px -8px rgba(108, 58, 150, .7);
    font-size: 26px;
}

.recovery-page .find_container .emit_box img {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.recovery-page .find_container .completed_right,
.recovery-page .find_container .emit_info {
    text-align: left;
}

.recovery-page .find_container .completed .completed_right span {
    display: block;
    color: var(--auth-ink, #3d1e58);
    font-size: 16px;
    font-weight: 800;
}

.recovery-page .find_container .completed .completed_right p,
.recovery-page .find_container .emit_info p {
    margin: 4px 0 0;
    color: var(--auth-muted, #8a8294);
    font-size: 13px;
    line-height: 1.6;
}

.recovery-page .find_container .emit_info p:first-child {
    margin-top: 0;
    color: var(--auth-ink, #3d1e58);
    font-size: 16px;
    font-weight: 800;
}

.recovery-page .find_container .emit_info a {
    color: var(--auth-purple, #6c3a96);
    font-weight: 700;
}

.recovery-page .find_container .completed button {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
}

.recovery-page .find_container .completed a.home {
    display: inline-flex;
    min-width: 180px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 9px 18px;
    border-radius: 8px;
    color: #4a2410;
    background: var(--auth-amber, #efa95a);
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 10px 22px -8px rgba(239, 169, 90, .55);
}

.recovery-page .find_container .completed a.home:hover {
    background: #e78f3a;
}

/* ============================================================
 * 响应式
 * ============================================================ */
@media (max-width: 900px) {
    .auth-brand-panel {
        display: none;
    }

    .auth-panel {
        flex: 1 1 100%;
        padding: 20px;
    }

    .mi_body.auth-page {
        padding: 16px 14px 32px;
    }

    .lycoLoginBody.auth-card {
        min-height: 0;
    }

    .auth-page .n6-assurances {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
        padding: 14px 0;
    }

    .auth-page .n6-assurance:last-child {
        grid-column: 1 / 3;
    }
}

@media (max-width: 560px) {
    .lycoLoginBody.auth-card {
        padding: 21.60px;
        border-radius: 16px;
    }

    .auth-options {
        align-items: flex-start;
        flex-direction: column;
    }

    .auth-code-row {
        grid-template-columns: 1fr;
    }

    .auth-code-row input[type="button"] {
        width: 100%;
    }

    .recovery-page .find_phone_input li.recovery-field-code {
        grid-template-columns: minmax(0, 1fr);
    }

    .recovery-page .find_phone_input li.recovery-field-code > input,
    .recovery-page .find_phone_input .btn-yanzheng {
        grid-column: 1;
        width: 100%;
    }

    .recovery-page .find_phone_input li.recovery-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .recovery-page .find_phone_input li.recovery-actions a,
    .recovery-page .find_phone_input li.recovery-actions button {
        width: 100%;
    }

    .recovery-page .completed_box,
    .recovery-page .emit_box {
        align-items: flex-start;
        flex-direction: column;
        text-align: center;
    }

    .recovery-page .completed_right,
    .recovery-page .emit_info {
        width: 100%;
        text-align: center;
    }
}

@media (max-height: 760px) and (min-width: 901px) {
    .auth-panel {
        align-items: flex-start;
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

/* ============================================================
 * 暗色模式（对齐 site-chrome 暗色令牌）
 * ============================================================ */
html[data-yys-theme="dark"] body .mi_body.auth-page {
    --auth-ink: #f3e9c9;
    --auth-muted: #aaa497;
    --auth-line: rgba(235, 224, 201, .16);
    background: #26221f;
}

html[data-yys-theme="dark"] body .auth-shell {
    box-shadow: none;
}

html[data-yys-theme="dark"] body .lycoLoginBody.auth-card {
    border-color: rgba(235, 224, 201, .16);
    background: rgba(48, 45, 42, .97);
}

html[data-yys-theme="dark"] body .auth-card-tip,
html[data-yys-theme="dark"] body .auth-options,
html[data-yys-theme="dark"] body .auth-page .auth-check {
    color: #aaa497;
}

html[data-yys-theme="dark"] body .auth-page .auth-check input[type="checkbox"] {
    border-color: rgba(235, 224, 201, .30);
    background-color: rgba(38, 34, 31, .9);
}

html[data-yys-theme="dark"] body .auth-field label {
    color: #f3e9c9;
}

html[data-yys-theme="dark"] body .auth-field .form-control,
html[data-yys-theme="dark"] body .auth-field input[type="text"],
html[data-yys-theme="dark"] body .auth-field input[type="password"],
html[data-yys-theme="dark"] body .auth-field select.form-control,
html[data-yys-theme="dark"] body .recovery-page .find_phone_input .form-control {
    border-color: rgba(235, 224, 201, .18);
    background: rgba(38, 34, 31, .9);
    color: #f3e9c9;
}

html[data-yys-theme="dark"] body .auth-page .select-country {
    border-color: rgba(235, 224, 201, .18);
    background: rgba(73, 64, 53, .5);
    color: #f3e9c9;
}

html[data-yys-theme="dark"] body .auth-page .getOauthList h2 span {
    background: transparent;
}

html[data-yys-theme="dark"] body .auth-page .getOauthList p a {
    border-color: rgba(235, 224, 201, .18);
    color: #e6e0d5;
}

html[data-yys-theme="dark"] body .auth-page .getOauthList p a:hover {
    background: rgba(73, 64, 53, .5);
}

html[data-yys-theme="dark"] body .auth-page #login_container {
    border-color: rgba(235, 224, 201, .18);
    background: #fff;
}

html[data-yys-theme="dark"] body .auth-page .n6-assurances {
    border-color: rgba(235, 224, 201, .16);
    background: #303334;
}

html[data-yys-theme="dark"] body .auth-page .n6-assurance b {
    color: #e6e0d5;
}

html[data-yys-theme="dark"] body .auth-page .n6-assurance small {
    color: #aaa497;
}

html[data-yys-theme="dark"] body .recovery-page .find_container {
    border-color: rgba(235, 224, 201, .16);
    background: rgba(48, 45, 42, .97);
}

html[data-yys-theme="dark"] body .recovery-page .find_process_h,
html[data-yys-theme="dark"] body .recovery-page .find_phone_input ul li > span:first-child,
html[data-yys-theme="dark"] body .recovery-page .completed_right span,
html[data-yys-theme="dark"] body .recovery-page .find_container .emit_info p:first-child {
    color: #f3e9c9;
}

html[data-yys-theme="dark"] body .recovery-page .find_process .recovery-step-icon {
    border-color: rgba(235, 224, 201, .18);
    background: rgba(73, 64, 53, .5);
    color: #aaa497;
}

html[data-yys-theme="dark"] body .recovery-page .find_phone_input .btn-yanzheng,
html[data-yys-theme="dark"] body .recovery-page .find_phone_input li.recovery-actions a.recovery-switch {
    border-color: rgba(235, 224, 201, .2);
    background: rgba(73, 64, 53, .5);
    color: #f3dfb1;
}

html[data-yys-theme="dark"] body .recovery-page .find_phone_input li > p,
html[data-yys-theme="dark"] body .recovery-page .completed_right p,
html[data-yys-theme="dark"] body .recovery-page .emit_info p,
html[data-yys-theme="dark"] body .recovery-page .find_process li {
    color: #aaa497;
}

/* 减弱动态效果偏好 */
@media (prefers-reduced-motion: reduce) {
    .auth-page *,
    .recovery-page * {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* ============================================================
 * 登录页布局对齐 laravel（.auth-login-page 作用域，不影响 reg2/找回密码）
 * 参考 laravel 新项目 front/auth/login.blade.php 的布局形态：
 * 壳体通栏铺满（无外框圆角阴影）、随视口撑满高度、保障条按
 * --n6-gutter 通栏留白；尺寸/断点/悬停参数逐项对齐该参考页。
 * 仅展示层，rem 值按 16px 基准换算为 px（旧全局 html{font-size:10px}）。
 * ============================================================ */

/* 页面纵向弹性布局：头部/尾部自然高度，登录区撑满剩余视口（对齐 laravel
   site_mini 布局 body flex column + site-mini-main flex:1 0 auto）。
   横向裁剪挂 html 根元素（clip 不产生滚动容器；效果等同 laravel
   body.auth-page{overflow-x:hidden}，但不会连带把 body 的 overflow-y
   计算为 auto 而变成滚动容器）。左品牌面板装饰圆环（::after 右越界 192px）
   借此裁剪，无横向滚动条。 */
html:has(body .mi_body.auth-login-page) {
    overflow-x: clip;
}

body:has(.mi_body.auth-login-page) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* 登录页 body 底色随页面纯白（覆盖 new_style.css 全局 body #f5f5f5） */
body:has(.mi_body.auth-login-page) {
    background: #fff;
}

body:has(.mi_body.auth-login-page) .site-chrome-header.n6-header,
body:has(.mi_body.auth-login-page) .n6-footer.site-chrome-footer {
    flex: 0 0 auto;
}

/* 通栏留白令牌（对齐 laravel --n6-gutter：70 / @1180 40 / @820 14）。
   原 min-height:100vh 会让壳体(flex:1)撑满视口、保障条被推到首屏之下；
   改为不设视口最小高，壳体高度回落为内容自然高度，保障条首屏可见。 */
.mi_body.auth-login-page {
    --n6-gutter: 70px;
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    padding: 0;
    /* 页面外层底色：覆盖旧 .mi_body 的黄色底(#FFD237)与换肤淡紫底(#f5f2f7)，改纯白 */
    background: #fff;
}

@media (max-width: 1180px) {
    .mi_body.auth-login-page {
        --n6-gutter: 40px;
    }
}

@media (max-width: 820px) {
    .mi_body.auth-login-page {
        --n6-gutter: 14px;
    }
}

/* 壳体通栏：去居中外框（laravel .auth-shell 为 edge-to-edge、overflow:visible）。
   flex 改 0 0 auto：不再吞掉页面剩余空间；
   紫色区高度固定 837px（用户指定），保障条始终首屏可见 */
.auth-login-page .auth-shell {
    flex: 0 0 auto;
    min-height: 837px;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    overflow: visible;
    border-radius: 0;
    box-shadow: none;
}

/* 品牌面板文案尺寸对齐 laravel（1.125rem/2.1-3.4rem/1.5rem/2.25rem） */
.auth-login-page .auth-brand-eyebrow {
    font-size: 18px;
}

.auth-login-page .auth-brand-mark {
    width: 120px;
    height: 120px;
}

/* 品牌区垂直居中基准改为 h1 标题：logo 图自带透明留边，按整块内容居中时
   视觉重心偏下；改为「上组 1fr / 标题 auto / 下组 1fr」三行网格，
   标题恒定位于面板垂直中心，上组贴标题上缘、下组贴标题下缘（组内间距不变） */
/* 水平居中基准（用户指定）：介于「浏览器左边缘」与「登录白卡左边界」之间。
   白卡在右半区 [50vw,100vw] 内水平居中：卡定宽 544 时卡左缘 = 75vw−272，
   卡随面板收缩时卡左缘 = 50vw+P（P = 面板水平 padding clamp(20px,3vw,56px)）。
   期望中心 = 卡左缘/2，较当前面板中心（25vw）右移 Δ，margin-left = 2Δ 补偿：
   margin-left = max(25vw−272px, P)，两分支在卡恰好定宽的临界视口处相等 */
.auth-login-page .auth-brand-content {
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    align-self: stretch;
    margin-left: max(calc(25vw - 272px), clamp(20px, 3vw, 56px));
}

/* 居中构图：内容列中心（=「浏览器左缘↔白卡左缘」中点）即 h1 文字中心。
   标题文字原为列内左对齐，视觉重心偏左导致两侧间距不等；
   logo/eyebrow/标题/卖点全部沿中线居中后，h1 盒子中心 = 文字中心 = 中点。
   head 组用 flex 列 + align-items:center：对 img 无论被全局规则改成
   block 还是保持 inline 都确定性居中，不依赖 text-align/margin:auto */
.auth-login-page .auth-brand-head {
    align-self: end;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* logo 与 eyebrow 左对齐（用户指定）：两者包进收缩盒子 head-box，
   盒子整体居中（eyebrow 为盒内最宽元素 → eyebrow 位置与之前完全一致），
   盒内两者 align-items:flex-start → logo 左边缘 = eyebrow 左边缘 */
.auth-login-page .auth-brand-head-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.auth-login-page .auth-brand-title {
    text-align: center;
}

.auth-login-page .auth-brand-title {
    font-size: clamp(33.6px, 3.2vw, 54.4px);
    line-height: 1.08;
    letter-spacing: -.06em;
}

.auth-login-page .auth-brand-description {
    margin: 24px 0 0;
    color: rgba(255, 255, 255, .7);
    font-size: 18px;
}

/* 品牌卖点改为横排（试验效果），允许换行 */
.auth-login-page .auth-brand-points {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
    margin: 25px 0 0;
    align-self: start;
    justify-content: center;
    text-align: center;
}

/* 表单面板与白卡（对齐 laravel align-items:safe center、卡 34rem 高、.94 透明度） */
.auth-login-page .auth-panel {
    align-items: safe center;
}

.auth-login-page .lycoLoginBody.auth-card {
    min-height: 544px;
    background: rgba(255, 255, 255, .78);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

.auth-login-page .auth-card-title {
    font-size: 29.6px;
}

.auth-login-page .auth-error {
    font-size: 16px;
}

.auth-login-page .auth-form .invalid-msg {
    color: #FF1A2B;
}

.auth-login-page .auth-options {
    gap: 12px;
}

.auth-login-page .auth-check input[type="checkbox"] {
    width: 20px;
    height: 20px;
}

/* 保障条：通栏 + gutter 留白（laravel .auth-assurance-band padding-inline）。
   margin 改 0：旧 T10 的 auto 水平边距在本容器（flex column）下会吞掉
   stretch 自由空间，保障条收缩居中（探针实测 1032px），必须归零。 */
.auth-login-page .auth-assurance-band {
    max-width: none;
    margin: 0;
    padding-inline: var(--n6-gutter, 70px);
}

.auth-login-page .n6-assurances {
    margin: 22px 0 0;
}

.auth-login-page .n6-assurance-icon:hover {
    transform: scale(1.2) rotate(-7deg);
}

/* ---- 响应式（对齐 laravel 断点：品牌面板 ≤860 隐藏、卡内边距 ≤420） ---- */
@media (max-width: 900px) and (min-width: 861px) {
    .auth-login-page .auth-brand-panel {
        display: flex;
    }

    .auth-login-page .auth-panel {
        padding: 24px clamp(20px, 3vw, 56px);
    }
}

@media (max-width: 860px) {
    .auth-login-page .auth-brand-panel {
        display: none;
    }

    .auth-login-page .auth-panel {
        flex: 1 1 100%;
        padding: 20px;
    }

    .auth-login-page .lycoLoginBody.auth-card {
        min-height: 0;
    }

    .auth-login-page .n6-assurances {
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        padding: 16px 0;
    }

    .auth-login-page .n6-assurance:last-child {
        grid-column: 1 / 3;
    }

    .mi_body.auth-login-page {
        padding: 0 0 32px;
    }
}

@media (max-height: 760px) and (min-width: 861px) {
    .auth-login-page .auth-panel {
        align-items: flex-start;
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

@media (max-width: 420px) {
    .auth-login-page .lycoLoginBody.auth-card {
        padding: 21.6px;
        border-radius: 16px;
    }

    .auth-login-page .auth-options {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ============================================================
 * 注册页布局对齐 laravel（.auth-register-page 作用域，不影响登录/找回密码）
 * 参考 laravel 新项目 front/auth/register.blade.php + layouts/front_auth +
 * public/css/front-auth.css 的视觉设计：紫底 hero 渐变 + 居中 600px 白卡
 * 双步表单 + 琥珀胶囊按钮（与登录页的双栏 auth-shell 形态不同）。
 * DOM 不动：仍复用 auth-shell/brand-panel/auth-card 结构，仅展示层重定向；
 * rem 值按 16px 基准换算为 px（旧全局 html{font-size:10px}）。
 * ============================================================ */

/* 页面：紫底 hero 渐变 + 125px 上下留白（laravel .front-auth-main:has(#register-page)），
   内容水平居中由白卡 margin auto 实现 */
.mi_body.auth-register-page {
    padding: 125px clamp(14px, 3vw, 48px);
    background:
        radial-gradient(circle at 84% 10%, rgba(239, 169, 90, .25), transparent 26%),
        radial-gradient(circle at 6% 100%, rgba(255, 255, 255, .12), transparent 32%),
        var(--auth-hero, linear-gradient(120deg, #4a2375 0%, #6b3a94 55%, #8e5ba6 100%));
}

/* 壳体退化为普通块（双栏/渐变/圆角全部让位页面级紫底） */
.auth-register-page .auth-shell {
    display: block;
    max-width: none;
    min-height: 0;
    margin: 0;
    overflow: visible;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

/* 品牌面板隐藏（laravel 注册页为单卡，无左侧品牌栏；login_ad 广告随面板一并隐藏） */
.auth-register-page .auth-brand-panel {
    display: none;
}

.auth-register-page .auth-panel {
    display: block;
    flex: none;
    padding: 0;
}

/* 白卡：居中（laravel .register-panel 覆盖 front-auth-panel 的 680px；
   laravel width:600px 为 content-box（旧项目 bootstrap 全局 border-box），
   按 live 渲染宽度 666=600+32×2+2 对齐） */
.auth-register-page .lycoLoginBody.auth-card {
    width: min(100%, 666px);
    min-height: 0;
    margin: 0 auto;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 20px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 26px 60px -22px rgba(30, 12, 48, .45);
}

/* 卡头：标题下方留白对齐 laravel 首段 p 的 margin-bottom 28px */
.auth-register-page .auth-card-header {
    margin-bottom: 28px;
}

/* 步骤标题（laravel .register-step-heading：14px/700/灰紫） */
.auth-register-page .reg-step-heading {
    margin: 0 0 16px;
    color: var(--auth-muted, #8a8294);
    font-size: 14px;
    font-weight: 700;
}

/* 字段：间距 16px（laravel .register-step gap 16），输入框圆角 10、聚焦紫环 */
.auth-register-page .auth-field {
    margin-bottom: 16px;
}

.auth-register-page .auth-field .form-control,
.auth-register-page .auth-field input[type="text"],
.auth-register-page .auth-field input[type="password"],
.auth-register-page .auth-field select.form-control {
    border-radius: 10px;
}

.auth-register-page .auth-field .form-control:focus,
.auth-register-page .auth-field input[type="text"]:focus,
.auth-register-page .auth-field input[type="password"]:focus {
    border-color: var(--auth-purple, #6c3a96);
    box-shadow: 0 0 0 3px rgba(108, 58, 150, .1);
}

/* 主按钮：琥珀胶囊 320px 居中（laravel #register-page .front-auth-button） */
.auth-register-page .auth-submit-row {
    display: flex;
    justify-content: center;
}

.auth-register-page .auth-submit {
    width: min(100%, 320px);
    height: 42px;
    margin-top: 8px;
    border-radius: 999px;
    font-size: 15px;
    letter-spacing: .04em;
    line-height: 42px;
    box-shadow: 0 10px 22px -8px rgba(239, 169, 90, .55);
}

/* 验证码行发送按钮：白色紫字胶囊 160px 靠左（laravel .front-auth-button.secondary）。
   注意倒计时期间既有 JS 会内联覆盖 color/background（业务契约，保留） */
.auth-register-page .auth-code-row input[type="button"] {
    width: 160px;
    min-width: 160px;
    border: 1px solid rgba(61, 30, 88, .14);
    border-radius: 999px;
    background: #fff;
    color: var(--auth-ink, #3d1e58);
    box-shadow: none;
}

/* 协议行（laravel .register-agreement：13px/#526071） */
.auth-register-page .auth-agreement {
    margin-top: 18px;
}

.auth-register-page .auth-agreement .auth-check {
    color: #526071;
    font-size: 13.6px;
}

/* ---- 响应式（laravel：@560 页面留白收紧；@640 卡 padding 24/18） ---- */
@media (max-width: 640px) {
    .auth-register-page .lycoLoginBody.auth-card {
        padding: 24px 18px;
    }
}

@media (max-width: 560px) {
    .mi_body.auth-register-page {
        padding: 48px 14px 64px;
    }
}