/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-pcxr367r2n] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-pcxr367r2n] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
body[b-qzy264p8rz] {
    
}
/* /Components/Pages/Login.razor.rz.scp.css */
/* ================= 1. 基础背景与网格 ================= */
.login-bg[b-zb2g8syj7x] {
    min-height: 100vh;
    /* 稍微加深一点的淡蓝渐变，让光晕更明显 */
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 40%, #e0e7ff 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden; /* 确保所有特效不超出屏幕 */
}

/* 全息网格底纹 */
.bg-grid[b-zb2g8syj7x] {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(56, 189, 248, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, 0.08) 1px, transparent 1px);
    background-size: 40px 40px;
    z-index: 1;
    /* 给网格加一个极其缓慢的平移，产生视差错觉 */
    animation: gridMove-b-zb2g8syj7x 20s linear infinite; 
}

/* ================= 2. 漂浮星云 (Nebulas) ================= */
.bg-nebula[b-zb2g8syj7x] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px); /* 强模糊产生云雾感 */
    opacity: 0.5;
    z-index: 2;
    pointer-events: none;
}

.nebula-1[b-zb2g8syj7x] {
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.4) 0%, transparent 70%); /* 天蓝 */
    top: -200px; right: -100px;
    animation: floatNebula1-b-zb2g8syj7x 15s ease-in-out infinite;
}

.nebula-2[b-zb2g8syj7x] {
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(129, 140, 248, 0.3) 0%, transparent 70%); /* 靛蓝/淡紫 */
    bottom: -150px; left: -150px;
    animation: floatNebula2-b-zb2g8syj7x 18s ease-in-out infinite reverse;
}

.nebula-3[b-zb2g8syj7x] {
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(45, 212, 191, 0.3) 0%, transparent 70%); /* 青色 */
    top: 40%; left: 50%;
    transform: translate(-50%, -50%);
    animation: floatNebula3-b-zb2g8syj7x 12s ease-in-out infinite;
}

/* ================= 3. 动态光束扫描 ================= */
.bg-scanline[b-zb2g8syj7x] {
    position: absolute;
    width: 200%;
    height: 150px;
    top: -50%;
    left: -50%;
    background: linear-gradient(
        90deg, 
        transparent, 
        rgba(255, 255, 255, 0.4), 
        rgba(56, 189, 248, 0.2), 
        transparent
    );
    transform: rotate(-45deg);
    z-index: 3;
    pointer-events: none;
    animation: scanline-b-zb2g8syj7x 8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

/* ================= 4. 闪烁微粒 ================= */
.bg-particles[b-zb2g8syj7x] {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
    /* 使用 box-shadow 生成大量粒子，性能比 DOM 节点好得多 */
    background: transparent;
    box-shadow: 
        10vw 20vh 2px 0px rgba(56, 189, 248, 0.6),
        80vw 10vh 1px 0px rgba(129, 140, 248, 0.8),
        30vw 80vh 3px 0px rgba(45, 212, 191, 0.5),
        60vw 60vh 1px 0px rgba(255, 255, 255, 0.9),
        90vw 80vh 2px 0px rgba(56, 189, 248, 0.7),
        15vw 50vh 1px 0px rgba(255, 255, 255, 0.6),
        45vw 30vh 2px 0px rgba(129, 140, 248, 0.5);
    animation: twinkle-b-zb2g8syj7x 4s ease-in-out infinite alternate;
}

/* ================= 5. 装饰线条 (优化) ================= */
.tech-line[b-zb2g8syj7x] {
    position: absolute;
    height: 1px;
    width: 100%;
    z-index: 5;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(56, 189, 248, 0.5), transparent);
}
.line-1[b-zb2g8syj7x] { top: 30%; transform: rotate(-5deg); animation: linePulse-b-zb2g8syj7x 6s infinite; }
.line-2[b-zb2g8syj7x] { bottom: 20%; transform: rotate(3deg); animation: linePulse-b-zb2g8syj7x 8s infinite reverse; }

