/**
 * Liquid Glass Buttons — 轻量 CSS 液态玻璃（毛玻璃 + 高光 + 着色）
 * WebGL/html2canvas 全页折射已停用（过卡且易丢色），需要时可设 localStorage.st_lg_webgl=1
 */

:root {
    --lg-radius: 16px;
    --lg-blur: 16px;
    --lg-sat: 1.4;
    --lg-pad-y: 0.58rem;
    --lg-pad-x: 1.2rem;
    --lg-x: 50%;
    --lg-y: 32%;
    --lg-spec: 0.55;
    --lg-rim: rgba(255, 255, 255, 0.75);
    --lg-rim-soft: rgba(255, 255, 255, 0.35);
    --lg-field-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.38) 100%), rgba(255, 255, 255, 0.45);
    --lg-field-border: rgba(255, 255, 255, 0.7);
    --lg-field-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset, 0 2px 8px rgba(15, 23, 42, 0.05);
    --lg-panel-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.78) 0%, rgba(255, 255, 255, 0.5) 100%), rgba(255, 255, 255, 0.55);
}

.btn,
.icon-btn {
    --lg-tint: rgba(255, 255, 255, 0.5);
    --lg-ink: var(--text-secondary, #475569);
    --lg-glow: rgba(15, 23, 42, 0.12);

    position: relative !important;
    /* 不用 isolation + soft-light，避免多层背景在按钮组里被「切开」 */
    isolation: auto;
    overflow: hidden !important;
    border-radius: var(--lg-radius) !important;
    border: 1px solid var(--lg-rim-soft) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.12) 42%, rgba(255, 255, 255, 0.04) 100%),
        var(--lg-tint) !important;
    -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-sat));
    backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-sat));
    color: var(--lg-ink) !important;
    box-shadow:
        0 1px 0 var(--lg-rim) inset,
        0 -1px 0 rgba(15, 23, 42, 0.08) inset,
        0 8px 22px -8px var(--lg-glow),
        0 2px 6px rgba(15, 23, 42, 0.06) !important;
    transition:
        transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        filter 0.3s ease !important;
    -webkit-tap-highlight-color: transparent;
}

.btn {
    font-weight: 600 !important;
    font-size: 0.8125rem !important;
    padding: var(--lg-pad-y) var(--lg-pad-x) !important;
}

.btn > *:not(.st-lg-cv),
.icon-btn > *:not(.st-lg-cv) {
    position: relative;
    z-index: 2;
}

.btn::before,
.icon-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
    background:
        radial-gradient(
            140% 100% at var(--lg-x) var(--lg-y),
            rgba(255, 255, 255, calc(var(--lg-spec) * 0.55)) 0%,
            rgba(255, 255, 255, 0.12) 32%,
            transparent 62%
        ),
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.28) 0%,
            rgba(255, 255, 255, 0.06) 28%,
            transparent 55%
        );
    opacity: 1;
    mix-blend-mode: normal;
}

/* 按钮组：避免横向滚动条裁切导致光效「切开」 */
.btn-group,
.reg-actions-row {
    gap: 0.55rem;
}

.btn-group .btn,
.reg-actions-row .btn {
    flex-shrink: 0;
    /* 组内各自完整圆角玻璃，不被相邻裁切 */
    background-clip: padding-box !important;
}

.reg-actions-row {
    flex-wrap: wrap;
    overflow-x: visible;
    padding-bottom: 0;
}

.btn:hover:not(:disabled),
.icon-btn:hover:not(:disabled) {
    transform: translateY(-1px) scale(1.01) !important;
    filter: brightness(1.04);
    border-color: rgba(255, 255, 255, 0.55) !important;
}

.btn:active:not(:disabled),
.icon-btn:active:not(:disabled) {
    transform: translateY(0) scale(0.985) !important;
    filter: brightness(0.98);
}

.btn:disabled,
.icon-btn:disabled {
    opacity: 0.48 !important;
    filter: grayscale(0.12) !important;
    transform: none !important;
    cursor: not-allowed;
}

.btn.loading::before { opacity: 0.35; }
.btn.loading::after {
    z-index: 3;
    border-color: rgba(255, 255, 255, 0.28);
    border-top-color: currentColor;
}

/* ===== 彩色变体 ===== */
.btn-primary {
    --lg-tint: rgba(99, 102, 241, 0.72);
    --lg-glow: rgba(79, 70, 229, 0.45);
    --lg-spec: 0.72;
    color: #fff !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0.08) 40%, rgba(15, 23, 42, 0.1) 100%),
        linear-gradient(135deg, rgba(129, 140, 248, 0.92), rgba(99, 102, 241, 0.88), rgba(79, 70, 229, 0.9)) !important;
    border-color: rgba(199, 210, 254, 0.55) !important;
    text-shadow: 0 1px 1px rgba(15, 23, 42, 0.2);
}

.btn-primary:hover:not(:disabled) {
    --lg-glow: rgba(79, 70, 229, 0.55);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(15, 23, 42, 0.08) 100%),
        linear-gradient(135deg, rgba(165, 180, 252, 0.95), rgba(129, 140, 248, 0.9), rgba(99, 102, 241, 0.92)) !important;
}

.btn-danger {
    --lg-tint: rgba(239, 68, 68, 0.72);
    --lg-glow: rgba(239, 68, 68, 0.42);
    --lg-spec: 0.68;
    color: #fff !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.06) 42%, rgba(15, 23, 42, 0.1) 100%),
        linear-gradient(135deg, rgba(251, 113, 133, 0.92), rgba(239, 68, 68, 0.9), rgba(220, 38, 38, 0.9)) !important;
    border-color: rgba(254, 202, 202, 0.55) !important;
    text-shadow: 0 1px 1px rgba(127, 29, 29, 0.22);
}

.btn-secondary,
.btn-outline {
    --lg-tint: rgba(255, 255, 255, 0.55);
    --lg-glow: rgba(15, 23, 42, 0.1);
    color: var(--text-secondary, #475569) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.22) 50%, rgba(248, 250, 252, 0.35) 100%),
        rgba(255, 255, 255, 0.45) !important;
    border-color: rgba(255, 255, 255, 0.7) !important;
}

.btn-secondary:hover:not(:disabled),
.btn-outline:hover:not(:disabled) {
    color: var(--accent, #4f46e5) !important;
    border-color: rgba(165, 180, 252, 0.7) !important;
}

.btn-ghost {
    --lg-tint: rgba(255, 255, 255, 0.2);
    --lg-glow: transparent;
    background: rgba(255, 255, 255, 0.16) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset !important;
}

.btn-ghost:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.3) !important;
    color: var(--accent, #4f46e5) !important;
}

.btn-accent,
.btn-success,
.btn-teal {
    --lg-tint: rgba(16, 185, 129, 0.28);
    --lg-glow: rgba(16, 185, 129, 0.25);
    color: #047857 !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.12) 50%, transparent 100%),
        linear-gradient(135deg, rgba(167, 243, 208, 0.7), rgba(110, 231, 183, 0.45), rgba(125, 211, 252, 0.4)) !important;
    border-color: rgba(167, 243, 208, 0.7) !important;
}

.btn.btn-teal {
    color: #0369a1 !important;
}

.btn[style*="linear-gradient"] {
    color: #fff !important;
    --lg-glow: rgba(245, 158, 11, 0.42);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.06) 45%, transparent 100%),
        linear-gradient(135deg, rgba(251, 191, 36, 0.92), rgba(249, 115, 22, 0.88)) !important;
    border-color: rgba(253, 230, 138, 0.55) !important;
    text-shadow: 0 1px 1px rgba(120, 53, 15, 0.22);
}

.btn-success[style*="linear-gradient"] {
    --lg-glow: rgba(16, 185, 129, 0.4);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.06) 45%, transparent 100%),
        linear-gradient(135deg, rgba(52, 211, 153, 0.92), rgba(6, 182, 212, 0.88)) !important;
}

.icon-btn {
    width: 34px;
    height: 34px;
    padding: 0 !important;
    border-radius: 12px !important;
    --lg-tint: rgba(255, 255, 255, 0.55);
    --lg-glow: rgba(79, 70, 229, 0.18);
    color: var(--accent, #4f46e5) !important;
}

.btn.btn-sm,
.btn-sm {
    --lg-radius: 14px;
    --lg-pad-y: 0.4rem;
    --lg-pad-x: 0.85rem;
    font-size: 0.75rem !important;
    border-radius: 14px !important;
}

/* 暗色 */
[data-theme="dark"] .btn,
[data-theme="dark"] .icon-btn {
    --lg-tint: rgba(40, 48, 68, 0.55);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.03) 40%, rgba(0, 0, 0, 0.2) 100%),
        rgba(30, 36, 52, 0.55) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.2) inset,
        0 -1px 0 rgba(0, 0, 0, 0.35) inset,
        0 10px 28px -10px rgba(0, 0, 0, 0.55) !important;
}

[data-theme="dark"] .btn-primary {
    color: #fff !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.04) 42%, rgba(0, 0, 0, 0.2) 100%),
        linear-gradient(135deg, rgba(129, 140, 248, 0.85), rgba(79, 70, 229, 0.8)) !important;
    border-color: rgba(165, 180, 252, 0.35) !important;
}

[data-theme="dark"] .btn-danger {
    color: #fff !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.03) 42%, rgba(0, 0, 0, 0.22) 100%),
        linear-gradient(135deg, rgba(248, 113, 113, 0.8), rgba(220, 38, 38, 0.75)) !important;
}

[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn-outline {
    color: #cbd5e1 !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.03) 50%, rgba(0, 0, 0, 0.2) 100%),
        rgba(255, 255, 255, 0.06) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.16) inset,
        0 8px 22px -10px rgba(0, 0, 0, 0.45) !important;
}

[data-theme="dark"] .btn-secondary:hover:not(:disabled),
[data-theme="dark"] .btn-outline:hover:not(:disabled) {
    color: #c7d2fe !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.05) 50%, rgba(0, 0, 0, 0.18) 100%),
        rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .icon-btn {
    color: #a5b4fc !important;
}

/* 隐藏旧 WebGL canvas 残留 */
.st-lg-cv,
#stLgGlCanvas {
    display: none !important;
}

.m-body .btn,
html.is-mobile .btn,
html.is-compact .btn {
    --lg-radius: 16px;
    border-radius: 16px !important;
    min-height: 44px;
}

.m-body .btn.btn-sm,
.m-body .btn-sm {
    border-radius: 14px !important;
    min-height: 36px !important;
}

@media (prefers-reduced-motion: reduce) {
    .btn,
    .icon-btn {
        transition: none !important;
    }
    .btn:hover:not(:disabled),
    .icon-btn:hover:not(:disabled),
    .btn:active:not(:disabled),
    .icon-btn:active:not(:disabled) {
        transform: none !important;
    }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .btn { background: rgba(255, 255, 255, 0.92) !important; }
    .btn-primary { background: linear-gradient(135deg, #818cf8, #6366f1, #4f46e5) !important; }
    .btn-danger { background: linear-gradient(135deg, #fb7185, #ef4444) !important; }
    .section { background: #fff !important; }
    .stat-card { background: #fff !important; }
}

/* ===== 分页区块 .section — 同款液态玻璃 ===== */
.section {
    position: relative !important;
    overflow: visible !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.62) 0%, rgba(255, 255, 255, 0.28) 42%, rgba(255, 255, 255, 0.18) 100%),
        rgba(255, 255, 255, 0.42) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
    backdrop-filter: blur(18px) saturate(1.35) !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    border-radius: var(--radius, 16px) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 -1px 0 rgba(15, 23, 42, 0.04) inset,
        0 10px 28px -12px rgba(15, 23, 42, 0.12),
        0 2px 8px rgba(99, 102, 241, 0.06) !important;
}

.section::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    border-radius: inherit;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.38) 0%,
        rgba(255, 255, 255, 0.08) 38%,
        transparent 68%
    );
    opacity: 0.95;
}

.section > * {
    position: relative;
    z-index: 1;
}

.section:hover {
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 -1px 0 rgba(15, 23, 42, 0.05) inset,
        0 14px 36px -12px rgba(15, 23, 42, 0.14),
        0 4px 12px rgba(99, 102, 241, 0.08) !important;
}

.section-title {
    border-bottom-color: rgba(148, 163, 184, 0.18) !important;
}

.title-icon {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.1) 100%),
        linear-gradient(135deg, rgba(99, 102, 241, 0.18), rgba(236, 72, 153, 0.12)) !important;
    border: 1px solid rgba(255, 255, 255, 0.55) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.7) inset,
        0 2px 8px rgba(99, 102, 241, 0.1) !important;
}