/* ================= 6. 卡片与按钮 (保持不变) ================= */
.glass-card[b-zb2g8syj7x] {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(20px); /* 增强模糊以应对复杂的背景 */
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(31, 38, 135, 0.15);
    width: 440px;
    padding: 48px 40px;
    z-index: 10; /* 确保卡片在所有特效之上 */
    animation: fadeInUp-b-zb2g8syj7x 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.logo-container[b-zb2g8syj7x] {
    width: 80px; height: 80px;
    background: linear-gradient(135deg, #e0f2fe, #bae6fd);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 24px rgba(56, 189, 248, 0.3);
}

.login-btn[b-zb2g8syj7x] {
    letter-spacing: 2px;
    font-weight: bold;
    border-radius: 12px !important;
    height: 50px !important;
    background: linear-gradient(90deg, #38bdf8, #6366f1) !important; /* 蓝紫渐变按钮 */
    box-shadow: 0 8px 20px rgba(99, 102, 241, 0.3) !important;
    transition: all 0.3s ease;
}
.login-btn:hover[b-zb2g8syj7x] {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(99, 102, 241, 0.4) !important;
}

/* ================= 7. 动画关键帧 (注意：在 .css 文件中用单个 @) ================= */
@keyframes gridMove-b-zb2g8syj7x {
    0% { background-position: 0 0; }
    100% { background-position: 40px 40px; }
}

@keyframes floatNebula1-b-zb2g8syj7x {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(-40px, 30px) scale(1.1); }
}
@keyframes floatNebula2-b-zb2g8syj7x {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(50px, -40px) scale(1.15); }
}
@keyframes floatNebula3-b-zb2g8syj7x {
    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.3; }
    50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.5; }
}

@keyframes scanline-b-zb2g8syj7x {
    0% { transform: translateX(-100%) rotate(-45deg); }
    100% { transform: translateX(100%) rotate(-45deg); }
}

@keyframes twinkle-b-zb2g8syj7x {
    0% { opacity: 0.3; transform: translateY(0); }
    100% { opacity: 1; transform: translateY(-10px); }
}

@keyframes linePulse-b-zb2g8syj7x {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.8; }
}