/* 统计小卡 */
.stat-card {
    position: relative !important;
    overflow: hidden !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.28) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 4px 14px -6px rgba(15, 23, 42, 0.1) !important;
}

.stat-card::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.45) 0%, transparent 45%);
    opacity: 0.85;
}

/* 注册进度条：连续流动高光，避免分段色块感 */
.batch-progress-bar {
    background: rgba(255, 255, 255, 0.35) !important;
    border: 1px solid rgba(255, 255, 255, 0.55) !important;
    box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.batch-progress-fill {
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(90deg, #6366f1, #8b5cf6, #a855f7) !important;
    background-size: 100% 100% !important;
    animation: none !important;
    box-shadow: 0 0 12px rgba(99, 102, 241, 0.35);
}

.batch-progress-fill::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 30%,
        rgba(255, 255, 255, 0.55) 48%,
        transparent 66%
    );
    background-size: 220% 100%;
    animation: lgProgressShine 2.4s linear infinite;
    pointer-events: none;
}

@keyframes lgProgressShine {
    0% { background-position: 120% 0; }
    100% { background-position: -120% 0; }
}

.batch-log {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(248, 250, 252, 0.4) 100%) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
}

/* 暗色区块 */
[data-theme="dark"] .section {
    background: rgba(16, 26, 46, 0.42) !important;
    border-color: rgba(168, 188, 220, 0.26) !important;
    box-shadow:
        0 1px 0 rgba(180, 200, 230, 0.08) inset,
        0 10px 36px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(14px) saturate(1.25) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.25) !important;
    border-radius: 14px !important;
}

[data-theme="dark"] .section::before {
    background: linear-gradient(180deg, rgba(180, 200, 230, 0.08) 0%, transparent 100%);
}

[data-theme="dark"] .stat-card {
    background: rgba(16, 26, 46, 0.42) !important;
    border-color: rgba(168, 188, 220, 0.26) !important;
    backdrop-filter: blur(14px) saturate(1.25) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.25) !important;
    border-radius: 14px !important;
}

[data-theme="dark"] .batch-progress-bar {
    background: rgba(160, 190, 230, 0.12) !important;
    border-color: rgba(200, 220, 255, 0.22) !important;
}

[data-theme="dark"] .batch-log,
[data-theme="dark"] #刷取Log {
    background: rgba(160, 190, 230, 0.1) !important;
    border-color: rgba(200, 220, 255, 0.28) !important;
    backdrop-filter: blur(28px) saturate(1.6) !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
    border-radius: 14px !important;
}

/* 手机端区块同样用玻璃，覆盖 m-surface 实色 */
.m-body .section {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.22) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
    backdrop-filter: blur(16px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 8px 20px -10px rgba(15, 23, 42, 0.1) !important;
}

html[data-theme="dark"] .m-body .section {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(0, 0, 0, 0.2) 100%),
        rgba(24, 28, 38, 0.7) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.m-body .btn-group .btn,
.m-body .reg-actions-row .btn {
    border-radius: 16px !important;
}

@media (prefers-reduced-motion: reduce) {
    .batch-progress-fill::after {
        animation: none !important;
    }
}

/* =========================================================
   全局液态玻璃 — 输入 / 下拉 / 编辑 / 弹窗 / 侧栏 / 表格等
   ========================================================= */

/* —— 通用字段玻璃壳 —— */
.input-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="hidden"]),
.input-group select,
.input-group textarea,
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
textarea,
select:not(.custom-select-native) {
    background: var(--lg-field-bg) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--lg-field-shadow) !important;
    color: var(--lg-ink, var(--text-primary, #0f172a)) !important;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s !important;
}

.input-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="hidden"]):hover,
.input-group select:hover,
.input-group textarea:hover,
input[type="text"]:hover,
input[type="password"]:hover,
input[type="number"]:hover,
textarea:hover,
select:not(.custom-select-native):hover {
    border-color: rgba(165, 180, 252, 0.55) !important;
}

.input-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="hidden"]):focus,
.input-group select:focus,
.input-group textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:not(.custom-select-native):focus {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.55) 100%),
        rgba(255, 255, 255, 0.65) !important;
    border-color: rgba(99, 102, 241, 0.55) !important;
    box-shadow:
        0 0 0 4px rgba(99, 102, 241, 0.14),
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 2px 10px rgba(99, 102, 241, 0.1) !important;
}

.input-group input:disabled,
.input-group select:disabled,
.input-group textarea:disabled,
input:disabled,
textarea:disabled,
select:disabled {
    opacity: 0.55 !important;
    filter: grayscale(0.1);
}

textarea,
.input-group textarea,
#data,
#cryptoData,
.workshop-upload-data {
    min-height: 120px;
    line-height: 1.55;
}

/* datalist / 已保存账号面板 */
#savedAccountsPanel,
[id$="SavedAccountsPanel"],
.saved-accounts-panel {
    background: var(--lg-panel-bg) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
    backdrop-filter: blur(14px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 12px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 10px 28px rgba(15, 23, 42, 0.1) !important;
}

/* —— 自定义下拉 —— */
.custom-select-trigger {
    background: var(--lg-field-bg) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--lg-field-shadow) !important;
    min-height: 42px !important;
}

.custom-select-trigger:hover:not(:disabled) {
    border-color: rgba(165, 180, 252, 0.55) !important;
}

.custom-select.open .custom-select-trigger,
.custom-select-trigger:focus-visible {
    border-color: rgba(99, 102, 241, 0.55) !important;
    box-shadow:
        0 0 0 4px rgba(99, 102, 241, 0.14),
        0 1px 0 rgba(255, 255, 255, 0.9) inset !important;
}

.custom-select-panel,
.custom-select-panel.custom-select-panel--portal {
    background: var(--lg-panel-bg) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.4) !important;
    backdrop-filter: blur(18px) saturate(1.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.75) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 16px 40px rgba(15, 23, 42, 0.14),
        0 4px 12px rgba(99, 102, 241, 0.08) !important;
    overflow: hidden !important;
}

.custom-select-search-wrap {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.5)) !important;
    border-bottom-color: rgba(148, 163, 184, 0.2) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

.custom-select-search {
    background: var(--lg-field-bg) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 10px !important;
    box-shadow: var(--lg-field-shadow) !important;
}

.custom-select-option {
    border-radius: 10px !important;
}

.custom-select-option:hover:not(.is-disabled) {
    background: rgba(255, 255, 255, 0.55) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset;
}

.custom-select-option.is-selected {
    background:
        linear-gradient(135deg, rgba(99, 102, 241, 0.18), rgba(139, 92, 246, 0.12)) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}

/* —— 弹窗 —— */
.modal-content,
.kaima-modal .modal-content,
#kaimaLoginModal .modal-content,
.ck-login-modal,
.workshop-upload-modal,
.ranking-detail-modal {
    background: rgba(12, 20, 38, 0.48) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
    backdrop-filter: blur(18px) saturate(1.35) !important;
    border: 1px solid rgba(168, 188, 220, 0.28) !important;
    border-radius: 16px !important;
    box-shadow:
        0 1px 0 rgba(180, 200, 230, 0.1) inset,
        0 18px 50px rgba(0, 0, 0, 0.32) !important;
    color: #b4c2d6 !important;
}

.modal-header,
.modal-footer {
    background: transparent !important;
    border-color: rgba(168, 188, 220, 0.2) !important;
}

/* 玻璃头图底已透明：用中间色标题，忌纯白 */
.modal-header h3 {
    color: #c5d2e4 !important;
}

.modal-header-icon {
    background: rgba(124, 245, 255, 0.12) !important;
}

.modal-header-icon .icon {
    stroke: #7cf5ff !important;
}

.modal-body p,
#confirmMessage {
    color: #b4c2d6 !important;
}

.modal-footer .btn-secondary,
.modal-footer .btn-outline,
#confirmCancelBtn {
    color: #7cf5ff !important;
}

.modal-overlay {
    -webkit-backdrop-filter: blur(6px) saturate(1.1);
    backdrop-filter: blur(6px) saturate(1.1);
    background: rgba(15, 23, 42, 0.28) !important;
}

/* —— 侧栏 / 顶栏 / 导航 —— */
.sidebar,
.app-shell .sidebar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.42) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.4) !important;
    backdrop-filter: blur(20px) saturate(1.4) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.65) !important;
    box-shadow:
        1px 0 0 rgba(255, 255, 255, 0.5) inset,
        8px 0 32px rgba(15, 23, 42, 0.06) !important;
}

.topbar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0.45) 100%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.35) !important;
    backdrop-filter: blur(16px) saturate(1.35) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.6) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
}

.sidebar-nav .nav-tab,
.app-shell .sidebar .nav-tab,
.nav-tabs .nav-tab {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    transition:
        color 0.32s ease,
        background 0.32s ease,
        border-color 0.32s ease,
        box-shadow 0.32s ease,
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.sidebar-nav .nav-tab:hover,
.app-shell .sidebar .nav-tab:hover {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: translateX(2px) !important;
}

.sidebar-nav .nav-tab.active,
.app-shell .sidebar .nav-tab.active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.sidebar-footer #kaimaInfo {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.25) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

/* —— 表格 / 信息盒 / 预处理 —— */
.save-table-wrap,
.workshop-grid,
.info-box,
.preprocess-toggles,
.drop-zone,
.reg-local-confirm {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.28) 100%),
        rgba(255, 255, 255, 0.35) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.25) !important;
    backdrop-filter: blur(12px) saturate(1.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.75) inset,
        0 4px 16px rgba(15, 23, 42, 0.06) !important;
}

.save-table {
    background: transparent !important;
}

.save-table th {
    background: rgba(255, 255, 255, 0.45) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.save-table td,
.save-table th {
    border-color: rgba(148, 163, 184, 0.15) !important;
}

.save-table tr:hover td {
    background: rgba(255, 255, 255, 0.35) !important;
}

.badge,
.login4399-state,
.status-bar.show,
.container .status-bar.show {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.3) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

.checkbox-label,
.preprocess-toggle-header {
    border-radius: 10px;
}

.drop-zone {
    border-style: dashed !important;
    border-color: rgba(165, 180, 252, 0.55) !important;
}

.drop-zone.dragover,
.drop-zone:hover {
    background:
        linear-gradient(180deg, rgba(199, 210, 254, 0.35) 0%, rgba(255, 255, 255, 0.4) 100%) !important;
    border-color: rgba(99, 102, 241, 0.55) !important;
}

/* Toast */
.toast {
    background: var(--lg-panel-bg) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.35) !important;
    backdrop-filter: blur(16px) saturate(1.35) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 12px 32px rgba(15, 23, 42, 0.14) !important;
}

/* 密码眼睛按钮 */
.password-toggle-btn {
    background: rgba(255, 255, 255, 0.45) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset !important;
}

.password-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.7) !important;
}

/* CK / 任意登录粘贴区 */
.ck-login-modal__paste textarea {
    background: var(--lg-field-bg) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--lg-field-shadow) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
}

/* —— 暗色主题变量 —— */
[data-theme="dark"] {
    --lg-rim: rgba(200, 220, 255, 0.28);
    --lg-rim-soft: rgba(168, 188, 220, 0.2);
    --lg-field-bg: rgba(160, 190, 230, 0.1);
    --lg-field-border: rgba(200, 220, 255, 0.28);
    --lg-field-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 2px 12px rgba(0, 0, 0, 0.28);
    --lg-panel-bg: rgba(160, 190, 230, 0.1);
    --lg-ink: #b4c2d6;
}

[data-theme="dark"] .input-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="hidden"]):focus,
[data-theme="dark"] .input-group select:focus,
[data-theme="dark"] .input-group textarea:focus,
[data-theme="dark"] input[type="text"]:focus,
[data-theme="dark"] input[type="password"]:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] .custom-select.open .custom-select-trigger {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.05) 100%),
        rgba(36, 42, 58, 0.75) !important;
    box-shadow:
        0 0 0 4px rgba(129, 140, 248, 0.18),
        0 1px 0 rgba(255, 255, 255, 0.12) inset !important;
}

[data-theme="dark"] .sidebar,
[data-theme="dark"] .app-shell .sidebar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(0, 0, 0, 0.25) 100%),
        rgba(15, 18, 28, 0.75) !important;
    border-right-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .topbar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(15, 18, 28, 0.7) 100%) !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .modal-content,
[data-theme="dark"] .custom-select-panel,
[data-theme="dark"] .toast {
    background: rgba(12, 20, 38, 0.48) !important;
    border-color: rgba(168, 188, 220, 0.28) !important;
    color: #b4c2d6 !important;
    backdrop-filter: blur(18px) saturate(1.35) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
}

[data-theme="dark"] .sidebar-nav .nav-tab.active,
[data-theme="dark"] .app-shell .sidebar .nav-tab.active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