@keyframes fadeInUp-b-zb2g8syj7x {
    from { opacity: 0; transform: translateY(40px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
/* /Components/Pages/ManageModel.razor.rz.scp.css */
/* 上传区域主容器 (现在是 label 标签) */
.upload-area[b-30zeatycf7] {
    position: relative;
    height: 280px;
    border: 2px dashed #ccc;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #fafafa;
    transition: all 0.3s ease;
    cursor: pointer; /* label 标签设置 pointer 即可 */
}

.upload-area:hover[b-30zeatycf7] {
    border-color: #1976D2;
    background: #f0f7ff;
}

/* ✅ 终极隐藏法：将原生 input 物理压缩并移出视觉流 */
/* 它不再占据任何空间，也不会显示任何文字，但依然能被 label 唤醒 */
.visually-hidden[b-30zeatycf7] {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

/* 图片预览 */
.preview-img[b-30zeatycf7] {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    z-index: 1;
    /* 不再需要 pointer-events: none，因为 label 机制会自动处理点击 */
}

/* 悬浮遮罩层 */
.upload-overlay[b-30zeatycf7] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 5;
}

.upload-area:hover .upload-overlay[b-30zeatycf7] {
    opacity: 1;
}

/* 初始占位符 */
.upload-placeholder[b-30zeatycf7] {
    text-align: center;
}

.file-input-wrapper[b-30zeatycf7] {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

    .file-input-wrapper .visually-hidden[b-30zeatycf7] {
        position: absolute;
        left: -9999px;
        top: -9999px;
        opacity: 0;
        width: 1px;
        height: 1px;
        /* 完全隐藏原生提示 */
    }

/* /Components/Pages/Setting.razor.rz.scp.css */

/* =====================================================================
   线束配置页面样式 v3 —— 现代工业风
   · 结构 / 类名 / HTML 零改动
   · v3 修复：
     1) 端口图片与导线严格垂直居中（标签改为绝对定位，不再撑开容器）
   2) 型号标签固定在图片正下方居中，不占用横向空间
   3) 选型面板增加灰蓝托盘背景，选择框与白底页面形成对比
   ===================================================================== */

:root[b-1z4gedd3q9] {
    --hp-primary: #2563eb;
    --hp-primary-dark: #1d4ed8;
    --hp-primary-light: #eff6ff;
    --hp-ink: #1e293b;
    --hp-ink-2: #475569;
    --hp-ink-3: #94a3b8;
    --hp-line: #e2e8f0;
    --hp-bg: #f8fafc;
}

/* ---------- 1. 顶部选型面板（新增灰蓝托盘底，提升对比度） ---------- */
.selection-panel[b-1z4gedd3q9] {
    gap: 24px;
    flex-wrap: wrap;
    background: linear-gradient(135deg, #f1f5f9 0%, #e8edf5 100%);
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 22px 20px;
}

.select-box[b-1z4gedd3q9] {
    position: relative;
    width: 220px;
    border: 1.5px solid #cbd5e1; /* 加深边框 */
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    background: #fff;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08); /* 常驻微阴影，保证 resting 状态也有层次 */
}

    .select-box:hover[b-1z4gedd3q9] {
        border-color: var(--hp-primary);
        transform: translateY(-3px);
        box-shadow: 0 12px 26px rgba(37, 99, 235, 0.16);
    }

    .select-box:active[b-1z4gedd3q9] {
        transform: translateY(-1px);
        box-shadow: 0 6px 14px rgba(37, 99, 235, 0.10);
    }

    /* —— 已选状态高亮（纯 CSS :has，不改 HTML） —— */
    .select-box:has(.selected-text)[b-1z4gedd3q9] {
        border-color: var(--hp-primary);
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), 0 8px 20px rgba(37, 99, 235, 0.12);
    }

        .select-box:has(.selected-text) .box-header[b-1z4gedd3q9] {
            background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
            color: var(--hp-primary-dark);
        }

        .select-box:has(.selected-text)[b-1z4gedd3q9]::after {
            content: '';
            position: absolute;
            top: 10px;
            right: 10px;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: var(--hp-primary);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.20);
        }

.box-header[b-1z4gedd3q9] {
    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);
    padding: 10px 8px;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 2px;
    color: var(--hp-ink-2);
    text-align: center;
    border-bottom: 1px solid #e9eef5;
    border-radius: 12px 12px 0 0;
    transition: all 0.25s;
}

.box-body[b-1z4gedd3q9] {
    padding: 10px 16px;
    text-align: center;
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.selected-text[b-1z4gedd3q9] {
    color: var(--hp-primary);
    font-weight: 700;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    line-height: 1.4;
}

.placeholder-text[b-1z4gedd3q9] {
    color: var(--hp-ink-3);
    font-size: 12px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    line-height: 1.4;
}

/* ---------- 2. 预览区 ---------- */
.preview-area[b-1z4gedd3q9] {
    position: relative;
    height: clamp(240px, 34vh, 360px);
    min-height: 200px;
    background-color: var(--hp-bg);
    background-image: radial-gradient(circle, #d3dce8 1px, transparent 1px);
    background-size: 22px 22px;
    border: 1px solid var(--hp-line);
    border-radius: 16px;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: inset 0 2px 10px rgba(15, 23, 42, 0.05);
}

.harness-visualizer[b-1z4gedd3q9] {
    position: relative;
    width: 100%;
    height: 100%;
}

.wire-layer[b-1z4gedd3q9] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

/* ---------- 3. 端口（v3：容器中心 = 图片中心 = 导线中心 45%） ---------- */
/* 标签已改为绝对定位，不再参与容器高度计算，因此容器垂直居中即图片居中 */
.port-img-container[b-1z4gedd3q9] {
    position: absolute;
    top: 45%; /* 与导线同一水平中心线 */
    transform: translateY(-50%);
    text-align: center;
    z-index: 2;
}

.left-port[b-1z4gedd3q9] {
    left: 44px;
}

.right-port[b-1z4gedd3q9] {
    right: 44px;
}

/* 端口光晕托台 */
.port-img-container[b-1z4gedd3q9]::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 170px;
    height: 60px;
    background: radial-gradient(ellipse at center, rgba(37, 99, 235, 0.10) 0%, rgba(37, 99, 235, 0.04) 45%, transparent 70%);
    z-index: -1;
    pointer-events: none;
}

.port-img-container img[b-1z4gedd3q9] {
    max-height: 130px;
    max-width: 160px;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(15, 23, 42, 0.18));
    transition: transform 0.25s ease;
    display: block; /* 消除 inline 图片底部空隙，让高度计算更精确 */
    margin: 0 auto;
}

.port-img-container:hover img[b-1z4gedd3q9] {
    transform: scale(1.06);
}

/* v3：标签脱离文档流，绝对定位到图片正下方居中，不占横向空间 */
.port-label[b-1z4gedd3q9] {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 8px;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #fff;
    background: #334155;
    padding: 3px 12px;
    border-radius: 999px;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.20);
}

/* ---------- 4. 导线本体 ---------- */
.wire-line[b-1z4gedd3q9] {
    position: absolute;
    top: 45%;
    left: 110px;
    right: 110px;
    height: 10px;
    transform: translateY(-50%);
    z-index: 1;
    border-radius: 999px;
    box-shadow: inset 0 2px 3px rgba(255, 255, 255, 0.55), inset 0 -2px 3px rgba(0, 0, 0, 0.28), 0 3px 8px rgba(15, 23, 42, 0.28);
}

    /* 两端金属接线端子 */
    .wire-line[b-1z4gedd3q9]::before,
    .wire-line[b-1z4gedd3q9]::after {
        content: '';
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: radial-gradient(circle at 35% 30%, #f1f5f9 0%, #94a3b8 55%, #475569 100%);
        box-shadow: 0 2px 5px rgba(15, 23, 42, 0.35);
    }

    .wire-line[b-1z4gedd3q9]::before {
        left: -6px;
    }

    .wire-line[b-1z4gedd3q9]::after {
        right: -6px;
    }

/* ---------- 5. 导线信息标签 ---------- */
.wire-info-tag[b-1z4gedd3q9] {
    position: absolute;
    top: calc(45% + 24px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--hp-line);
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: var(--hp-ink-2);
    z-index: 3;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

/* ---------- 6. 导线长度悬浮标签 ---------- */
.wire-length-tag[b-1z4gedd3q9] {
    position: absolute;
    top: calc(45% - 54px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #bfdbfe;
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 14px;
    color: #1e3a8a;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.15);
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

    .wire-length-tag[b-1z4gedd3q9]::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        height: 22px;
        border-left: 1.5px dashed #93c5fd;
    }

.mini-length-select[b-1z4gedd3q9] {
    border: none;
    border-bottom: 1.5px dashed var(--hp-primary);
    background: transparent;
    font-size: 14px;
    color: var(--hp-primary-dark);
    font-weight: 700;
    outline: none;
    cursor: text;
    padding: 2px 4px;
    width: 70px;
    text-align: center;
    transition: all 0.2s;
}

    .mini-length-select:hover[b-1z4gedd3q9] {
        border-bottom-style: solid;
        border-bottom-color: var(--hp-primary-dark);
    }

    .mini-length-select:focus[b-1z4gedd3q9] {
        border-bottom-style: solid;
        background: rgba(37, 99, 235, 0.06);
        border-radius: 6px 6px 0 0;
    }

    .mini-length-select[b-1z4gedd3q9]::-webkit-outer-spin-button,
    .mini-length-select[b-1z4gedd3q9]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .mini-length-select[type=number][b-1z4gedd3q9] {
        -moz-appearance: textfield;
    }

.unit-text[b-1z4gedd3q9] {
    color: #64748b;
    font-weight: 600;
    margin-left: 2px;
}

/* ---------- 7. 空状态 ---------- */
.empty-state[b-1z4gedd3q9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--hp-ink-3);
}

    .empty-state .m-icon[b-1z4gedd3q9] {
        background: #eef2ff;
        color: #a5b4fc !important;
        padding: 22px;
        border-radius: 50%;
        font-size: 44px !important;
        margin-bottom: 6px;
    }

    .empty-state p[b-1z4gedd3q9] {
        margin-top: 8px;
        font-size: 14px;
        letter-spacing: 1px;
    }

/* ---------- 8. 选择弹窗 ---------- */
.modal-overlay[b-1z4gedd3q9] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: mOverlayFadeIn-b-1z4gedd3q9 0.2s ease;
}

.modal-content[b-1z4gedd3q9] {
    background: #fff;
    padding: 28px;
    border-radius: 16px;
    width: 560px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
    animation: mDialogSlideUp-b-1z4gedd3q9 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

    .modal-content h4[b-1z4gedd3q9] {
        color: var(--hp-ink);
        font-weight: 700;
        letter-spacing: 1px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--hp-line);
        margin-bottom: 18px;
    }

.options-list[b-1z4gedd3q9] {
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid var(--hp-line);
    border-radius: 10px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

    .options-list[b-1z4gedd3q9]::-webkit-scrollbar {
        width: 6px;
    }

    .options-list[b-1z4gedd3q9]::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 3px;
    }

.modal-actions[b-1z4gedd3q9] {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

/* ---------- 9. 已导入配置表格 ---------- */
.record-table[b-1z4gedd3q9] {
    border: 1px solid var(--hp-line);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}

    .record-table thead tr[b-1z4gedd3q9] {
        background: linear-gradient(135deg, #f1f5f9 0%, #e9eef5 100%) !important;
    }

    .record-table th[b-1z4gedd3q9] {
        font-size: 13px;
        color: var(--hp-ink-2);
        font-weight: 700;
        letter-spacing: 0.5px;
        padding: 12px 16px !important;
        border-bottom: 1px solid var(--hp-line) !important;
    }

    .record-table td[b-1z4gedd3q9] {
        font-size: 13px;
        color: #334155;
        padding: 9px 16px !important;
        border-bottom: 1px solid #f1f5f9 !important;
    }

    .record-table tbody tr[b-1z4gedd3q9] {
        transition: background 0.15s ease;
    }

        .record-table tbody tr:hover[b-1z4gedd3q9] {
            background: #f8fafc;
        }

        .record-table tbody tr:last-child td[b-1z4gedd3q9] {
            border-bottom: none !important;
        }

/* ---------- 10. 动效 ---------- */
@keyframes mOverlayFadeIn-b-1z4gedd3q9 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes mDialogSlideUp-b-1z4gedd3q9 {
    from {
        opacity: 0;
        transform: translateY(16px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.p2-mirrored[b-1z4gedd3q9] {
    transform: scaleX(-1);
    transition: transform 0.3s ease;
}

    /* 2. ✅ 终极防御：强制覆盖父容器 hover 和自身 hover 的状态 */
    /* 无论鼠标是悬浮在图片上，还是悬浮在底部的文字上，都强制保持翻转 */
    .port-img-container:hover .p2-mirrored[b-1z4gedd3q9],
    .p2-mirrored:hover[b-1z4gedd3q9] {
        /* 保持翻转 (scaleX(-1)) 的同时，保留原有的放大效果 (scale(1.1)) */
        transform: scaleX(-1) scale(1.1) !important;
    }