[data-theme="dark"] .save-table th {
    background: rgba(255, 255, 255, 0.04) !important;
}

[data-theme="dark"] .save-table tr:hover td {
    background: rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .modal-overlay {
    background: rgba(0, 0, 0, 0.55) !important;
}

/* —— 手机端 —— */
.m-body input[type="text"],
.m-body input[type="password"],
.m-body input[type="number"],
.m-body input[type="email"],
.m-body textarea,
.m-body select,
.m-body .custom-select-trigger {
    background: var(--lg-field-bg) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--lg-field-shadow) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
}

.m-body .modal-overlay .modal-content,
.m-body .m-drawer,
.m-body .m-top {
    background: var(--lg-panel-bg) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.4) !important;
    backdrop-filter: blur(18px) saturate(1.4) !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
}

html[data-theme="dark"] .m-body input[type="text"],
html[data-theme="dark"] .m-body input[type="password"],
html[data-theme="dark"] .m-body textarea,
html[data-theme="dark"] .m-body .custom-select-trigger,
html[data-theme="dark"] .m-body .modal-overlay .modal-content,
html[data-theme="dark"] .m-body .m-drawer,
html[data-theme="dark"] .m-body .m-top {
    border-color: rgba(255, 255, 255, 0.12) !important;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .input-group input:not([type="checkbox"]):not([type="radio"]),
    .input-group select,
    .input-group textarea,
    .custom-select-trigger,
    .modal-content,
    .sidebar,
    .topbar {
        background: rgba(255, 255, 255, 0.94) !important;
    }
    [data-theme="dark"] .sidebar,
    [data-theme="dark"] .topbar,
    [data-theme="dark"] .modal-content {
        background: rgba(24, 28, 38, 0.96) !important;
    }
}

/* =========================================================
   存档工坊 + 下拉/列表 + 加解密按钮外框
   ========================================================= */

/* —— 工坊顶栏 / 筛选 / 列表卡片 —— */
.workshop-bar {
    padding: 0.55rem 0.65rem !important;
    margin-bottom: 0.55rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.65) 0%, rgba(255, 255, 255, 0.32) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
    backdrop-filter: blur(14px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 4px 14px rgba(15, 23, 42, 0.06) !important;
}

.workshop-filter-panel.open {
    padding: 0.55rem 0.65rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.35) 100%),
        rgba(255, 255, 255, 0.42) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
    backdrop-filter: blur(14px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 6px 18px rgba(15, 23, 42, 0.07) !important;
}

.workshop-search,
.workshop-select,
#workshopSearch,
#workshopScope,
#workshopFilterGame,
#workshopSort {
    background: var(--lg-field-bg) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 11px !important;
    box-shadow: var(--lg-field-shadow) !important;
    color: var(--text-primary, #0f172a) !important;
}

.workshop-search:focus,
.workshop-select:focus {
    border-color: rgba(99, 102, 241, 0.55) !important;
    box-shadow:
        0 0 0 3px rgba(99, 102, 241, 0.12),
        0 1px 0 rgba(255, 255, 255, 0.85) inset !important;
}

.workshop-grid {
    padding: 0.55rem !important;
    min-height: 120px;
}

.workshop-tile {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.38) 100%),
        rgba(255, 255, 255, 0.42) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 6px 18px rgba(15, 23, 42, 0.08) !important;
}

.workshop-tile:hover {
    border-color: rgba(165, 180, 252, 0.65) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 10px 28px rgba(99, 102, 241, 0.14) !important;
    transform: translateY(-2px);
}

.workshop-tile-icon {
    background:
        linear-gradient(135deg, rgba(99, 102, 241, 0.18), rgba(236, 72, 153, 0.12)),
        rgba(255, 255, 255, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
}

.workshop-pagination,
.m-pagination-bar {
    margin-top: 0.65rem !important;
    padding: 0.5rem 0.65rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%),
        rgba(255, 255, 255, 0.38) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.75) inset !important;
}

.workshop-detail-body,
.workshop-detail-row,
.workshop-detail-desc {
    border-color: rgba(148, 163, 184, 0.18) !important;
}

.workshop-detail-desc,
.workshop-drop-zone {
    background: var(--lg-field-bg) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--lg-field-shadow) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

.workshop-detail-footer {
    background: transparent !important;
    border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
}

.workshop-filter-btn.active {
    background:
        linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(139, 92, 246, 0.12)),
        rgba(255, 255, 255, 0.45) !important;
    border-color: rgba(165, 180, 252, 0.7) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
}

/* —— 列表框（日志 / 操作记录 / 排行历史 / 已保存账号） —— */
.batch-log,
.oplog-list,
.ranking-history-list,
#regLog,
#batchLog,
#刷取Log,
#savedAccountsPanel,
[id$="SavedAccountsPanel"] {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.62) 0%, rgba(248, 250, 252, 0.4) 100%),
        rgba(255, 255, 255, 0.38) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.25) !important;
    backdrop-filter: blur(12px) saturate(1.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        inset 0 1px 4px rgba(15, 23, 42, 0.04) !important;
}

html[data-theme="dark"] .batch-log,
html[data-theme="dark"] .oplog-list,
html[data-theme="dark"] .ranking-history-list,
html[data-theme="dark"] #regLog,
html[data-theme="dark"] #batchLog,
html[data-theme="dark"] #刷取Log,
html[data-theme="dark"] #savedAccountsPanel,
html[data-theme="dark"] [id$="SavedAccountsPanel"] {
    background: rgba(160, 190, 230, 0.1) !important;
    border: 1px solid rgba(200, 220, 255, 0.28) !important;
    border-radius: 14px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.12) inset,
        0 12px 36px rgba(0, 0, 0, 0.32) !important;
    color: #b4c2d6 !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
    backdrop-filter: blur(28px) saturate(1.6) !important;
}

.batch-log-item,
.oplog-item,
.ranking-history-item,
#savedAccountsPanel > div,
[id$="SavedAccountsPanel"] > div {
    border-radius: 10px !important;
    border-color: rgba(148, 163, 184, 0.15) !important;
}

.batch-log-item:hover,
.oplog-item:hover,
#savedAccountsPanel > div:hover {
    background: rgba(255, 255, 255, 0.5) !important;
}

/* 自定义下拉列表区域再加强 */
.custom-select-list {
    background: transparent !important;
}

.custom-select-panel .custom-select-option {
    margin: 2px 0;
}

/* —— 加解密：按钮外层玻璃框 —— */
.crypto-mode-bar {
    padding: 0.75rem 0.85rem !important;
    margin-bottom: 1rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.68) 0%, rgba(255, 255, 255, 0.34) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
    backdrop-filter: blur(14px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    border-radius: 16px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 6px 18px rgba(15, 23, 42, 0.06) !important;
}

.crypto-mode-hint {
    background:
        linear-gradient(90deg, rgba(99, 102, 241, 0.12), rgba(255, 255, 255, 0.4)) !important;
    border: 1px solid rgba(255, 255, 255, 0.55) !important;
    border-left: 3px solid rgba(99, 102, 241, 0.75) !important;
    border-radius: 10px !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
}

.crypto-action-bar {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0.75rem !important;
    flex-wrap: wrap !important;
    margin: 1rem 0 1.25rem !important;
    padding: 0.85rem 1rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.32) 100%),
        rgba(255, 255, 255, 0.42) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.35) !important;
    backdrop-filter: blur(16px) saturate(1.35) !important;
    border: 1px solid rgba(255, 255, 255, 0.75) !important;
    border-radius: 18px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 -1px 0 rgba(15, 23, 42, 0.04) inset,
        0 10px 28px rgba(99, 102, 241, 0.1) !important;
}

.crypto-action-bar .btn-crypto-main {
    min-width: 8.5rem;
    min-height: 44px;
    border-radius: 14px !important;
}

.crypto-util-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.45rem 0.5rem !important;
    margin-top: 0.85rem !important;
    padding: 0.75rem 0.85rem !important;
    border-top: none !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.62) 0%, rgba(255, 255, 255, 0.3) 100%),
        rgba(255, 255, 255, 0.38) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
    backdrop-filter: blur(14px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 16px !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 6px 18px rgba(15, 23, 42, 0.06) !important;
}

.crypto-util-divider {
    width: 1px !important;
    height: 1.35rem !important;
    background: rgba(148, 163, 184, 0.35) !important;
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.5);
}

.crypto-textarea-input,
.crypto-textarea-result,
#cryptoData,
#cryptoResult {
    background: var(--lg-field-bg) !important;
    border: 1px solid var(--lg-field-border) !important;
    border-radius: 14px !important;
    box-shadow: var(--lg-field-shadow) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.3) !important;
    backdrop-filter: blur(12px) saturate(1.3) !important;
}

.crypto-textarea-result,
#cryptoResult {
    background:
        linear-gradient(180deg, rgba(236, 253, 245, 0.55) 0%, rgba(255, 255, 255, 0.4) 100%),
        rgba(255, 255, 255, 0.42) !important;
}

/* 代理工具栏等同款外框 */
.reg-proxy-toolbar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.65) 0%, rgba(255, 255, 255, 0.32) 100%),
        rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset !important;
}

/* —— 暗色：工坊 / 加解密 / 列表 —— */
[data-theme="dark"] .workshop-bar,
[data-theme="dark"] .workshop-filter-panel.open,
[data-theme="dark"] .workshop-tile,
[data-theme="dark"] .workshop-pagination,
[data-theme="dark"] .m-pagination-bar,
[data-theme="dark"] .crypto-mode-bar,
[data-theme="dark"] .crypto-action-bar,
[data-theme="dark"] .crypto-util-bar,
[data-theme="dark"] .batch-log,
[data-theme="dark"] .oplog-list,
[data-theme="dark"] .ranking-history-list,
[data-theme="dark"] #刷取Log,
[data-theme="dark"] #regLog,
[data-theme="dark"] #batchLog {
    background: rgba(160, 190, 230, 0.1) !important;
    border-color: rgba(200, 220, 255, 0.28) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.12) inset,
        0 12px 36px rgba(0, 0, 0, 0.32) !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
    backdrop-filter: blur(28px) saturate(1.6) !important;
}

[data-theme="dark"] .workshop-search,
[data-theme="dark"] .workshop-select,
[data-theme="dark"] .crypto-textarea-input,
[data-theme="dark"] .crypto-textarea-result,
[data-theme="dark"] #cryptoData,
[data-theme="dark"] #cryptoResult {
    background: var(--lg-field-bg) !important;
    border-color: var(--lg-field-border) !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .crypto-textarea-result,
[data-theme="dark"] #cryptoResult {
    background:
        linear-gradient(180deg, rgba(16, 185, 129, 0.12) 0%, rgba(255, 255, 255, 0.04) 100%),
        rgba(24, 28, 38, 0.55) !important;
}

[data-theme="dark"] .workshop-tile:hover {
    border-color: rgba(165, 180, 252, 0.4) !important;
}

/* 手机工坊 / 加解密 */
.m-body .workshop-bar,
.m-body .workshop-filter-panel.open,
.m-body .workshop-tile,
.m-body .crypto-action-bar,
.m-body .crypto-util-bar,
.m-body .crypto-mode-bar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%),
        rgba(255, 255, 255, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 14px !important;
    -webkit-backdrop-filter: blur(14px) !important;
    backdrop-filter: blur(14px) !important;
}

.m-body .crypto-action-bar,
.m-body .crypto-util-bar {
    padding: 0.75rem !important;
}

html[data-theme="dark"] .m-body .workshop-bar,
html[data-theme="dark"] .m-body .workshop-tile,
html[data-theme="dark"] .m-body .crypto-action-bar,
html[data-theme="dark"] .m-body .crypto-util-bar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(0, 0, 0, 0.2) 100%),
        rgba(24, 28, 38, 0.65) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* =========================================================
   暗色模式总修复：压白底、保文字可读
   ========================================================= */
html[data-theme="dark"] .section,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .custom-select-panel,
html[data-theme="dark"] .custom-select-panel.custom-select-panel--portal,
html[data-theme="dark"] .toast,
html[data-theme="dark"] .save-table-wrap,
html[data-theme="dark"] .workshop-grid,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .preprocess-toggles,
html[data-theme="dark"] .drop-zone,
html[data-theme="dark"] .reg-local-confirm,
html[data-theme="dark"] .reg-proxy-toolbar,
html[data-theme="dark"] .workshop-bar,
html[data-theme="dark"] .workshop-filter-panel.open,
html[data-theme="dark"] .workshop-tile,
html[data-theme="dark"] .workshop-pagination,
html[data-theme="dark"] .m-pagination-bar,
html[data-theme="dark"] .crypto-mode-bar,
html[data-theme="dark"] .crypto-action-bar,
html[data-theme="dark"] .crypto-util-bar,
html[data-theme="dark"] .batch-log,
html[data-theme="dark"] .oplog-list,
html[data-theme="dark"] .ranking-history-list,
html[data-theme="dark"] #regLog,
html[data-theme="dark"] #batchLog,
html[data-theme="dark"] #刷取Log,
html[data-theme="dark"] #savedAccountsPanel,
html[data-theme="dark"] [id$="SavedAccountsPanel"],
html[data-theme="dark"] .sidebar-footer #kaimaInfo,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .login4399-state,
html[data-theme="dark"] .status-bar.show {
    background: rgba(160, 190, 230, 0.1) !important;
    border-color: rgba(200, 220, 255, 0.26) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.12) inset,
        0 12px 36px rgba(0, 0, 0, 0.32) !important;
    color: #b4c2d6 !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
    backdrop-filter: blur(28px) saturate(1.6) !important;
}

/* 弹窗单独走磨砂半透明（勿套用不透明暗色面板） */
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .kaima-modal .modal-content,
html[data-theme="dark"] #kaimaLoginModal .modal-content,
html[data-theme="dark"] .ck-login-modal,
html[data-theme="dark"] .ck-login-modal .modal-content,
html[data-theme="dark"] .workshop-upload-modal,
html[data-theme="dark"] .workshop-detail-modal,
html[data-theme="dark"] .ranking-detail-modal,
html[data-theme="dark"] #noticeModal .modal-content,
html[data-theme="dark"] #customConfirmModal .modal-content,
html[data-theme="dark"] #exportModal .modal-content,
html[data-theme="dark"] #rankingDetailModal .modal-content,
html[data-theme="dark"] #workshopUploadModal .modal-content,
html[data-theme="dark"] #workshopDetailModal .modal-content,
html[data-theme="dark"] #workshopEditModal .modal-content,
html[data-theme="dark"] #ckLoginModal .modal-content,
html[data-theme="dark"] #saveEditorModal .modal-content,
html[data-theme="dark"] #multiFileModal .modal-content {
    background: rgba(160, 190, 230, 0.1) !important;
    border: 1px solid rgba(200, 220, 255, 0.28) !important;
    border-radius: 16px !important;
    color: #b4c2d6 !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.16) inset,
        0 24px 64px rgba(0, 0, 0, 0.45) !important;
    -webkit-backdrop-filter: blur(40px) saturate(1.75) !important;
    backdrop-filter: blur(40px) saturate(1.75) !important;
}

html[data-theme="dark"] .modal-overlay:not(.st-gate),
html[data-theme="dark"] #noticeModal,
html[data-theme="dark"] #customConfirmModal,
html[data-theme="dark"] #exportModal,
html[data-theme="dark"] #rankingDetailModal,
html[data-theme="dark"] #workshopUploadModal,
html[data-theme="dark"] #workshopDetailModal,
html[data-theme="dark"] #workshopEditModal,
html[data-theme="dark"] #ckLoginModal,
html[data-theme="dark"] #saveEditorModal,
html[data-theme="dark"] #multiFileModal {
    background: rgba(4, 10, 24, 0.32) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.25) !important;
    backdrop-filter: blur(16px) saturate(1.25) !important;
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] #noticeModal .modal-header,
html[data-theme="dark"] #customConfirmModal .modal-header {
    background: transparent !important;
    background-image: none !important;
    border-bottom: 1px solid rgba(168, 188, 220, 0.22) !important;
}

html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] #noticeModal .modal-footer,
html[data-theme="dark"] #customConfirmModal .modal-footer {
    background: transparent !important;
    border-top: 1px solid rgba(168, 188, 220, 0.2) !important;
}

html[data-theme="dark"] .section::before,
html[data-theme="dark"] .stat-card::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, transparent 70%) !important;
    opacity: 0.7 !important;
}

html[data-theme="dark"] .section-title,
html[data-theme="dark"] .modal-header h3,
html[data-theme="dark"] .workshop-tile-title,
html[data-theme="dark"] .stat-value,
html[data-theme="dark"] .custom-select-value,
html[data-theme="dark"] .custom-select-option,
html[data-theme="dark"] .workshop-detail-row strong,
html[data-theme="dark"] label,
html[data-theme="dark"] .input-group label,
html[data-theme="dark"] .progress-label,
html[data-theme="dark"] .crypto-util-label,
html[data-theme="dark"] .topbar-meta,
html[data-theme="dark"] .sidebar-nav .nav-tab,
html[data-theme="dark"] .app-shell .sidebar .nav-tab {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .modal-header-icon {
    background: rgba(129, 140, 248, 0.22) !important;
}

html[data-theme="dark"] .modal-header-icon .icon {
    stroke: #c7d2fe !important;
}

html[data-theme="dark"] .modal-body p,
html[data-theme="dark"] #confirmMessage {
    color: #e2eaf4 !important;
}

html[data-theme="dark"] .modal-footer .btn-secondary,
html[data-theme="dark"] .modal-footer .btn-outline,
html[data-theme="dark"] #confirmCancelBtn {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .input-group label,
html[data-theme="dark"] .stat-label,
html[data-theme="dark"] .progress-label span,
html[data-theme="dark"] .workshop-tile-desc,
html[data-theme="dark"] .workshop-tile-game,
html[data-theme="dark"] .workshop-tile-foot,
html[data-theme="dark"] .workshop-count,
html[data-theme="dark"] .crypto-size-hint,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .workshop-detail-row span {
    color: #cdd8e8 !important;
}

/* 输入 / 下拉文字：浅色字 + 深色底（覆盖亮色 focus 白底） */
html[data-theme="dark"] .input-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="hidden"]),
html[data-theme="dark"] .input-group select,
html[data-theme="dark"] .input-group textarea,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select:not(.custom-select-native),
html[data-theme="dark"] .custom-select-trigger,
html[data-theme="dark"] .custom-select-search,
html[data-theme="dark"] .workshop-search,
html[data-theme="dark"] .workshop-select,
html[data-theme="dark"] .crypto-textarea-input,
html[data-theme="dark"] .crypto-textarea-result,
html[data-theme="dark"] #cryptoData,
html[data-theme="dark"] #cryptoResult,
html[data-theme="dark"] #data,
html[data-theme="dark"] .ck-login-modal__paste textarea {
    background: var(--lg-field-bg) !important;
    border-color: var(--lg-field-border) !important;
    box-shadow: var(--lg-field-shadow) !important;
    color: #c5d2e4 !important;
    -webkit-text-fill-color: #c5d2e4;
    -webkit-backdrop-filter: blur(20px) saturate(1.5) !important;
    backdrop-filter: blur(20px) saturate(1.5) !important;
}

html[data-theme="dark"] .input-group input::placeholder,
html[data-theme="dark"] .input-group textarea::placeholder,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .workshop-search::placeholder,
html[data-theme="dark"] .custom-select-search::placeholder {
    color: #64748b !important;
    opacity: 1 !important;
}

html[data-theme="dark"] .input-group input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="dark"] .input-group select:focus,
html[data-theme="dark"] .input-group textarea:focus,
html[data-theme="dark"] input[type="text"]:focus,
html[data-theme="dark"] input[type="password"]:focus,
html[data-theme="dark"] input[type="number"]:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:not(.custom-select-native):focus,
html[data-theme="dark"] .custom-select.open .custom-select-trigger,
html[data-theme="dark"] .custom-select-trigger:focus-visible {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.03) 100%),
        rgba(28, 34, 48, 0.95) !important;
    border-color: rgba(129, 140, 248, 0.55) !important;
    color: #f1f5f9 !important;
    -webkit-text-fill-color: #f1f5f9;
    box-shadow:
        0 0 0 4px rgba(129, 140, 248, 0.2),
        0 1px 0 rgba(255, 255, 255, 0.08) inset !important;
}

html[data-theme="dark"] .custom-select-search-wrap {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(20, 24, 34, 0.95)) !important;
    border-bottom-color: rgba(148, 163, 184, 0.18) !important;
}

html[data-theme="dark"] .custom-select-option:hover:not(.is-disabled) {
    background: rgba(129, 140, 248, 0.16) !important;
    color: #c7d2fe !important;
}

html[data-theme="dark"] .custom-select-option.is-selected {
    background: rgba(99, 102, 241, 0.28) !important;
    color: #e0e7ff !important;
}

html[data-theme="dark"] .custom-select.is-placeholder .custom-select-value {
    color: #64748b !important;
}

/* 次要按钮：半透明磨砂，避免实色底 */
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .btn-crypto-util {
    color: #7cf5ff !important;
    background: rgba(160, 190, 230, 0.1) !important;
    border-color: rgba(200, 220, 255, 0.28) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.45) !important;
    backdrop-filter: blur(18px) saturate(1.45) !important;
}

html[data-theme="dark"] .btn-secondary:hover:not(:disabled),
html[data-theme="dark"] .btn-outline:hover:not(:disabled),
html[data-theme="dark"] .btn-ghost:hover:not(:disabled) {
    color: #9ae8f2 !important;
    background: rgba(124, 245, 255, 0.14) !important;
    border-color: rgba(124, 245, 255, 0.4) !important;
}

html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-teal,
html[data-theme="dark"] .btn-accent {
    color: #6ee7b7 !important;
}

html[data-theme="dark"] .btn.btn-teal {
    color: #7dd3fc !important;
}

html[data-theme="dark"] .btn::before,
html[data-theme="dark"] .icon-btn::before {
    opacity: 0.35 !important;
}

html[data-theme="dark"] .sidebar-nav .nav-tab:hover,
html[data-theme="dark"] .app-shell .sidebar .nav-tab:hover {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #f1f5f9 !important;
}

html[data-theme="dark"] .sidebar-nav .nav-tab.active,
html[data-theme="dark"] .app-shell .sidebar .nav-tab.active {
    color: #e0e7ff !important;
}

html[data-theme="dark"] .password-toggle-btn {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
    color: #cdd8e8 !important;
}

html[data-theme="dark"] .password-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .save-table th {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .save-table td {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .save-table tr:hover td {
    background: rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] .batch-log-item,
html[data-theme="dark"] .oplog-item,
html[data-theme="dark"] #savedAccountsPanel > div,
html[data-theme="dark"] [id$="SavedAccountsPanel"] > div {
    color: #e2e8f0 !important;
    border-color: rgba(148, 163, 184, 0.15) !important;
}

html[data-theme="dark"] .batch-log-item:hover,
html[data-theme="dark"] .oplog-item:hover,
html[data-theme="dark"] #savedAccountsPanel > div:hover {
    background: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .crypto-mode-hint {
    background: rgba(99, 102, 241, 0.12) !important;
    border-color: rgba(129, 140, 248, 0.3) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .workshop-detail-desc,
html[data-theme="dark"] .workshop-drop-zone {
    background: var(--lg-field-bg) !important;
    border-color: var(--lg-field-border) !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .title-icon {
    background:
        linear-gradient(135deg, rgba(99, 102, 241, 0.28), rgba(139, 92, 246, 0.16)),
        rgba(30, 36, 52, 0.8) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
}

/* 手机暗色：覆盖稍后声明的亮色 m-body 规则 */
html[data-theme="dark"] .m-body .section,
html[data-theme="dark"] .m-body .workshop-bar,
html[data-theme="dark"] .m-body .workshop-filter-panel.open,
html[data-theme="dark"] .m-body .workshop-tile,
html[data-theme="dark"] .m-body .crypto-action-bar,
html[data-theme="dark"] .m-body .crypto-util-bar,
html[data-theme="dark"] .m-body .crypto-mode-bar,
html[data-theme="dark"] .m-body .m-drawer,
html[data-theme="dark"] .m-body .m-top {
    background: rgba(160, 190, 230, 0.1) !important;
    border-color: rgba(200, 220, 255, 0.26) !important;
    color: #b4c2d6 !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
    backdrop-filter: blur(28px) saturate(1.6) !important;
}

html[data-theme="dark"] .m-body .modal-overlay .modal-content {
    background: rgba(14, 22, 42, 0.4) !important;
    border-color: rgba(168, 188, 220, 0.34) !important;
    color: #b4c2d6 !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.45) !important;
    backdrop-filter: blur(24px) saturate(1.45) !important;
}

html[data-theme="dark"] .m-body input[type="text"],
html[data-theme="dark"] .m-body input[type="password"],
html[data-theme="dark"] .m-body input[type="number"],
html[data-theme="dark"] .m-body textarea,
html[data-theme="dark"] .m-body select,
html[data-theme="dark"] .m-body .custom-select-trigger {
    background: var(--lg-field-bg) !important;
    border-color: var(--lg-field-border) !important;
    color: #e8eaef !important;
    -webkit-text-fill-color: #e8eaef;
}
