/**
 * ============================================================
 * 如意验证会员系统 - 主题风格 V2（玻璃拟态 + 渐变配色 + 柔和阴影）
 *   - 主色：蓝紫清新渐变
 *   - 所有卡片/弹出框/按钮/输入框统一圆角 12~18px
 *   - 毛玻璃效果 + 柔和多层阴影
 *   - hover 微交互 + 呼吸留白
 * ============================================================
 */

/* ---------- 全局基础 ---------- */
:root {
    /* 主题色（蓝紫清新系） */
    --ry-primary:        #4f7cff;
    --ry-primary-2:      #7b5cff;
    --ry-primary-3:      #5b8def;
    --ry-success:        #22c55e;
    --ry-success-2:      #10b981;
    --ry-info:           #06b6d4;
    --ry-warning:        #f59e0b;
    --ry-danger:         #ef4444;
    --ry-danger-2:       #f43f5e;

    /* 渐变条 */
    --ry-gradient-primary: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%);
    --ry-gradient-success: linear-gradient(135deg, #10b981 0%, #22c55e 55%, #34d399 100%);
    --ry-gradient-info:    linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
    --ry-gradient-warning: linear-gradient(135deg, #f59e0b 0%, #fb923c 100%);
    --ry-gradient-danger:  linear-gradient(135deg, #ef4444 0%, #f43f5e 55%, #ec4899 100%);

    /* 背景渐变（页面 body） */
    --ry-page-bg: radial-gradient(1200px 600px at 10% -10%, rgba(79,124,255,.16), transparent 60%),
                  radial-gradient(900px 500px at 110% 10%, rgba(123,92,255,.14), transparent 60%),
                  linear-gradient(180deg, #f5f7ff 0%, #f2f4fb 45%, #eef1fb 100%);

    /* 阴影 */
    --ry-shadow-sm: 0 2px 6px rgba(60,72,120,.08);
    --ry-shadow:    0 10px 30px rgba(60,72,120,.10), 0 4px 10px rgba(60,72,120,.06);
    --ry-shadow-lg: 0 18px 50px rgba(60,72,120,.14), 0 8px 18px rgba(60,72,120,.08);

    /* 圆角 */
    --ry-radius-card:   18px;
    --ry-radius-btn:    12px;
    --ry-radius-input:  14px;
    --ry-radius-alert:  16px;
    --ry-radius-badge:  10px;
}

html, body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei",
                 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: #1f2740;
}

html { height: 100%; }
body {
    background: var(--ry-page-bg);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* 背景装饰圆 */
    overflow-x: hidden;
}
/* 主容器撑满剩余空间（让 .footer.mt-auto 真能靠底，不会跑到页面中间空白区） */
body > .container {
    flex: 1 0 auto;
    width: 100%;
    max-width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
}
/* 超市语音首页挂载点最小高度（防止 Vue 未挂载时整页空白） */
#app-wrapper { min-height: calc(100vh - 56px - 120px); }
#app         { min-height: calc(100vh - 56px - 120px); }
#app .app-container { min-height: calc(100vh - 56px - 120px); }

/* 页面背景装饰圆（纯CSS，不影响性能） */
body::before,
body::after {
    content: "";
    position: fixed;
    z-index: -1;
    pointer-events: none;
    filter: blur(60px);
    opacity: .55;
    border-radius: 50%;
}
body::before {
    width: 420px; height: 420px;
    top: -140px; left: -120px;
    background: radial-gradient(circle at 30% 30%, rgba(79,124,255,.55), rgba(79,124,255,0) 70%);
}
body::after {
    width: 520px; height: 520px;
    bottom: -160px; right: -150px;
    background: radial-gradient(circle at 70% 70%, rgba(155,123,255,.45), rgba(155,123,255,0) 72%);
}

/* ---------- 顶部导航栏（毛玻璃 + 渐变） ---------- */
.navbar {
    background: var(--ry-gradient-primary) !important;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    box-shadow: 0 8px 26px rgba(79,124,255,.28);
    padding-top: .7rem;
    padding-bottom: .7rem;
    border-bottom: 1px solid rgba(255,255,255,.18);
}
.navbar-brand {
    font-weight: 700;
    letter-spacing: .4px;
    font-size: 1.15rem;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    text-shadow: 0 1px 0 rgba(0,0,0,.08);
}
.navbar .nav-link {
    border-radius: 10px;
    padding: .5rem .9rem !important;
    margin: 0 .15rem;
    transition: all .22s ease;
    color: rgba(255,255,255,.92) !important;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus {
    background: rgba(255,255,255,.14);
    color: #fff !important;
    transform: translateY(-1px);
}
.navbar .nav-link.active,
body[data-route="index"]      .navbar-nav li:nth-child(1) .nav-link,
body[data-route="change_password"] .navbar-nav li:nth-child(2) .nav-link,
body[data-route="card_recharge"]   .navbar-nav li:nth-child(3) .nav-link,
body[data-route="online_recharge"] .navbar-nav li:nth-child(4) .nav-link {
    background: rgba(255,255,255,.22);
    color: #fff !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.navbar .dropdown-menu {
    border: none;
    border-radius: var(--ry-radius-card);
    box-shadow: var(--ry-shadow-lg);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(10px);
    overflow: hidden;
    padding: .4rem;
}
.navbar .dropdown-item {
    border-radius: 10px;
    padding: .55rem .85rem;
    transition: all .18s ease;
    color: #2b3350;
}
.navbar .dropdown-item:hover {
    background: rgba(79,124,255,.10);
    color: var(--ry-primary);
    transform: translateX(2px);
}
.navbar-toggler {
    border-color: rgba(255,255,255,.35) !important;
    border-radius: 10px;
}

/* ---------- 卡片（玻璃拟态 + 圆角 + 大阴影） ---------- */
.card {
    border: none;
    border-radius: var(--ry-radius-card);
    background: rgba(255,255,255,.78);
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    box-shadow: var(--ry-shadow);
    transition: transform .25s ease, box-shadow .25s ease;
    border: 1px solid rgba(255,255,255,.65);
    overflow: hidden;
}
.card:hover {
    transform: translateY(-2px);
    box-shadow: var(--ry-shadow-lg);
}
.card-header {
    border: none !important;
    font-weight: 600;
    padding: 1rem 1.25rem;
    font-size: 1.05rem;
    letter-spacing: .2px;
}
/* 蓝色 header 卡片：默认用渐变替代 #0d6efd */
.card-header.bg-primary {
    background: var(--ry-gradient-primary) !important;
}
/* 绿色 header 卡片：会员状态等用渐变替代 #198754 */
.card-header.bg-success {
    background: var(--ry-gradient-success) !important;
}
.card-header.bg-secondary {
    background: linear-gradient(135deg, #64748b 0%, #475569 100%) !important;
}
.card-header.bg-info    { background: var(--ry-gradient-info) !important; }
.card-header.bg-warning { background: var(--ry-gradient-warning) !important; }
.card-header.bg-danger  { background: var(--ry-gradient-danger) !important; }

.card-body {
    padding: 1.5rem 1.5rem;
}

/* ---------- 表单 / 输入框 ---------- */
.form-control,
.form-select {
    border: 1.5px solid #e2e6f1;
    border-radius: var(--ry-radius-input) !important;
    padding: .65rem .95rem;
    background: rgba(255,255,255,.85);
    transition: all .2s ease;
    color: #1f2740;
}
.form-control:focus,
.form-select:focus {
    border-color: rgba(79,124,255,.55);
    box-shadow: 0 0 0 4px rgba(79,124,255,.15), var(--ry-shadow-sm);
    background: #fff;
    outline: none;
}
.form-control::placeholder { color: #9aa3bf; }
.form-label { color: #394066; font-weight: 500; margin-bottom: .4rem; }

.input-group-text {
    background: linear-gradient(135deg, #f4f6ff 0%, #eef2ff 100%);
    border: 1.5px solid #e2e6f1;
    border-radius: var(--ry-radius-input) !important;
    color: #5d6a99;
    padding: .65rem .85rem;
}
.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: -1px;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
.input-group > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* ---------- 按钮（渐变 + 悬浮上浮） ---------- */
.btn {
    border-radius: var(--ry-radius-btn);
    font-weight: 600;
    padding: .6rem 1.1rem;
    border: none;
    transition: all .22s ease;
    letter-spacing: .2px;
    position: relative;
    overflow: hidden;
}
.btn::after {
    /* 按钮光泽 */
    content: "";
    position: absolute;
    top: 0; left: -120%;
    width: 70%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.28), transparent);
    transform: skewX(-20deg);
    transition: left .65s ease;
}
.btn:hover::after { left: 130%; }
.btn:hover {
    transform: translateY(-1.5px);
    box-shadow: 0 12px 24px rgba(60,72,120,.18);
}
.btn:active { transform: translateY(0); }

.btn-primary   { background: var(--ry-gradient-primary);   color:#fff; box-shadow: 0 6px 16px rgba(79,124,255,.28); }
.btn-success   { background: var(--ry-gradient-success);   color:#fff; box-shadow: 0 6px 16px rgba(16,185,129,.28); }
.btn-info      { background: var(--ry-gradient-info);      color:#fff; box-shadow: 0 6px 16px rgba(6,182,212,.24); }
.btn-warning   { background: var(--ry-gradient-warning);   color:#fff; box-shadow: 0 6px 16px rgba(245,158,11,.24); }
.btn-danger    { background: var(--ry-gradient-danger);    color:#fff; box-shadow: 0 6px 16px rgba(239,68,68,.26); }
.btn-secondary {
    background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);
    color: #fff; box-shadow: 0 6px 16px rgba(100,116,139,.22);
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-secondary {
    background: #fff;
    border: 1.5px solid rgba(60,72,120,.14);
    color: #394066;
}
.btn-outline-primary { border-color: rgba(79,124,255,.45); color: var(--ry-primary); }
.btn-outline-primary:hover { background: var(--ry-gradient-primary); color: #fff; border-color: transparent; }
.btn-outline-success { border-color: rgba(16,185,129,.45); color: var(--ry-success); }
.btn-outline-success:hover { background: var(--ry-gradient-success); color: #fff; border-color: transparent; }
.btn-outline-info    { border-color: rgba(6,182,212,.45);  color: var(--ry-info); }
.btn-outline-info:hover    { background: var(--ry-gradient-info);    color: #fff; border-color: transparent; }
.btn-outline-warning { border-color: rgba(245,158,11,.5);  color: #b45309; }
.btn-outline-warning:hover { background: var(--ry-gradient-warning); color: #fff; border-color: transparent; }
.btn-outline-danger  { border-color: rgba(239,68,68,.45);  color: var(--ry-danger); }
.btn-outline-danger:hover  { background: var(--ry-gradient-danger);  color: #fff; border-color: transparent; }
.btn-outline-secondary { border-color: rgba(100,116,139,.4); color: #475569; }
.btn-outline-secondary:hover {
    background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);
    color: #fff; border-color: transparent;
}

/* ---------- 弹出信息框（Bootstrap alert / 各种提示块） ---------- */
.alert {
    border: none;
    border-radius: var(--ry-radius-alert);
    padding: 1rem 1.15rem;
    font-weight: 500;
    box-shadow: var(--ry-shadow-sm);
    backdrop-filter: blur(8px);
    position: relative;
    overflow: hidden;
}
.alert::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 5px;
    background: currentColor;
    opacity: .7;
}
.alert-primary { background: linear-gradient(135deg, rgba(79,124,255,.12), rgba(123,92,255,.10)); color: #2b3ea0; border-left: none; }
.alert-success { background: linear-gradient(135deg, rgba(16,185,129,.13), rgba(52,211,153,.10)); color: #065f46; }
.alert-info    { background: linear-gradient(135deg, rgba(6,182,212,.13),  rgba(59,130,246,.11)); color: #0c4a6e; }
.alert-warning { background: linear-gradient(135deg, rgba(245,158,11,.15), rgba(251,146,60,.11)); color: #92400e; }
.alert-danger  { background: linear-gradient(135deg, rgba(239,68,68,.15),  rgba(244,63,94,.11));  color: #991b1b; }
.alert-secondary { background: linear-gradient(135deg, rgba(100,116,139,.12), rgba(148,163,184,.08)); color: #334155; }
.alert-light   { background: rgba(255,255,255,.7); color: #334155; }
.alert > :last-child { margin-bottom: 0; }

/* ---------- Badge ---------- */
.badge {
    border-radius: var(--ry-radius-badge);
    padding: .38rem .65rem;
    font-weight: 600;
    letter-spacing: .2px;
    font-size: .82rem;
    box-shadow: 0 3px 10px rgba(0,0,0,.08);
}
.badge.bg-primary   { background: var(--ry-gradient-primary) !important; }
.badge.bg-success   { background: var(--ry-gradient-success) !important; }
.badge.bg-info      { background: var(--ry-gradient-info) !important; }
.badge.bg-warning   { background: var(--ry-gradient-warning) !important; color:#fff; }
.badge.bg-danger    { background: var(--ry-gradient-danger) !important; }
.badge.bg-secondary { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%) !important; }

/* ---------- 商品卡 / 支付卡（首页底部快捷按钮除外） ---------- */
.goods-card,
.pay-card {
    cursor: pointer;
    transition: all .22s ease;
    border: 1.5px solid #e5e9f5;
    background: rgba(255,255,255,.85);
    backdrop-filter: blur(8px);
    border-radius: var(--ry-radius-card);
    padding: 1rem;
}
.goods-card:hover,
.pay-card:hover {
    border-color: rgba(79,124,255,.5);
    transform: translateY(-3px);
    box-shadow: var(--ry-shadow);
    background: #fff;
}
.goods-card:has(.form-check-input:checked),
.pay-card:has(.form-check-input:checked) {
    border-color: rgba(79,124,255,.7);
    background: linear-gradient(135deg, rgba(79,124,255,.08), rgba(123,92,255,.06));
    box-shadow: 0 10px 28px rgba(79,124,255,.18);
}
.goods-card .price {
    font-size: 1.6rem;
    background: var(--ry-gradient-primary);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 800;
    letter-spacing: .4px;
}

/* ---------- 首页快捷操作按钮（三栏） ---------- */
.row .btn.w-100 {
    padding: 1.1rem .7rem;
    border-radius: var(--ry-radius-card) !important;
    background: rgba(255,255,255,.82);
    color: #394066;
    border: 1.5px solid #e5e9f5;
    backdrop-filter: blur(10px);
    transition: all .25s ease;
}
.row .btn.w-100 i.bi {
    font-size: 1.75rem;
    display: block;
    margin-bottom: .45rem;
}
.row .btn-outline-primary.w-100 i.bi { color: var(--ry-primary); }
.row .btn-outline-success.w-100 i.bi { color: var(--ry-success-2); }
.row .btn-outline-info.w-100    i.bi { color: var(--ry-info); }
.row .btn.w-100:hover {
    transform: translateY(-4px);
    color: #fff !important;
}
.row .btn-outline-primary.w-100:hover { background: var(--ry-gradient-primary); border-color: transparent; box-shadow: 0 14px 30px rgba(79,124,255,.28);}
.row .btn-outline-success.w-100:hover { background: var(--ry-gradient-success); border-color: transparent; box-shadow: 0 14px 30px rgba(16,185,129,.28);}
.row .btn-outline-info.w-100:hover    { background: var(--ry-gradient-info);    border-color: transparent; box-shadow: 0 14px 30px rgba(6,182,212,.25);}
.row .btn.w-100:hover i.bi { color: #fff !important; }

/* ---------- 调试/详情面板（pre 块 / 候选清单表） ---------- */
pre {
    border-radius: 14px;
    border: 1px solid rgba(100,116,139,.18);
    background: linear-gradient(135deg, #ffffff, #f8faff);
    padding: .8rem 1rem !important;
    color: #334155;
    font-size: 12.5px;
}
.table {
    border-radius: 14px;
    overflow: hidden;
    background: rgba(255,255,255,.85);
}
.table th, .table td { vertical-align: middle; }
.table thead.table-light {
    background: linear-gradient(135deg, #f3f5ff, #eef1fb) !important;
    color: #394066;
    font-weight: 600;
    border-bottom: 1px solid rgba(100,116,139,.12);
}
hr.my-3 { border-color: rgba(100,116,139,.14); }

/* 调试面板按钮 */
.btn.btn-sm.btn-outline-secondary {
    border-radius: 10px !important;
    padding: .32rem .7rem;
    font-size: .84rem;
}

/* ---------- 页脚 ---------- */
.footer {
    background: transparent;
    margin-top: 3rem;
    padding-bottom: 1.5rem;
}
.footer .container > span {
    display: inline-block;
    padding: .55rem 1.1rem;
    border-radius: 999px;
    background: rgba(255,255,255,.68);
    backdrop-filter: blur(10px);
    color: #5d6a99 !important;
    box-shadow: var(--ry-shadow-sm);
}

/* ---------- 登录 / 注册等"居中卡片"页面：额外加毛玻璃 + 呼吸留白 ---------- */
.page-auth {
    min-height: calc(100vh - 56px - 80px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 0;
}
.page-auth .card {
    padding: 0;
}

/* ---------- 登录 / 注册卡片标题 ---------- */
.text-center.mb-4 h4,
h4.text-center.mb-4 {
    font-weight: 700;
    color: #2b3350;
    letter-spacing: .3px;
}

/* ---------- 兼容老的 mb-4 主容器间距 ---------- */
body > .container {
    padding-top: .5rem;
    padding-bottom: 2rem;
}

/* ---------- 模态框（如果以后用到）统一美化 ---------- */
.modal-content {
    border: none;
    border-radius: var(--ry-radius-card);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(10px);
    box-shadow: var(--ry-shadow-lg);
}
.modal-header {
    border-bottom: 1px solid rgba(100,116,139,.12);
    background: var(--ry-gradient-primary);
    color: #fff;
    border-radius: var(--ry-radius-card) var(--ry-radius-card) 0 0;
}
.modal-header .btn-close { filter: invert(1); }
.modal-footer { border-top: 1px solid rgba(100,116,139,.12); }

/* ---------- Toast / 浮动提示 ---------- */
.toast {
    border: none;
    border-radius: 14px !important;
    box-shadow: var(--ry-shadow-lg);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(8px);
    overflow: hidden;
}

/* ---------- 移动端适配 ---------- */
@media (max-width: 768px) {
    :root {
        --ry-radius-card: 16px;
        --ry-radius-btn:  11px;
        --ry-radius-input:12px;
    }
    body > .container {
        padding-left: 12px;
        padding-right: 12px;
    }
    .card-body { padding: 1.2rem; }
    .goods-card .price { font-size: 1.3rem; }
    .navbar-brand { font-size: 1.05rem; }
    .row .btn.w-100 { padding: 1rem .5rem; }
    .row .btn.w-100 i.bi { font-size: 1.5rem; }
}

/* =====================================================================
 *  🔧 2026-08-26 播报记录模态框（定时任务今日状态）样式
 *   注意：原始写在 index.php Vue 模板内部（L5869），被 Vue 3 编译时
 *        报「Template compilation error: Tags with side effect
 *        (<script> and <style>) are ignored in client component templates」
 *        → 整段 CSS 被丢弃=播报记录排版错乱（俗称"强砍截图"）
 *        → 现在永久搬到公共 style.css 尾部，不经过 Vue 模板编译
 * ===================================================================== */
.broadcast-tab { display:inline-flex; align-items:center; padding:8px 16px; font-size:14px; font-weight:600; color:#64748b; cursor:pointer; border-radius:999px; border:1px solid #e2e8f0; background:#fff; transition:all .2s; user-select:none; }
.broadcast-tab:hover { border-color:#4f7cff; color:#4f7cff; }
.broadcast-tab.active { color:#fff; background:linear-gradient(135deg,#4f7cff,#7b5cff); border-color:transparent; box-shadow:0 2px 8px rgba(79,124,255,.28); }
.broadcast-tab-count { display:inline-block; min-width:20px; padding:1px 7px; margin-left:4px; border-radius:999px; background:#eef2ff; color:#4f7cff; font-size:12px; }
.broadcast-tab.active .broadcast-tab-count { background:rgba(255,255,255,.28); color:#fff; }
.broadcast-empty { text-align:center; padding:36px 10px; color:#94a3b8; font-size:14px; }
.broadcast-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; margin-bottom:8px; border-radius:10px; background:#f8fafc; border:1px solid #eef0f5; }
.broadcast-row-done    { border-left:3px solid #22c55e; }  /* ✅ 已播报：绿边 */
.broadcast-row-pending { border-left:3px solid #f59e0b; }  /* ⏳ 未播报：橙边 */
.broadcast-row-main { flex:1; min-width:0; }
.broadcast-row-name { font-size:15px; font-weight:600; color:#0f172a; margin-bottom:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.broadcast-row-meta { display:flex; gap:6px; flex-wrap:wrap; }
.badge-soft { font-size:11.5px; padding:2px 8px; border-radius:6px; background:#fff; border:1px solid #e2e8f0; color:#475569; }
.badge-on  { color:#16a34a; border-color:#bbf7d0; background:#f0fdf4; }   /* 启用中 绿 */
.badge-off { color:#dc2626; border-color:#fecaca; background:#fef2f2; }   /* 已停用 红 */
.broadcast-row-time { text-align:right; flex-shrink:0; margin-left:6px; }
.broadcast-time-label { font-size:11px; color:#94a3b8; }
.broadcast-time-val { font-size:13px; font-weight:600; color:#1f2937; margin-top:2px; white-space:nowrap; }

/* =====================================================================
 *  🔧 2026-08-28 修复：歌曲封面 + 加载更多按钮（Vue #app 内的 <style> 搬运）
 *     原 index.php L6195-L6270 内嵌在 Vue 模板内部 → Vue3 编译时
 *     报「Template compilation error: Tags with side effect (<script>
 *     and <style>) are ignored in client component templates」
 *     → rySpin 旋转动画 + ks-cover 紫渐变封面 + load-more 按钮样式全丢
 *     → 统一搬到公共 style.css 尾部，不经过 Vue 模板编译，真正生效
 * ===================================================================== */
/* 封面旋转：歌曲播放时（ks-row.cur 下的封面）加动画类即旋转（如 .ks-cover.animate-spin）*/
@keyframes rySpin { to { transform: rotate(360deg); } }
/* 歌曲封面样式 — 参考 music.lizhile520.cn */
.ks-cover {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    overflow: hidden;
    background: linear-gradient(135deg, #667eea, #764ba2);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(102,126,234,.2);
    transition: transform .3s ease, box-shadow .3s ease;
}
.ks-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.ks-row:hover .ks-cover {
    transform: scale(1.05);
    box-shadow: 0 4px 14px rgba(102,126,234,.3);
}
.ks-row.cur .ks-cover {
    /* 当前正在播放：绿色发光描边 */
    box-shadow: 0 0 0 2px rgba(67,233,123,.5), 0 4px 14px rgba(67,233,123,.25);
}
.ks-cover-placeholder {
    font-size: 18px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #667eea, #764ba2);
}
.ks-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
/* 加载更多按钮 — 参考 music.lizhile520.cn */
.load-more-wrap {
    text-align: center;
    padding: 14px 0 8px;
}
.btn-load-more {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border: none;
    padding: 10px 28px;
    border-radius: 24px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: all .25s ease;
    box-shadow: 0 4px 14px rgba(102,126,234,.3);
}
.btn-load-more:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102,126,234,.4);
    filter: brightness(1.05);
}
.btn-load-more:active  { transform: translateY(0); }
.btn-load-more:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* =======================================================================
   2026-08-28 人声混响 UI 美化：玻璃拟态卡片 + iOS 胶囊 Toggle + 渐变标题
   ======================================================================= */

/* --- 玻璃拟态容器（首页 & 任务模态框共用） --- */
.rv-glass-card {
    position: relative;
    padding: 14px 16px 14px 16px;
    margin: 10px 0 10px 0;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.65);
    background:
        radial-gradient(120% 80% at 0% 0%, rgba(123,92,255,0.12), transparent 55%),
        radial-gradient(100% 90% at 100% 0%, rgba(79,124,255,0.13), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,0.82) 0%, rgba(248,249,255,0.70) 100%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 10px 30px rgba(79, 99, 180, 0.10),
        0 4px 12px rgba(79, 99, 180, 0.06),
        inset 0 1px 0 rgba(255,255,255,0.8);
    overflow: hidden;
}
/* 卡片左上光晕装饰 */
.rv-glass-card::before {
    content: '';
    position: absolute;
    top: -30px;
    left: -30px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(155,123,255,0.22), transparent 70%);
    pointer-events: none;
}
/* 卡片右下光晕装饰 */
.rv-glass-card::after {
    content: '';
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(91,141,239,0.20), transparent 70%);
    pointer-events: none;
}

/* 任务模态框混响卡片（绿色渐变主题，区分全局） */
.rv-glass-card.rv-card-task {
    background:
        radial-gradient(120% 80% at 0% 0%, rgba(16,185,129,0.12), transparent 55%),
        radial-gradient(100% 90% at 100% 0%, rgba(59,130,246,0.12), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,0.82) 0%, rgba(247,253,250,0.70) 100%);
    border-color: rgba(187,247,208,0.7);
}
.rv-glass-card.rv-card-task::before {
    background: radial-gradient(circle, rgba(34,197,94,0.20), transparent 70%);
}
.rv-glass-card.rv-card-task::after {
    background: radial-gradient(circle, rgba(6,182,212,0.18), transparent 70%);
}

/* --- 渐变标题条（图标 + 文字 + 右侧 Toggle） --- */
.rv-header {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding: 8px 12px;
    border-radius: 12px;
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%);
    color: #fff;
    box-shadow:
        0 6px 18px rgba(123,92,255,0.28),
        inset 0 1px 0 rgba(255,255,255,0.25);
}
.rv-header.rv-header-green {
    background: linear-gradient(135deg, #10b981 0%, #22c55e 55%, #34d399 100%);
    box-shadow:
        0 6px 18px rgba(16,185,129,0.25),
        inset 0 1px 0 rgba(255,255,255,0.25);
}
.rv-header-icon {
    font-size: 16px;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.15));
    flex-shrink: 0;
}
.rv-header-title {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.2px;
    line-height: 1.3;
    flex-shrink: 0;
}
.rv-header-hint {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.88;
    margin-left: 2px;
    line-height: 1.3;
}
.rv-header-spacer {
    flex: 1;
    min-width: 8px;
}

/* --- iOS 风格胶囊 Toggle（替代原生 checkbox） --- */
.rv-toggle {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    cursor: pointer;
    vertical-align: middle;
}
.rv-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
}
.rv-toggle-slider {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #cbd5e1 0%, #94a3b8 100%);
    border-radius: 999px;
    transition: all 0.28s cubic-bezier(.4,.0,.2,1);
    box-shadow:
        inset 0 1px 2px rgba(0,0,0,0.15),
        inset 0 0 0 1px rgba(255,255,255,0.2);
}
.rv-toggle-slider::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 50%;
    transition: all 0.28s cubic-bezier(.4,.0,.2,1);
    box-shadow:
        0 2px 5px rgba(0,0,0,0.22),
        0 0 0 1px rgba(0,0,0,0.04),
        inset 0 1px 0 rgba(255,255,255,0.9);
}
.rv-toggle input:checked + .rv-toggle-slider {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 100%);
    box-shadow:
        0 4px 12px rgba(123,92,255,0.45),
        inset 0 1px 0 rgba(255,255,255,0.25);
}
.rv-toggle.rv-toggle-green input:checked + .rv-toggle-slider {
    background: linear-gradient(135deg, #10b981 0%, #22c55e 100%);
    box-shadow:
        0 4px 12px rgba(16,185,129,0.42),
        inset 0 1px 0 rgba(255,255,255,0.25);
}
.rv-toggle input:checked + .rv-toggle-slider::before {
    transform: translateX(20px);
}
.rv-toggle input:disabled + .rv-toggle-slider {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.3);
}
.rv-toggle:active:not(:has(input:disabled)) .rv-toggle-slider::before {
    width: 24px;
}
.rv-toggle:active:not(:has(input:disabled)) input:checked + .rv-toggle-slider::before {
    transform: translateX(16px);
}
.rv-toggle-label {
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    opacity: 0.92;
    line-height: 1.3;
    margin-right: 4px;
    white-space: nowrap;
}
.rv-toggle-status {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,0.22);
    color: #fff;
    line-height: 1.4;
    margin-right: 4px;
    backdrop-filter: blur(4px);
    transition: all 0.25s ease;
}
.rv-toggle-status.rv-status-off {
    background: rgba(255,255,255,0.15);
    opacity: 0.85;
}

/* --- 滑块区域栅格 --- */
.rv-sliders {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 22px;
    padding: 4px 2px 2px 2px;
    transition: opacity 0.25s ease, filter 0.25s ease;
}
.rv-sliders.rv-disabled {
    opacity: 0.45;
    filter: grayscale(0.55);
    pointer-events: none;
    user-select: none;
}
.rv-slider-cell {
    background: rgba(255,255,255,0.55);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.6);
    border-radius: 12px;
    padding: 10px 12px 12px 12px;
    transition: all 0.25s ease;
    box-shadow:
        0 2px 8px rgba(79,99,180,0.05),
        inset 0 1px 0 rgba(255,255,255,0.7);
}
.rv-slider-cell:hover {
    transform: translateY(-1px);
    box-shadow:
        0 6px 16px rgba(79,99,180,0.08),
        inset 0 1px 0 rgba(255,255,255,0.85);
    border-color: rgba(155,123,255,0.3);
}
.rv-slider-cell .rv-lbl {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 8px;
}
.rv-slider-cell .rv-lbl-wet {
    color: #0f766e;
}
.rv-slider-cell .rv-lbl-decay {
    color: #7e22ce;
}
.rv-slider-cell .rv-lbl .rv-lbl-val {
    font-size: 13px;
    font-weight: 700;
    background: linear-gradient(135deg, currentColor, #4f7cff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-right: 4px;
}
.rv-slider-cell .rv-lbl .rv-lbl-hint {
    color: #94a3b8;
    font-weight: 400;
    font-size: 11px;
    margin-left: 2px;
}
.rv-slider-cell input[type="range"] {
    width: 100%;
    margin: 0;
}

/* 关闭状态时的提示文字 chip */
.rv-off-tip {
    position: relative;
    z-index: 1;
    margin-top: 8px;
    font-size: 12px;
    color: #475569;
    background: rgba(255,255,255,0.55);
    backdrop-filter: blur(6px);
    border: 1px dashed rgba(148,163,184,0.5);
    border-radius: 10px;
    padding: 8px 12px;
    line-height: 1.6;
}
.rv-off-tip strong {
    color: #4f7cff;
    font-weight: 700;
}

/* 模态框内跟随全局提示 chip */
.rv-follow-chip {
    position: relative;
    z-index: 1;
    margin-top: 2px;
    font-size: 12px;
    color: #15803d;
    background: linear-gradient(135deg, rgba(16,185,129,0.08), rgba(34,197,94,0.06));
    border: 1px solid rgba(34,197,94,0.25);
    border-radius: 10px;
    padding: 8px 12px;
    line-height: 1.6;
    backdrop-filter: blur(6px);
}
.rv-follow-chip strong {
    color: #047857;
    font-weight: 700;
}

/* 混响不支持警告 chip（红橙渐变 · 醒目） */
.rv-unsupported-chip {
    position: relative;
    z-index: 1;
    margin-top: 0;
    margin-bottom: 2px;
    padding: 10px 14px;
    font-size: 12px;
    color: #991b1b;
    line-height: 1.65;
    border-radius: 12px;
    background:
        radial-gradient(120% 100% at 0% 0%, rgba(248,113,113,0.18), transparent 55%),
        radial-gradient(100% 100% at 100% 100%, rgba(251,146,60,0.15), transparent 55%),
        linear-gradient(135deg, rgba(254,226,226,0.92), rgba(255,237,213,0.88));
    border: 1px solid rgba(248,113,113,0.35);
    box-shadow:
        0 4px 14px rgba(239,68,68,0.12),
        inset 0 1px 0 rgba(255,255,255,0.7);
    backdrop-filter: blur(6px);
}
.rv-unsupported-chip .rv-err-icon {
    display: inline-block;
    font-size: 14px;
    margin-right: 4px;
    filter: drop-shadow(0 1px 1px rgba(239,68,68,0.2));
}
.rv-unsupported-chip .rv-err-title {
    font-weight: 700;
    color: #b91c1c;
    margin-right: 4px;
}
.rv-unsupported-chip .rv-err-reason {
    color: #7f1d1d;
    font-weight: 500;
}
.rv-unsupported-chip .rv-err-ua {
    display: inline-block;
    margin-top: 2px;
    font-size: 11px;
    color: #9a3412;
    font-weight: 500;
    padding: 1px 8px;
    border-radius: 999px;
    background: rgba(251,146,60,0.18);
    border: 1px solid rgba(251,146,60,0.3);
}
.rv-unsupported-chip .rv-err-hint {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    color: #92400e;
    font-weight: 500;
}
.rv-unsupported-chip .rv-err-hint b {
    color: #b45309;
    font-weight: 700;
}

/* ============================================================================
 * 2026-08-28 ★★★ 科技感 UI 主题覆盖层（冷白浅色基底 + 蓝青细线硬朗科技卡 + 紧凑按钮 + 栅格布局）
 *   用户明确约束：浅色底 / 不要太大按钮 整洁看着舒服 / 布局漂亮 / 高级感科技感
 *   主色：#1677ff → #00c2ff 冷蓝青渐变
 *   所有样式以 .modal-content.task-edit-modal 或 body 为前缀，确保只作用于当前页面模态及全局
 * ============================================================================ */

/* -------- 1. 全局浅色科技基底：冷白径向渐变 + 细点阵网格 + 顶部淡蓝青光晕 -------- */
body {
    background-color: #f8fafc;
    background-image:
        /* 顶部淡蓝青光晕 */
        radial-gradient(ellipse 1100px 450px at 50% -80px, rgba(0,194,255,0.12), rgba(22,119,255,0.06) 45%, transparent 70%),
        /* 左下角淡蓝光斑 */
        radial-gradient(ellipse 900px 500px at -200px 100%, rgba(22,119,255,0.08), transparent 60%),
        /* 细点阵网格（SVG dataURI） */
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><circle cx='1.2' cy='1.2' r='1.2' fill='%231677ff' fill-opacity='0.075'/></svg>"),
        /* 基底冷白→雾白线性 */
        linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    background-attachment: fixed;
}

/* -------- 2. 遮罩层：科技感淡蒙版（不是纯黑半透） -------- */
.modal-overlay {
    background: radial-gradient(ellipse at 50% 30%, rgba(15,23,42,0.22), rgba(15,23,42,0.42));
    backdrop-filter: blur(10px) saturate(1.1);
    -webkit-backdrop-filter: blur(10px) saturate(1.1);
    z-index: 2147483000 !important;
}

/* -------- 3. 主科技卡 .modal-content.task-edit-modal（8px 硬朗圆角 + 1px 蓝青发光边 + 四角 L 形装饰 + 顶部 2px 渐变条） -------- */
.modal-content.task-edit-modal {
    position: relative;
    max-width: 960px;
    width: calc(100vw - 40px);
    max-height: calc(100vh - 56px);
    overflow-y: auto;
    padding: 22px 26px 22px;
    margin: 28px auto;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.95), rgba(255,255,255,0.88));
    border: 1px solid rgba(22,119,255,0.22);
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.6) inset,
        0 0 0 1px rgba(0,194,255,0.08),
        0 30px 60px -20px rgba(15,23,42,0.25),
        0 10px 24px -8px rgba(22,119,255,0.18);
    backdrop-filter: blur(14px) saturate(1.15);
    -webkit-backdrop-filter: blur(14px) saturate(1.15);
    scrollbar-width: thin;
    scrollbar-color: rgba(22,119,255,0.35) transparent;
}
.modal-content.task-edit-modal::-webkit-scrollbar { width: 8px; }
.modal-content.task-edit-modal::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #1677ff, #00c2ff);
    border-radius: 4px;
}

/* 顶部 2px 蓝青渐变装饰条 */
.modal-content.task-edit-modal::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background: linear-gradient(90deg, #1677ff 0%, #00c2ff 50%, #1677ff 100%);
    box-shadow: 0 0 14px rgba(0,194,255,0.35);
}
/* 左上角 L 形科技装饰 */
.modal-content.task-edit-modal::after {
    content: "";
    position: absolute;
    top: 6px; left: 6px;
    width: 14px; height: 14px;
    border-top: 2px solid #1677ff;
    border-left: 2px solid #1677ff;
    border-top-left-radius: 2px;
    opacity: .75;
    filter: drop-shadow(0 0 3px rgba(22,119,255,0.6));
}
/* 右上角 L 形科技装饰（用第一个子元素的 ::before 代替，避免与模态::after冲突）*/
.modal-content.task-edit-modal > .modal-title + * { position: relative; }
.modal-content.task-edit-modal > .modal-title {
    position: relative;
    padding-left: 14px;
}
.modal-content.task-edit-modal > .modal-title::after {
    content: "";
    position: absolute;
    top: -16px; right: -4px;
    width: 14px; height: 14px;
    border-top: 2px solid #00c2ff;
    border-right: 2px solid #00c2ff;
    border-top-right-radius: 2px;
    opacity: .75;
    filter: drop-shadow(0 0 3px rgba(0,194,255,0.6));
}

/* -------- 4. 科技感标题：渐变文字 + 左侧蓝条 -------- */
.modal-content.task-edit-modal .modal-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 0 14px 18px;
    margin-bottom: 6px;
    border-bottom: 1px solid rgba(22,119,255,0.12);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .2px;
    color: #0f172a;
    background: linear-gradient(135deg, #0f172a 0%, #1677ff 40%, #00c2ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.modal-content.task-edit-modal .modal-title::before {
    content: "";
    position: absolute;
    left: 0; top: 2px; bottom: 14px;
    width: 4px;
    border-radius: 2px;
    background: linear-gradient(180deg, #1677ff, #00c2ff);
    box-shadow: 0 0 8px rgba(0,194,255,0.5);
    -webkit-text-fill-color: initial;
}

/* -------- 5. 表单组：标签 12px 冷蓝青粗体 + 统一间距 20px -------- */
.modal-content.task-edit-modal .form-group {
    margin-bottom: 20px;
}
.modal-content.task-edit-modal .form-label {
    display: block;
    margin-bottom: 7px;
    padding-left: 0;
    font-size: 12.5px;
    font-weight: 650;
    letter-spacing: .15px;
    color: #1e40af;
}
.modal-content.task-edit-modal .form-label span {
    color: inherit !important;
}
/* 输入框/下拉/文本域：统一 32px 紧凑 + 6px 圆角 + 细蓝边 + focus 蓝青光晕 */
.modal-content.task-edit-modal input[type="text"],
.modal-content.task-edit-modal input[type="number"],
.modal-content.task-edit-modal input[type="time"],
.modal-content.task-edit-modal select,
.modal-content.task-edit-modal textarea {
    width: 100%;
    box-sizing: border-box;
    min-height: 32px;
    height: 32px;
    padding: 5px 10px;
    font-size: 13px;
    color: #0f172a;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
    border: 1px solid rgba(148,163,184,0.6);
    border-radius: 6px;
    outline: none;
    transition: all .18s ease;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.modal-content.task-edit-modal textarea {
    min-height: 86px;
    height: auto;
    padding: 8px 10px;
    line-height: 1.55;
    resize: vertical;
}
.modal-content.task-edit-modal input:focus,
.modal-content.task-edit-modal select:focus,
.modal-content.task-edit-modal textarea:focus {
    border-color: #1677ff;
    box-shadow:
        0 0 0 3px rgba(22,119,255,0.10),
        0 0 0 1px rgba(22,119,255,0.45) inset,
        0 1px 2px rgba(22,119,255,0.06);
    background: #ffffff;
}

/* -------- 6. 按钮：统一 32px 紧凑 整洁（用户要求：不要太大） -------- */
.modal-content.task-edit-modal .btn {
    min-height: 32px;
    height: 32px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    line-height: 30px;
    letter-spacing: .1px;
    border: 1px solid rgba(148,163,184,0.6);
    background: linear-gradient(180deg, #ffffff, #f1f5f9);
    color: #0f172a;
    box-shadow: 0 1px 2px rgba(15,23,42,0.05);
    transition: all .18s ease;
    cursor: pointer;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.modal-content.task-edit-modal .btn:hover {
    border-color: #1677ff;
    color: #1677ff;
    background: linear-gradient(180deg, #ffffff, #eff6ff);
    box-shadow:
        0 0 0 3px rgba(22,119,255,0.08),
        0 1px 2px rgba(22,119,255,0.05);
}
.modal-content.task-edit-modal .btn.btn-primary,
.modal-content.task-edit-modal .btn.btn-success,
.modal-content.task-edit-modal .btn.blue-grad,
.modal-content.task-edit-modal .btn:not(.btn-outline):not(.btn-warning):not(.btn-danger):not(.btn-info) {
    border: none;
    background: linear-gradient(135deg, #1677ff, #00c2ff);
    color: #ffffff;
    font-weight: 550;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.25) inset,
        0 4px 12px -3px rgba(22,119,255,0.45),
        0 0 0 1px rgba(22,119,255,0.35);
}
.modal-content.task-edit-modal .btn.btn-primary:hover,
.modal-content.task-edit-modal .btn.btn-success:hover {
    filter: brightness(1.05);
    box-shadow:
        0 1px 0 rgba(255,255,255,0.25) inset,
        0 6px 18px -3px rgba(0,194,255,0.55),
        0 0 0 1px rgba(0,194,255,0.45);
}
.modal-content.task-edit-modal .btn.btn-sm {
    min-height: 28px; height: 28px; line-height: 26px;
    padding: 0 11px; font-size: 12px;
}
.modal-content.task-edit-modal .btn.btn-outline {
    background: #ffffff;
    border: 1px solid rgba(148,163,184,0.65);
    color: #475569;
    box-shadow: none;
}
.modal-content.task-edit-modal .btn.btn-outline:hover {
    border-color: #1677ff;
    color: #1677ff;
    background: #eff6ff;
}

/* -------- 7. 播报类型/引擎选择卡 engine-pill-btn：变小整洁 硬朗科技感（非大胶囊） -------- */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    min-height: 68px;
    padding: 10px 14px;
    border-radius: 8px;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
    border: 1px solid rgba(148,163,184,0.55);
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
    cursor: pointer;
    transition: all .2s ease;
    text-align: left;
    position: relative;
    overflow: hidden;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: rgba(148,163,184,0.45);
    transition: all .2s ease;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 13px !important;
    font-weight: 600;
    color: #334155;
    letter-spacing: .1px;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    font-size: 11px;
    color: #64748b;
    font-weight: 400;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(180deg, #eff6ff, #ffffff);
    border-color: #1677ff;
    box-shadow:
        0 0 0 1px rgba(22,119,255,0.5),
        0 0 0 3px rgba(22,119,255,0.08),
        0 6px 16px -6px rgba(22,119,255,0.25);
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::before {
    background: linear-gradient(180deg, #1677ff, #00c2ff);
    box-shadow: 2px 0 10px rgba(0,194,255,0.5);
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child {
    background: linear-gradient(135deg, #1677ff, #00c2ff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* -------- 8. 次级卡 .tech-subcard（任务专属语音设置 / 间隔循环设置）：8px 虚线细边 淡蓝底 -------- */
.modal-content.task-edit-modal .tech-subcard,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"],
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] {
    background:
        radial-gradient(120% 100% at 0% 0%, rgba(22,119,255,0.06), transparent 55%),
        linear-gradient(180deg, rgba(239,246,255,0.85), rgba(248,250,252,0.95)) !important;
    border: 1px solid rgba(22,119,255,0.2) !important;
    border-style: solid !important;
    border-radius: 8px !important;
    padding: 16px 18px !important;
    position: relative;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.6) inset,
        0 4px 14px -6px rgba(22,119,255,0.12) !important;
    backdrop-filter: blur(4px);
}
/* 次级卡标题（🎙 开头的那个） */
.modal-content.task-edit-modal .tech-subcard > div:first-child,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"] > div:first-child,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child {
    font-size: 13px !important;
    font-weight: 650 !important;
    letter-spacing: .2px;
    padding-left: 12px;
    position: relative;
    background: linear-gradient(135deg, #1e40af 0%, #1677ff 50%, #00c2ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.modal-content.task-edit-modal .tech-subcard > div:first-child::before,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"] > div:first-child::before,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child::before {
    content: "";
    position: absolute;
    left: 0; top: 3px; bottom: 3px;
    width: 3px;
    border-radius: 1.5px;
    background: linear-gradient(180deg, #1677ff, #00c2ff);
    box-shadow: 0 0 6px rgba(0,194,255,0.55);
    -webkit-text-fill-color: initial;
}

/* -------- 9. 两列栅格布局：生效起始时间/循环模式 + 间隔分钟/生效截止时间 对齐漂亮 -------- */
.grid-tech-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
    margin-bottom: 20px;
}
.grid-tech-2col > .form-group {
    margin-bottom: 0 !important;
}
@media (max-width: 640px) {
    .grid-tech-2col { grid-template-columns: 1fr; }
}

/* -------- 10. 混响卡 rv-glass-card：换成科技风蓝细线硬朗卡（替换玻璃拟态） -------- */
.rv-glass-card {
    position: relative;
    border-radius: 8px !important;
    background:
        radial-gradient(140% 100% at 0% 0%, rgba(22,119,255,0.07), transparent 60%),
        linear-gradient(180deg, #ffffff, #f8fafc) !important;
    border: 1px solid rgba(22,119,255,0.22) !important;
    padding: 14px 16px !important;
    margin: 8px 0 4px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.7) inset,
        0 6px 16px -6px rgba(22,119,255,0.15) !important;
    backdrop-filter: none !important;
}
.rv-glass-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background: linear-gradient(90deg, #1677ff, #00c2ff);
    box-shadow: 0 0 10px rgba(0,194,255,0.35);
}
/* 混响头部：紧凑高度 40px 标题渐变文字 */
.rv-glass-card .rv-header {
    min-height: 40px !important;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 4px;
    margin-bottom: 2px;
}
.rv-glass-card .rv-header-icon {
    font-size: 14px;
    filter: drop-shadow(0 1px 1px rgba(22,119,255,0.25));
}
.rv-glass-card .rv-header-title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
    background: linear-gradient(135deg, #0f172a 0%, #1677ff 40%, #00c2ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.rv-glass-card .rv-header-hint {
    font-size: 11.5px;
    color: #475569;
    font-weight: 400;
}
.rv-glass-card .rv-toggle-label {
    margin-left: auto;
    font-size: 12px;
    font-weight: 500;
    color: #475569;
}
.rv-glass-card .rv-toggle-status {
    font-size: 11.5px;
    font-weight: 600;
    color: #1677ff;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(22,119,255,0.08);
    border: 1px solid rgba(22,119,255,0.22);
}
.rv-glass-card .rv-toggle-status.rv-status-off {
    color: #64748b;
    background: rgba(148,163,184,0.10);
    border-color: rgba(148,163,184,0.25);
}
/* iOS Toggle 改小：40×22 紧凑 */
.rv-glass-card .rv-toggle {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    vertical-align: middle;
}
.rv-glass-card .rv-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}
.rv-glass-card .rv-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #cbd5e1;
    transition: .2s;
    border-radius: 22px;
    box-shadow: 0 0 0 1px rgba(15,23,42,0.08) inset, 0 1px 2px rgba(15,23,42,0.05);
}
.rv-glass-card .rv-toggle-slider::before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 3px;
    top: 3px;
    background-color: white;
    transition: .2s;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(15,23,42,0.2);
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider {
    background: linear-gradient(135deg, #1677ff, #00c2ff);
    box-shadow: 0 0 0 1px rgba(22,119,255,0.4) inset, 0 0 10px rgba(0,194,255,0.45);
}
.rv-glass-card .rv-toggle input:disabled + .rv-toggle-slider {
    opacity: .55;
    cursor: not-allowed;
    filter: grayscale(30%);
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider::before {
    transform: translateX(18px);
}
/* 混响滑块区 Cell：蓝青科技风，紧凑 32px 高 */
.rv-glass-card .rv-sliders {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 14px;
    margin-top: 6px;
    padding-top: 8px;
    border-top: 1px dashed rgba(22,119,255,0.18);
}
.rv-glass-card .slider-cell {
    padding: 10px 12px;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
    border: 1px solid rgba(148,163,184,0.45);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.rv-glass-card .slider-cell-label {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    color: #1e40af !important;
    margin-bottom: 3px;
}
.rv-glass-card .slider-cell-value {
    font-size: 11.5px !important;
    color: #0f172a !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #1677ff, #00c2ff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* 科技风 slider 统一轨道 */
.rv-glass-card input[type="range"],
.modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(90deg, #1677ff var(--cell-duck-pct, 50%), #cbd5e1 var(--cell-duck-pct, 50%));
    outline: none;
}
.rv-glass-card input[type="range"]::-webkit-slider-thumb,
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 16px; height: 16px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #ffffff, #e2e8f0);
    border: 2px solid #1677ff;
    cursor: pointer;
    box-shadow: 0 0 0 3px rgba(22,119,255,0.10), 0 1px 3px rgba(22,119,255,0.25);
    transition: all .15s ease;
}
.rv-glass-card input[type="range"]::-webkit-slider-thumb:hover,
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb:hover {
    border-color: #00c2ff;
    box-shadow: 0 0 0 4px rgba(0,194,255,0.12), 0 2px 5px rgba(0,194,255,0.3);
}

/* -------- 11. 混响不支持 chip：科技风警告（红细线+白底+淡红光晕，替换原红橙渐变玻璃） -------- */
.rv-unsupported-chip {
    position: relative;
    margin-top: 8px;
    margin-bottom: 4px;
    padding: 10px 14px 11px;
    font-size: 12px;
    color: #7f1d1d;
    line-height: 1.7;
    border-radius: 8px;
    background:
        radial-gradient(120% 100% at 0% 0%, rgba(239,68,68,0.06), transparent 55%),
        linear-gradient(180deg, #ffffff, #fef2f2);
    border: 1px solid rgba(239,68,68,0.35);
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8) inset,
        0 4px 14px -6px rgba(239,68,68,0.20),
        0 0 0 3px rgba(239,68,68,0.04);
    backdrop-filter: none;
}
.rv-unsupported-chip::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background: linear-gradient(90deg, #ef4444, #f97316);
    box-shadow: 0 0 10px rgba(239,68,68,0.35);
}
.rv-unsupported-chip .rv-err-title {
    font-weight: 700;
    color: #b91c1c;
    margin-right: 4px;
}
.rv-unsupported-chip .rv-err-ua {
    display: inline-block;
    margin-top: 3px;
    font-size: 11px;
    color: #991b1b;
    font-weight: 500;
    padding: 1.5px 9px;
    border-radius: 4px;
    background: rgba(239,68,68,0.08);
    border: 1px solid rgba(239,68,68,0.22);
}
.rv-unsupported-chip .rv-err-hint {
    display: block;
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px dashed rgba(239,68,68,0.18);
    font-size: 11.5px;
    color: #7f1d1d;
    font-weight: 450;
    line-height: 1.65;
}
.rv-unsupported-chip .rv-err-hint b {
    color: #b91c1c;
    font-weight: 650;
}

/* -------- 12. 首页全局 BGM 区的淡入淡出滑块容器与按钮对齐（📊已播放0次与图片按钮平齐） -------- */
.vol-cell,
.duck-cell,
.bgm-stat-cell {
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
    border: 1px solid rgba(22,119,255,0.18);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.bgm-stat-cell {
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .2px;
    color: #1e40af;
    background: linear-gradient(135deg, #ffffff 0%, #eff6ff 100%);
    justify-content: space-between;
    gap: 10px;
}
.bgm-stat-cell strong {
    font-size: 15px;
    font-weight: 750;
    background: linear-gradient(135deg, #1677ff, #00c2ff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* -------- 13. 底部操作区（保存/取消）：统一紧凑 32px 按钮，右对齐整齐 -------- */
.modal-content.task-edit-modal .form-actions,
.modal-content.task-edit-modal .modal-actions,
.modal-content.task-edit-modal [style*="display:flex"][style*="justify-content:flex-end"] {
    padding-top: 6px;
    margin-top: 4px;
    border-top: 1px solid rgba(22,119,255,0.12);
    gap: 10px !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 紧凑模式 Compact Mode（用户反馈：按钮太大看着不得劲 → 统一缩小 + 间距收紧）
 *   尺寸全部 CSS 变量化（下面 7 个变量统一控制，以后微调改一行就行）
 *   策略：高特异性选择器覆盖，全部 !important 保证生效；不改动旧变量值，仅在「编辑任务模态」作用域
 * ============================================================================ */
.modal-content.task-edit-modal {
    /* ── 紧凑尺寸变量（以后再改大小直接改这 7 个值） ── */
    --c-btn-h:          28px;   /* 普通按钮高度（原 32px → 28px） */
    --c-btn-sm-h:       25px;   /* 小按钮高度（原 28px → 25px） */
    --c-input-h:        30px;   /* 输入框/下拉高度（原 32px → 30px） */
    --c-engine-h:       48px;   /* 播报类型/语音引擎大卡高度（原 68px → 48px） */
    --c-form-gap:       14px;   /* 表单项纵向间距（原 20px → 14px） */
    --c-card-pad-v:     11px;   /* 次级卡 上下 padding（原 16px → 11px） */
    --c-card-pad-h:     14px;   /* 次级卡 左右 padding（原 18px → 14px） */
    --c-label-gap:      5px;    /* 标签与控件 间距（原 7px → 5px） */
}

/* ── 1. 模态卡整体 padding 更紧 ── */
.modal-content.task-edit-modal {
    padding: 18px 22px 18px !important;
}
/* ── 2. 标题更紧凑（减小下间距和字重） ── */
.modal-content.task-edit-modal .modal-title {
    padding: 0 0 10px 18px !important;
    margin-bottom: 10px !important;
    font-size: 18px !important;
    font-weight: 650 !important;
}

/* ── 3. 表单组：紧凑间距 + 标签更小 ── */
.modal-content.task-edit-modal .form-group {
    margin-bottom: var(--c-form-gap) !important;
}
.modal-content.task-edit-modal .form-label {
    margin-bottom: var(--c-label-gap) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* ── 4. 输入框 / 下拉 / 文本域：30px 高 + 更小 padding + 更小字号 ── */
.modal-content.task-edit-modal input[type="text"],
.modal-content.task-edit-modal input[type="number"],
.modal-content.task-edit-modal input[type="time"],
.modal-content.task-edit-modal select {
    height: var(--c-input-h) !important;
    min-height: var(--c-input-h) !important;
    padding: 3px 9px !important;
    font-size: 12.5px !important;
    line-height: 1.35;
}
.modal-content.task-edit-modal textarea {
    min-height: 68px !important;
    padding: 6px 9px !important;
    font-size: 12.5px !important;
    line-height: 1.5;
}

/* ── 5. 按钮：全部缩到 28px（btn-sm→25px） ── */
.modal-content.task-edit-modal .btn {
    min-height: var(--c-btn-h) !important;
    height: var(--c-btn-h) !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: calc(var(--c-btn-h) - 2px) !important;
    border-radius: 5px !important;
    letter-spacing: 0 !important;
    gap: 3px !important;
}
.modal-content.task-edit-modal .btn.btn-sm {
    min-height: var(--c-btn-sm-h) !important;
    height: var(--c-btn-sm-h) !important;
    line-height: calc(var(--c-btn-sm-h) - 2px) !important;
    padding: 0 10px !important;
    font-size: 11.5px !important;
}

/* ── 6. 播报类型大卡 + 语音引擎 3 卡：缩到 48px 紧凑高度，字更小 ── */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    min-height: var(--c-engine-h) !important;
    height: var(--c-engine-h) !important;
    padding: 0 13px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 1px !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    font-size: 10.5px !important;
    margin-top: 1px !important;
    line-height: 1.25;
}

/* ── 7. 次级卡 tech-subcard：padding 缩小 + 标题缩小 + 下间距减到 10px ── */
.modal-content.task-edit-modal .tech-subcard,
.modal-content.task-edit-modal [style*="rgba(79,124,255"],
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] {
    padding: var(--c-card-pad-v) var(--c-card-pad-h) !important;
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal .tech-subcard > div:first-child,
.modal-content.task-edit-modal [style*="rgba(79,124,255"] > div:first-child,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child {
    font-size: 12px !important;
    font-weight: 650 !important;
    margin-bottom: 9px !important;
    letter-spacing: 0 !important;
    padding-left: 10px !important;
}
.modal-content.task-edit-modal .tech-subcard > div:first-child::before,
.modal-content.task-edit-modal [style*="rgba(79,124,255"] > div:first-child::before,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child::before {
    top: 2px !important;
    bottom: 2px !important;
    width: 2.5px !important;
}

/* ── 8. 两列栅格 gap 缩小：16/18 → 12/14 ── */
.grid-tech-2col {
    gap: 12px 14px !important;
    margin-bottom: var(--c-form-gap) !important;
}

/* ── 9. 混响卡 rv-glass-card：整体更紧凑 ── */
.rv-glass-card {
    padding: 9px 13px !important;
    margin: 5px 0 2px !important;
    border-radius: 7px !important;
}
.rv-glass-card .rv-header {
    min-height: 34px !important;
    padding-bottom: 2px !important;
    margin-bottom: 0 !important;
    gap: 6px !important;
}
.rv-glass-card .rv-header-icon { font-size: 13px !important; }
.rv-glass-card .rv-header-title {
    font-size: 13px !important;
    letter-spacing: 0 !important;
}
.rv-glass-card .rv-header-hint {
    font-size: 11px !important;
}
.rv-glass-card .rv-toggle-label {
    font-size: 11.5px !important;
    margin-left: auto !important;
}
.rv-glass-card .rv-toggle-status {
    font-size: 11px !important;
    padding: 1.5px 7px !important;
}
/* iOS Toggle 更紧凑：36×20（原 40×22） */
.rv-glass-card .rv-toggle { width: 36px !important; height: 20px !important; }
.rv-glass-card .rv-toggle-slider { border-radius: 20px !important; }
.rv-glass-card .rv-toggle-slider::before {
    height: 14px !important;
    width: 14px !important;
    left: 3px !important;
    top: 3px !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider::before {
    transform: translateX(16px) !important;
}
/* 滑块区更紧凑 */
.rv-glass-card .rv-sliders {
    gap: 7px 10px !important;
    margin-top: 3px !important;
    padding-top: 6px !important;
}
.rv-glass-card .slider-cell {
    padding: 7px 10px !important;
    border-radius: 7px !important;
}
.rv-glass-card .slider-cell-label {
    font-size: 11px !important;
    margin-bottom: 1px !important;
}
.rv-glass-card .slider-cell-value {
    font-size: 11px !important;
}
/* 混响滑块区下面的「试听」按钮：改成 inline-flex，和提示文字平齐（更紧凑）*/
.rv-glass-card + .btn,
.rv-glass-card + * + .btn,
.modal-content.task-edit-modal .rv-glass-card ~ .btn[class*="语音试听"],
.modal-content.task-edit-modal .rv-glass-card ~ button {
    margin-top: 6px !important;
}
/* 混响不支持 chip 也更紧凑 */
.rv-unsupported-chip {
    padding: 8px 12px 9px !important;
    margin-top: 5px !important;
    margin-bottom: 2px !important;
    font-size: 11.5px !important;
    line-height: 1.6 !important;
}
.rv-unsupported-chip .rv-err-ua {
    font-size: 10.5px !important;
    padding: 1px 7px !important;
}
.rv-unsupported-chip .rv-err-hint {
    font-size: 11px !important;
    margin-top: 3px !important;
    padding-top: 3px !important;
    line-height: 1.55 !important;
}

/* ── 10. 混响滑块区的「当前：跟随首页…」提示 chip 更紧凑 ── */
.rv-follow-chip {
    padding: 5px 10px !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
}

/* ── 11. 语音引擎参数滑块（语速/音调/音量）三列布局更紧凑 ── */
.modal-content.task-edit-modal .form-group + [style*="display:grid"]:has(> .form-group > label:first-child:is(:contains("语速"), :contains("音调"))),
.modal-content.task-edit-modal [style*="grid-template-columns: repeat(3"] {
    gap: 10px !important;
}
.modal-content.task-edit-modal input[type="range"] {
    height: 3px !important;
    margin: 4px 0 0 !important;
}
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    width: 14px !important;
    height: 14px !important;
    border-width: 2px !important;
    box-shadow: 0 0 0 2px rgba(22,119,255,0.10), 0 1px 2px rgba(22,119,255,0.25) !important;
}
/* 滑块上方的参数 label（语速/音调/音量文字）更小 */
.modal-content.task-edit-modal .form-group label[for*="语速"],
.modal-content.task-edit-modal .form-group label:has(+ div > input[type="range"]) {
    font-size: 11px !important;
    margin-bottom: 2px !important;
}

/* ── 12. 「用所选语音试听」按钮和提示文字：inline 一行紧凑布局（不换行不浪费高度） ── */
.modal-content.task-edit-modal .tech-subcard .btn[class*="语音试听"],
.modal-content.task-edit-modal .tech-subcard button:has(span:contains("语音试听")),
.modal-content.task-edit-modal [style*="rgba(79,124,255"] > button:first-of-type,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > button:first-of-type {
    display: inline-flex !important;
    margin: 7px 10px 0 0 !important;
    vertical-align: middle !important;
}
/* 试听按钮旁边的提示文字更小 */
.modal-content.task-edit-modal .tech-subcard > [style*="font-size:11"],
.modal-content.task-edit-modal [style*="rgba(79,124,255"] > span:last-of-type,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > span:last-of-type {
    font-size: 10.5px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin-top: 7px !important;
    color: #64748b !important;
}

/* ── 13. 间隔循环设置内的 范围提示小字（1~1440分钟... 那段）更紧凑 ── */
.modal-content.task-edit-modal .tech-subcard .grid-tech-2col > .form-group > div:last-child,
.modal-content.task-edit-modal .tech-subcard [style*="font-size:12px; color:#64748b"] {
    font-size: 10.5px !important;
    margin-top: 2px !important;
    line-height: 1.35;
}

/* ── 14. 播报前提示音/专属闪避策略 的浅灰/浅橙卡片更紧凑 ── */
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"],
.modal-content.task-edit-modal .form-group[style*="background:rgba"] {
    padding: 9px 12px !important;
    border-radius: 7px !important;
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"] label,
.modal-content.task-edit-modal .form-group[style*="background:rgba"] label {
    margin-bottom: 0 !important;
    font-size: 12px !important;
    gap: 6px !important;
}
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"] label span,
.modal-content.task-edit-modal .form-group[style*="background:rgba"] label span {
    font-size: 10.5px !important;
}
.modal-content.task-edit-modal input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
}

/* ── 15. 快速模板下拉 右边的「清空」按钮 与输入框高度完全齐平（30px） ── */
.modal-content.task-edit-modal [style*="display:flex; gap:8px;"] .btn.btn-sm {
    min-height: var(--c-input-h) !important;
    height: var(--c-input-h) !important;
    line-height: calc(var(--c-input-h) - 2px) !important;
    padding: 0 12px !important;
    font-size: 12px !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 任务弹窗二次精修（用户再次反馈：不好看 / 不满意）
 *   思路：去掉之前“蓝青光晕 + 四角L形装饰 + 玻璃拟态叠加”的花哨感，
 *   换成「简洁高级的轻商务科技风」：冷白 + 蓝靛主色 + 绿色点缀混响卡 +
 *   橙色点缀音频/闪避卡；所有卡片、输入框、按钮统一设计语言，层次更清晰。
 * ============================================================================ */

/* ── 1. 模态容器：更干净、更轻、更通透 ── */
.modal-content.task-edit-modal {
    max-width: 980px !important;
    width: calc(100vw - 48px) !important;
    max-height: calc(100vh - 64px) !important;
    padding: 22px 26px 18px !important;
    margin: 32px auto !important;
    border-radius: 14px !important;
    background:
        linear-gradient(180deg, #ffffff 0%, #fbfdff 55%, #f7fafc 100%) !important;
    border: 1px solid rgba(22, 119, 255, 0.16) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.9) inset,
        0 0 0 1px rgba(255,255,255,0.7),
        0 18px 50px -18px rgba(15, 23, 42, 0.28),
        0 8px 20px -10px rgba(22, 119, 255, 0.22) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* 去掉之前过强的顶部渐变条与四角L装饰 */
.modal-content.task-edit-modal::before,
.modal-content.task-edit-modal::after,
.modal-content.task-edit-modal > .modal-title::after {
    display: none !important;
}

/* ── 2. 标题条：改为左蓝条 + 简洁渐变文字，不花哨 ── */
.modal-content.task-edit-modal .modal-title {
    padding: 2px 0 14px 16px !important;
    margin-bottom: 18px !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1px !important;
    color: #0f172a;
    background: linear-gradient(135deg, #0f172a 0%, #2563eb 60%, #0ea5e9 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.modal-content.task-edit-modal .modal-title::before {
    left: 0 !important;
    top: 2px !important;
    bottom: 14px !important;
    width: 4px !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, #2563eb, #0ea5e9) !important;
    box-shadow: 0 0 10px rgba(37, 99, 235, 0.25) !important;
    -webkit-text-fill-color: initial !important;
}

/* ── 3. 表单组与标签：更加克制 ── */
.modal-content.task-edit-modal .form-group {
    margin-bottom: 14px !important;
}
.modal-content.task-edit-modal .form-label {
    margin-bottom: 6px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    letter-spacing: 0 !important;
}

/* ── 4. 输入框/下拉/文本域：统一细线灰边 + focus 蓝边 + 10px 圆角 ── */
.modal-content.task-edit-modal input[type="text"],
.modal-content.task-edit-modal input[type="number"],
.modal-content.task-edit-modal input[type="time"],
.modal-content.task-edit-modal select,
.modal-content.task-edit-modal textarea {
    height: var(--c-input-h, 32px) !important;
    min-height: var(--c-input-h, 32px) !important;
    padding: 4px 12px !important;
    font-size: 13px !important;
    color: #0f172a !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    outline: none !important;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important;
}
.modal-content.task-edit-modal textarea {
    min-height: 78px !important;
    height: auto !important;
    padding: 8px 12px !important;
    line-height: 1.6;
    resize: vertical;
}
.modal-content.task-edit-modal input:focus,
.modal-content.task-edit-modal select:focus,
.modal-content.task-edit-modal textarea:focus {
    border-color: #2563eb !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(37, 99, 235, 0.10),
        0 1px 2px rgba(37, 99, 235, 0.04) !important;
}

/* ── 5. 按钮：统一胶囊圆角 + 轻微按压感，主按钮渐变更高级 ── */
.modal-content.task-edit-modal .btn {
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 30px !important;
    border-radius: 10px !important;
    border: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    transition: transform .12s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
    letter-spacing: 0 !important;
    gap: 4px !important;
}
.modal-content.task-edit-modal .btn:hover {
    transform: translateY(-1px);
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
    background: #f8fafc !important;
    box-shadow: 0 6px 14px -8px rgba(15, 23, 42, 0.18) !important;
}
.modal-content.task-edit-modal .btn:active {
    transform: translateY(0);
}
/* 主按钮：蓝靛渐变 + 轻发光 */
.modal-content.task-edit-modal .btn.btn-primary,
.modal-content.task-edit-modal .btn.btn-success,
.modal-content.task-edit-modal .btn.blue-grad,
.modal-content.task-edit-modal .btn:not(.btn-outline):not(.btn-warning):not(.btn-danger):not(.btn-info) {
    border: none !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 55%, #06b6d4 100%) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.2) inset,
        0 8px 18px -8px rgba(37, 99, 235, 0.55),
        0 0 0 1px rgba(37, 99, 235, 0.25) !important;
}
.modal-content.task-edit-modal .btn.btn-primary:hover,
.modal-content.task-edit-modal .btn.btn-success:hover {
    filter: brightness(1.04);
    color: #ffffff !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.2) inset,
        0 12px 26px -10px rgba(14, 165, 233, 0.6),
        0 0 0 1px rgba(14, 165, 233, 0.35) !important;
}
.modal-content.task-edit-modal .btn.btn-sm {
    min-height: 28px !important;
    height: 28px !important;
    line-height: 26px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
}
.modal-content.task-edit-modal .btn.btn-outline {
    background: #ffffff !important;
    color: #334155 !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: none !important;
}
.modal-content.task-edit-modal .btn.btn-outline:hover {
    border-color: #2563eb !important;
    color: #2563eb !important;
    background: #eff6ff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.08) !important;
}

/* 底部 footer 里的取消按钮统一大小（取消与保存高度一致）*/
.modal-content.task-edit-modal .modal-footer {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;
    padding-top: 14px !important;
    margin-top: 6px !important;
    border-top: 1px solid rgba(15, 23, 42, 0.08) !important;
}
.modal-content.task-edit-modal .cancel-btn,
.modal-content.task-edit-modal .modal-footer .btn {
    min-height: 36px !important;
    height: 36px !important;
    line-height: 34px !important;
    padding: 0 18px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
}
.modal-content.task-edit-modal .cancel-btn {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}
.modal-content.task-edit-modal .cancel-btn:hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
}

/* ── 6. 播报类型卡 + 引擎卡：统一为「轻卡片」风格，去掉左侧粗蓝条 ── */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    min-height: 62px !important;
    height: auto !important;
    padding: 12px 14px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important;
    transition: all .18s ease;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 4px !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before {
    display: none !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    font-size: 11.5px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin-top: 0 !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover {
    transform: translateY(-1px);
    border-color: #93c5fd !important;
    box-shadow: 0 10px 20px -12px rgba(37, 99, 235, 0.25) !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background:
        linear-gradient(180deg, #eff6ff 0%, #ffffff 100%) !important;
    border-color: #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.35),
        0 0 0 4px rgba(37, 99, 235, 0.08),
        0 10px 22px -14px rgba(37, 99, 235, 0.35) !important;
}
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child {
    background: linear-gradient(135deg, #1d4ed8, #0ea5e9) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* 引擎三卡（腾讯/百度/讯飞）：2列时跟上面统一，这里单独给 active 加蓝色徽标感 */
.modal-content.task-edit-modal .play-mode-group {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
}

/* ── 7. 次级卡 tech-subcard：统一蓝靛分组卡（不再用虚边 + 背景色） ── */
.modal-content.task-edit-modal .tech-subcard,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"],
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] {
    background:
        linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
    border: 1px solid rgba(37, 99, 235, 0.14) !important;
    border-style: solid !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    position: relative !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.9) inset,
        0 6px 18px -16px rgba(37, 99, 235, 0.22) !important;
    backdrop-filter: none !important;
    margin-bottom: 12px !important;
}
/* 分组卡顶部：一条细线 + 标题色统一 */
.modal-content.task-edit-modal .tech-subcard > div:first-child,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"] > div:first-child,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child {
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-bottom: 12px !important;
    padding-left: 12px !important;
    background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 60%, #0ea5e9 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.modal-content.task-edit-modal .tech-subcard > div:first-child::before,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"] > div:first-child::before,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child::before {
    left: 0 !important;
    top: 2px !important;
    bottom: 2px !important;
    width: 3px !important;
    border-radius: 3px !important;
    background: linear-gradient(180deg, #2563eb, #0ea5e9) !important;
    box-shadow: 0 0 6px rgba(37, 99, 235, 0.25) !important;
    -webkit-text-fill-color: initial !important;
}

/* ── 8. 两列栅格：统一间距 ── */
.grid-tech-2col {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px 16px !important;
    margin-bottom: 14px !important;
}

/* ── 9. 混响卡：完全重做（绿色分组卡 + 顶部 header 条，不再花里胡哨） ── */
.rv-glass-card,
.modal-content.task-edit-modal .rv-glass-card {
    position: relative !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    margin: 10px 0 6px !important;
    background:
        linear-gradient(180deg, #ffffff 0%, #f7fdf9 100%) !important;
    border: 1px solid rgba(16, 185, 129, 0.18) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.9) inset,
        0 8px 20px -18px rgba(16, 185, 129, 0.28) !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* 去掉玻璃卡的两个光晕圆 */
.rv-glass-card::before,
.rv-glass-card::after,
.modal-content.task-edit-modal .rv-glass-card::before,
.modal-content.task-edit-modal .rv-glass-card::after {
    display: none !important;
}

/* 混响头部：改为细线 header + 左右布局 */
.rv-glass-card .rv-header,
.modal-content.task-edit-modal .rv-glass-card .rv-header {
    position: relative !important;
    z-index: 1 !important;
    min-height: 34px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 4px 0 10px !important;
    margin-bottom: 4px !important;
    border-bottom: 1px dashed rgba(16, 185, 129, 0.22) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #0f172a !important;
    box-shadow: none !important;
}
.rv-glass-card .rv-header-icon {
    font-size: 15px !important;
    filter: drop-shadow(0 1px 1px rgba(16, 185, 129, 0.18)) !important;
}
.rv-glass-card .rv-header-title {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #0f766e !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    letter-spacing: 0 !important;
}
.rv-glass-card .rv-header-hint {
    font-size: 11.5px !important;
    color: #475569 !important;
}
/* 状态 chip：白色底 + 绿/灰文字 */
.rv-glass-card .rv-toggle-status {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #047857 !important;
    border: 1px solid rgba(16, 185, 129, 0.28) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important;
    backdrop-filter: none !important;
    line-height: 1.4 !important;
    margin-right: 6px !important;
}
.rv-glass-card .rv-toggle-status.rv-status-off {
    color: #64748b !important;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    opacity: 1 !important;
}
/* iOS Toggle：保持清爽但和绿色主题更配 */
.rv-glass-card .rv-toggle,
.modal-content.task-edit-modal .rv-glass-card .rv-toggle {
    width: 38px !important;
    height: 22px !important;
}
.rv-glass-card .rv-toggle-slider {
    background: #e2e8f0 !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08) !important;
}
.rv-glass-card .rv-toggle-slider::before {
    height: 16px !important;
    width: 16px !important;
    left: 3px !important;
    top: 3px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18) !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider,
.rv-glass-card.rv-card-task .rv-toggle input:checked + .rv-toggle-slider {
    background: linear-gradient(135deg, #10b981, #22c55e) !important;
    box-shadow:
        0 0 0 1px rgba(16, 185, 129, 0.4) inset,
        0 6px 14px -6px rgba(16, 185, 129, 0.5) !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider::before {
    transform: translateX(16px) !important;
}

/* 混响滑块区：更加克制的单元卡 */
.rv-glass-card .rv-sliders,
.modal-content.task-edit-modal .rv-glass-card .rv-sliders {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px 12px !important;
    margin-top: 8px !important;
    padding-top: 2px !important;
    border-top: none !important;
}
/* 任务模态里的混响滑块统一使用 .rv-slider-cell（模板里已经是 rv-slider-cell）*/
.rv-glass-card .rv-slider-cell,
.rv-glass-card .slider-cell {
    padding: 10px 12px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important;
    backdrop-filter: none !important;
    transition: all .18s ease;
}
.rv-glass-card .rv-slider-cell:hover,
.rv-glass-card .slider-cell:hover {
    border-color: #6ee7b7 !important;
    box-shadow: 0 8px 18px -14px rgba(16, 185, 129, 0.35) !important;
    transform: none !important;
}
.rv-glass-card .rv-slider-cell .rv-lbl,
.rv-glass-card .slider-cell-label {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
    color: #065f46 !important;
    line-height: 1.5 !important;
}
.rv-glass-card .rv-slider-cell .rv-lbl .rv-lbl-val,
.rv-glass-card .slider-cell-value {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #0f766e !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
}

/* 跟随全局 chip / 不支持 chip 统一重新设计 */
.rv-follow-chip,
.modal-content.task-edit-modal .rv-follow-chip {
    margin-top: 8px !important;
    padding: 9px 12px !important;
    font-size: 12px !important;
    color: #065f46 !important;
    background: linear-gradient(180deg, #ecfdf5, #f7fdf9) !important;
    border: 1px solid rgba(16, 185, 129, 0.24) !important;
    border-radius: 10px !important;
    line-height: 1.6 !important;
    backdrop-filter: none !important;
}
.rv-follow-chip strong,
.modal-content.task-edit-modal .rv-follow-chip strong {
    color: #047857 !important;
    font-weight: 700 !important;
}
.rv-unsupported-chip,
.modal-content.task-edit-modal .rv-unsupported-chip {
    position: relative !important;
    z-index: 1 !important;
    margin-top: 8px !important;
    margin-bottom: 4px !important;
    padding: 10px 12px !important;
    font-size: 12px !important;
    color: #991b1b !important;
    line-height: 1.65 !important;
    border-radius: 10px !important;
    background: linear-gradient(180deg, #fef2f2, #fff7ed) !important;
    border: 1px solid rgba(248, 113, 113, 0.3) !important;
    box-shadow: 0 1px 2px rgba(239, 68, 68, 0.05) !important;
    backdrop-filter: none !important;
}
.rv-unsupported-chip::before {
    display: none !important;
}
.rv-unsupported-chip .rv-err-ua {
    display: inline-block;
    margin-top: 4px !important;
    font-size: 11px !important;
    color: #9a3412 !important;
    padding: 2px 8px !important;
    border-radius: 999px !important;
    background: rgba(251, 146, 60, 0.12) !important;
    border: 1px solid rgba(251, 146, 60, 0.28) !important;
}
.rv-unsupported-chip .rv-err-hint {
    display: block !important;
    margin-top: 6px !important;
    padding-top: 6px !important;
    border-top: 1px dashed rgba(239, 68, 68, 0.18) !important;
    font-size: 11.5px !important;
    color: #7f1d1d !important;
    font-weight: 450 !important;
    line-height: 1.6 !important;
}

/* ── 10. 语音滑块（音量/语速/音调三列）：统一轨道与拇指 ── */
.modal-content.task-edit-modal input[type="range"],
.rv-glass-card input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px !important;
    margin: 6px 0 0 !important;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb var(--cell-duck-pct, 45%), #e2e8f0 var(--cell-duck-pct, 45%)) !important;
    outline: none;
}
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track,
.rv-glass-card input[type="range"]::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 999px;
    background: transparent;
}
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb,
.rv-glass-card input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 16px !important;
    height: 16px !important;
    margin-top: -6px;
    border-radius: 50%;
    background: #ffffff !important;
    border: 2px solid #2563eb !important;
    cursor: pointer;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.10), 0 2px 4px rgba(15, 23, 42, 0.12) !important;
    transition: all .15s ease;
}
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb:hover,
.rv-glass-card input[type="range"]::-webkit-slider-thumb:hover {
    border-color: #0ea5e9 !important;
    box-shadow: 0 0 0 5px rgba(14, 165, 233, 0.12), 0 4px 8px rgba(14, 165, 233, 0.22) !important;
}

/* 滑块上方 label 更统一 */
.modal-content.task-edit-modal .form-group label[for*="语速"],
.modal-content.task-edit-modal .form-group label[for*="音调"],
.modal-content.task-edit-modal .form-group label:has(+ div > input[type="range"]) {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    margin-bottom: 2px !important;
}

/* ── 11. 自定义音频设置卡（截图里目前没展示，但仍要做到统一风格） ── */
.modal-content.task-edit-modal [style*="background:linear-gradient(135deg, rgba(250,204,21,.06)"] {
    padding: 14px 16px 16px !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffffff, #fffbeb) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,0.9) inset, 0 8px 20px -18px rgba(245, 158, 11, 0.3) !important;
    margin-bottom: 12px !important;
}
.modal-content.task-edit-modal [style*="rgba(250,204,21,.06)"] > div:first-child > div:first-child {
    color: #92400e !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

/* ── 12. 播报前提示音 与 闪避策略 两张分组卡 ── */
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"],
.modal-content.task-edit-modal .form-group[style*="background:rgba"]:not([style*="rgba(250,204,21"]):not([style*="background:rgba(79,124,255"]) {
    padding: 12px 14px !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important;
}
/* 闪避策略卡片：橙色调，更醒目 */
.modal-content.task-edit-modal .form-group[style*="background:#fff7ed"],
.modal-content.task-edit-modal .form-group[style*="#fff7ed"] {
    background: linear-gradient(180deg, #ffffff, #fff7ed) !important;
    border: 1px solid rgba(253, 186, 116, 0.4) !important;
}
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"] label,
.modal-content.task-edit-modal .form-group[style*="background:rgba"] label {
    margin-bottom: 0 !important;
    font-size: 13px !important;
    gap: 8px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
}
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"] label span,
.modal-content.task-edit-modal .form-group[style*="background:rgba"] label span {
    font-size: 11.5px !important;
    color: #64748b !important;
    font-weight: 400 !important;
}
/* checkbox/radio 统一尺寸与视觉 */
.modal-content.task-edit-modal input[type="checkbox"],
.modal-content.task-edit-modal input[type="radio"] {
    width: 15px !important;
    height: 15px !important;
    accent-color: #2563eb;
}

/* 闪避策略内的展开面板 */
.modal-content.task-edit-modal [style*="background:#fff"][style*="border-radius:6px"][style*="border:1px solid #fed7aa"] {
    padding: 12px 12px 10px !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    border: 1px solid #fed7aa !important;
}

/* ── 13. 滚动条：更细更克制 ── */
.modal-content.task-edit-modal::-webkit-scrollbar { width: 8px !important; }
.modal-content.task-edit-modal::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #cbd5e1, #94a3b8) !important;
    border-radius: 999px !important;
}

/* ── 14. 模板新增的语义化类：标题/子说明/双列播报类型卡 ── */
.modal-content.task-edit-modal .tem-section-group {
    margin-bottom: 16px !important;
}
.modal-content.task-edit-modal .tem-section-label {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 14px !important;
    margin-bottom: 10px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
}
.modal-content.task-edit-modal .tem-section-title {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    white-space: nowrap;
}
.modal-content.task-edit-modal .tem-section-sub {
    font-size: 11.5px !important;
    font-weight: 400 !important;
    color: #64748b !important;
    line-height: 1.55 !important;
    text-align: right;
}
@media (max-width: 720px) {
    .modal-content.task-edit-modal .tem-section-label {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
    }
    .modal-content.task-edit-modal .tem-section-sub {
        text-align: left !important;
    }
}
.modal-content.task-edit-modal .tem-type-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
}
.modal-content.task-edit-modal .tem-card-title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    line-height: 1.35 !important;
}
.modal-content.task-edit-modal .tem-card-desc {
    display: block !important;
    font-size: 11.5px !important;
    font-weight: 400 !important;
    color: #64748b !important;
    line-height: 1.45 !important;
    margin-top: 2px !important;
}

/* 底部 footer：统一「取消 / 保存」视觉 */
.modal-content.task-edit-modal .tem-footer .tem-btn-cancel,
.modal-content.task-edit-modal .tem-footer .tem-btn-save {
    min-width: 104px !important;
    min-height: 38px !important;
    height: 38px !important;
    line-height: 36px !important;
    padding: 0 18px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
}
.modal-content.task-edit-modal .tem-footer .tem-btn-save {
    font-weight: 600 !important;
    background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 45%, #0ea5e9 100%) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.22) inset,
        0 10px 22px -10px rgba(37, 99, 235, 0.55),
        0 0 0 1px rgba(37, 99, 235, 0.28) !important;
}
.modal-content.task-edit-modal .tem-footer .tem-btn-save:hover {
    filter: brightness(1.05) !important;
    color: #ffffff !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.22) inset,
        0 14px 28px -10px rgba(14, 165, 233, 0.65),
        0 0 0 1px rgba(14, 165, 233, 0.35) !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 卡片再紧凑一层（用户再次诉求：卡片再紧凑一点）
 *   策略：只收紧「卡片密度维度」（padding / gap / margin / 卡高 / 字号间距），
 *   不改变上一套主色和圆角，保持可回退的最小差异。
 *   全部高特异性 + !important，直接覆盖前面两层（科技UI层 / 精修层）。
 * ============================================================================ */

/* ── 1. 弹窗整体 padding 再收一圈，给卡更紧的留白 ── */
.modal-content.task-edit-modal {
    padding: 18px 22px 14px !important;
}

/* ── 2. 播报类型两卡 / 引擎三卡：高度与内边距再压缩 ── */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    min-height: 54px !important;
    padding: 9px 12px !important;
    gap: 2px !important;
}
.modal-content.task-edit-modal .tem-card-title,
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 12.5px !important;
    font-weight: 600 !important;
}
.modal-content.task-edit-modal .tem-card-desc,
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    font-size: 11px !important;
    line-height: 1.35 !important;
    margin-top: 1px !important;
}
.modal-content.task-edit-modal .tem-type-grid,
.modal-content.task-edit-modal .play-mode-group {
    gap: 8px !important;
}

/* ── 3. 次级卡（任务专属语音设置 / 间隔循环设置）：再紧一档 ── */
.modal-content.task-edit-modal .tech-subcard,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"],
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] {
    padding: 11px 13px !important;
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal .tech-subcard > div:first-child,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"] > div:first-child,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > div:first-child {
    font-size: 12.5px !important;
    margin-bottom: 9px !important;
    padding-left: 10px !important;
}

/* ── 4. 表单组与栅格：上下间距收紧 ── */
.modal-content.task-edit-modal .form-group {
    margin-bottom: 11px !important;
}
.modal-content.task-edit-modal .tem-section-group {
    margin-bottom: 13px !important;
}
.modal-content.task-edit-modal .tem-section-label {
    margin-bottom: 8px !important;
    gap: 10px !important;
}
.grid-tech-2col {
    gap: 10px 14px !important;
    margin-bottom: 11px !important;
}

/* ── 5. 混响卡：卡片整体 padding 收紧 + 头部更低 + 滑块 cell 更薄 ── */
.rv-glass-card,
.modal-content.task-edit-modal .rv-glass-card {
    padding: 10px 12px !important;
    margin: 8px 0 5px !important;
}
.rv-glass-card .rv-header,
.modal-content.task-edit-modal .rv-glass-card .rv-header {
    min-height: 30px !important;
    padding: 2px 0 8px !important;
    margin-bottom: 2px !important;
    gap: 6px !important;
}
.rv-glass-card .rv-header-icon { font-size: 14px !important; }
.rv-glass-card .rv-header-title { font-size: 12.5px !important; }
.rv-glass-card .rv-header-hint { font-size: 11px !important; }
.rv-glass-card .rv-toggle-status {
    font-size: 11px !important;
    padding: 2px 8px !important;
    margin-right: 4px !important;
}
/* Toggle 再小一圈：34×20 */
.rv-glass-card .rv-toggle,
.modal-content.task-edit-modal .rv-glass-card .rv-toggle {
    width: 34px !important;
    height: 20px !important;
}
.rv-glass-card .rv-toggle-slider::before {
    height: 14px !important;
    width: 14px !important;
    left: 3px !important;
    top: 3px !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider::before {
    transform: translateX(14px) !important;
}
.rv-glass-card .rv-sliders,
.modal-content.task-edit-modal .rv-glass-card .rv-sliders {
    gap: 8px 10px !important;
    margin-top: 6px !important;
}
.rv-glass-card .rv-slider-cell,
.rv-glass-card .slider-cell {
    padding: 7px 10px !important;
}
.rv-glass-card .rv-slider-cell .rv-lbl,
.rv-glass-card .slider-cell-label {
    font-size: 11px !important;
    margin-bottom: 4px !important;
}
.rv-glass-card .rv-slider-cell .rv-lbl .rv-lbl-val,
.rv-glass-card .slider-cell-value {
    font-size: 11.5px !important;
}
/* 跟随全局 / 不支持 chip：再紧凑 */
.rv-follow-chip,
.modal-content.task-edit-modal .rv-follow-chip,
.rv-unsupported-chip,
.modal-content.task-edit-modal .rv-unsupported-chip {
    margin-top: 6px !important;
    padding: 7px 10px !important;
    font-size: 11.5px !important;
    line-height: 1.55 !important;
}
.rv-unsupported-chip .rv-err-ua {
    margin-top: 3px !important;
    font-size: 10.5px !important;
    padding: 1.5px 7px !important;
}
.rv-unsupported-chip .rv-err-hint {
    margin-top: 5px !important;
    padding-top: 5px !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
}

/* ── 6. 自定义音频设置卡：卡内 padding 收紧 ── */
.modal-content.task-edit-modal [style*="background:linear-gradient(135deg, rgba(250,204,21,.06)"] {
    padding: 12px 14px 13px !important;
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal [style*="rgba(250,204,21,.06)"] > div:first-child {
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal [style*="rgba(250,204,21,.06)"] > div:first-child > div:first-child {
    font-size: 12.5px !important;
}

/* ── 7. 提示音卡 / 闪避策略卡：内外 padding 一起收紧 ── */
.modal-content.task-edit-modal .form-group[style*="background:#f5f5f5"],
.modal-content.task-edit-modal .form-group[style*="background:rgba"]:not([style*="rgba(250,204,21"]):not([style*="background:rgba(79,124,255"]) {
    padding: 10px 12px !important;
    margin-bottom: 10px !important;
}
.modal-content.task-edit-modal .form-group[style*="background:#fff7ed"],
.modal-content.task-edit-modal .form-group[style*="#fff7ed"] {
    padding: 10px 12px !important;
    margin-bottom: 10px !important;
}
/* 闪避展开内卡：padding 再收 */
.modal-content.task-edit-modal [style*="background:#fff"][style*="border-radius:6px"][style*="border:1px solid #fed7aa"] {
    padding: 10px 10px 8px !important;
}

/* ── 8. 输入框/下拉/按钮：高度再小 1-2px，更扁更紧 ── */
.modal-content.task-edit-modal {
    --c-input-h: 29px !important;  /* 原 30/32 → 29 */
    --c-btn-h:  30px !important;  /* 原 32 → 30 */
    --c-btn-sm-h: 26px !important;/* 原 28 → 26 */
    --c-label-gap: 4px !important;
    --c-form-gap: 11px !important;
}
.modal-content.task-edit-modal input[type="text"],
.modal-content.task-edit-modal input[type="number"],
.modal-content.task-edit-modal input[type="time"],
.modal-content.task-edit-modal select {
    height: var(--c-input-h, 29px) !important;
    min-height: var(--c-input-h, 29px) !important;
    padding: 3px 11px !important;
    font-size: 12.5px !important;
}
.modal-content.task-edit-modal textarea {
    min-height: 70px !important;
    padding: 7px 11px !important;
    font-size: 12.5px !important;
}
.modal-content.task-edit-modal .btn {
    min-height: 30px !important;
    height: 30px !important;
    padding: 0 13px !important;
    font-size: 12.5px !important;
    line-height: 28px !important;
    border-radius: 9px !important;
}
.modal-content.task-edit-modal .btn.btn-sm {
    min-height: 26px !important;
    height: 26px !important;
    padding: 0 11px !important;
    font-size: 11.5px !important;
    line-height: 24px !important;
}

/* ── 9. 底部取消/保存按钮高度再小一点（38→36），仍保持明显操作感 ── */
.modal-content.task-edit-modal .tem-footer {
    padding-top: 12px !important;
    margin-top: 4px !important;
}
.modal-content.task-edit-modal .tem-footer .tem-btn-cancel,
.modal-content.task-edit-modal .tem-footer .tem-btn-save {
    min-width: 100px !important;
    min-height: 36px !important;
    height: 36px !important;
    line-height: 34px !important;
    padding: 0 16px !important;
    font-size: 12.5px !important;
    border-radius: 9px !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 修复截图两处红框“看不清、看着头疼”（对比度 + 字色重写）
 *   红框1：播报类型激活卡（文本TTS播报）—— 旧版是蓝紫底 + 深紫小字/白字，说明文字看不清。
 *   红框2：混响 header 条（本任务专属混响）—— 旧版整根深绿渐变背景 + 白字，压眼睛。
 *   修复原则：统一换成“浅色底 + 深色主字 + 彩色点缀边”，阅读成本最低。
 * ============================================================================ */

/* ── 红框1：播报类型两卡（文本TTS播报 / 自定义音频文件）激活态字彻底清晰 ── */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background:
        linear-gradient(180deg, #eff6ff 0%, #ffffff 100%) !important;
    border-color: #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.35),
        0 0 0 4px rgba(37, 99, 235, 0.10),
        0 8px 18px -12px rgba(37, 99, 235, 0.3) !important;
}
/* 激活主标题：必须是深色高对比字 */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child,
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active .tem-card-title {
    background: none !important;
    -webkit-text-fill-color: #0f172a !important;
    color: #0f172a !important;
    font-weight: 700 !important;
}
/* 激活说明小字：必须是深蓝深色字，不要再透明/白色 */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:last-child,
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active .tem-card-desc {
    color: #1d4ed8 !important;
    font-weight: 500 !important;
    opacity: 1 !important;
}
/* 未激活态也要清楚一点：说明字不要太灰 */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child,
.modal-content.task-edit-modal .tem-card-desc {
    color: #475569 !important;
    opacity: 1 !important;
}

/* ── 红框2：混响 header 条（本任务专属混响）彻底去深绿满铺 + 白字 ── */
.rv-glass-card .rv-header,
.modal-content.task-edit-modal .rv-glass-card .rv-header,
/* 这一条就是截图里那根“绿底白字”：它来自最早的 rv-header 渐变条，带 green 变体 */
.rv-glass-card.rv-card-task .rv-header,
.rv-glass-card .rv-header.rv-header-green {
    background: transparent !important;       /* 去掉深绿满铺 */
    color: #065f46 !important;                /* 文字改深绿 */
    padding: 3px 2px 8px !important;
    border-radius: 0 !important;
    border-bottom: 1px dashed rgba(16, 185, 129, 0.28) !important;
    box-shadow: none !important;
}
.rv-glass-card.rv-card-task .rv-header::before,
.rv-glass-card .rv-header.rv-header-green::before,
.rv-glass-card .rv-header::before {
    display: none !important;
}
/* 混响标题：深绿实心字，不要再用“背景渐变+text-fill:transparent”遮罩 */
.rv-glass-card .rv-header-title {
    color: #065f46 !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    font-weight: 700 !important;
}
/* 混响图标 + 标题区域高对比 chip */
.rv-glass-card .rv-header-icon {
    background: linear-gradient(135deg, #10b981, #22c55e);
    color: #ffffff;
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    text-align: center !important;
    border-radius: 6px;
    font-size: 13px !important;
    padding: 0;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0;
    filter: none !important;
    box-shadow: 0 2px 6px -2px rgba(16, 185, 129, 0.45);
}
/* 状态 chip：白底 + 黑/深绿字，不要半透明白字 */
.rv-glass-card .rv-toggle-status {
    background: #ffffff !important;
    border: 1px solid rgba(16, 185, 129, 0.35) !important;
    color: #065f46 !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    line-height: 1.4 !important;
    backdrop-filter: none !important;
}
.rv-glass-card .rv-toggle-status.rv-status-off {
    color: #475569 !important;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}
/* 如有 header 里的说明文字，统一深色 */
.rv-glass-card .rv-header-hint {
    color: #475569 !important;
    opacity: 1 !important;
}
.rv-glass-card .rv-toggle-label {
    color: #334155 !important;
    opacity: 1 !important;
}

/* 跟随全局 chip（混响卡下方那一行小字，通常是浅绿底）：字色加深，避免淡绿底看不清 */
.rv-follow-chip,
.modal-content.task-edit-modal .rv-follow-chip {
    background: #ffffff !important;
    border: 1px solid rgba(16, 185, 129, 0.3) !important;
    color: #065f46 !important;
}
.rv-follow-chip strong,
.modal-content.task-edit-modal .rv-follow-chip strong {
    color: #047857 !important;
}

/* 播报类型 label 下面那行“共X条 / 提示”等副说明统一加深，避免发灰看不清 */
.modal-content.task-edit-modal .form-label > span:last-child,
.modal-content.task-edit-modal .tem-section-sub,
.modal-content.task-edit-modal [class*="说明"],
.modal-content.task-edit-modal [style*="font-size:11.5px"] {
    color: #475569 !important;
}
/* 专门对“语音试听”旁边的提示文字加深（原 64748b 稍灰，略加深一档） */
.modal-content.task-edit-modal .tech-subcard > [style*="font-size:11"],
.modal-content.task-edit-modal [style*="rgba(79,124,255"] > span:last-of-type,
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] > span:last-of-type {
    color: #475569 !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 修复「按钮字都看不清」—— 任务弹窗内所有按钮/引擎卡字色高对比兜底
 *   根因：之前多层覆盖里残留了 -webkit-text-fill-color:transparent + background-clip:text
 *   方案：在 .modal-content.task-edit-modal 作用域内，把按钮字（包括引擎三卡/播报类型/通用
 *   btn）统一强制为“深色实心字”，彻底取消透明渐变字，并且字体粗细≥600。
 * ============================================================================ */

/* 1) 引擎三卡（腾讯TTS / 百度TTS / 讯飞智作）— 截图中最明显的三块按钮卡 */
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn * {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
}
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn:hover {
    border-color: #93c5fd !important;
    background: #f8fbff !important;
    box-shadow: 0 8px 18px -12px rgba(37, 99, 235, 0.25) !important;
}
/* 激活态：浅蓝底 + 蓝边 + 加粗蓝黑字，绝对不再用渐变字 */
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active * {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
}
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%) !important;
    border: 1.5px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.35),
        0 0 0 4px rgba(37, 99, 235, 0.10),
        0 8px 18px -12px rgba(37, 99, 235, 0.32) !important;
}

/* 2) 播报类型两卡（文本TTS播报 / 自定义音频文件）— 主字/副字一律实心深色 */
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn,
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn * {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
}
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn .tem-card-desc {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    font-weight: 500 !important;
}
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%) !important;
    border: 1.5px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.35),
        0 0 0 4px rgba(37, 99, 235, 0.10),
        0 8px 18px -12px rgba(37, 99, 235, 0.32) !important;
}
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active .tem-card-title {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-weight: 700 !important;
}
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active .tem-card-desc {
    color: #1d4ed8 !important;
    -webkit-text-fill-color: #1d4ed8 !important;
    font-weight: 600 !important;
}

/* 3) 通用 btn：白底/蓝底按钮一律强制字色，避免被外层压成透明 */
.modal-content.task-edit-modal .btn,
.modal-content.task-edit-modal .btn *,
.modal-content.task-edit-modal .cancel-btn,
.modal-content.task-edit-modal .cancel-btn * {
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
}
/* 排除文件上传 input：保持 opacity:0，否则会盖住按钮文字 */
.modal-content.task-edit-modal .btn > input[type="file"],
.modal-content.task-edit-modal .btn > input[type="file"] * {
    opacity: 0 !important;
    filter: none !important;
    text-shadow: none !important;
}
/* 普通/描边按钮字色：深蓝黑 */
.modal-content.task-edit-modal .btn.btn-outline,
.modal-content.task-edit-modal .btn.btn-outline *,
.modal-content.task-edit-modal .cancel-btn,
.modal-content.task-edit-modal .cancel-btn * {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    font-weight: 600 !important;
}
/* 主按钮/蓝紫渐变按钮字色：纯白色加粗，避免糊 */
.modal-content.task-edit-modal .btn.btn-primary,
.modal-content.task-edit-modal .btn.btn-primary *,
.modal-content.task-edit-modal .btn.btn-success,
.modal-content.task-edit-modal .btn.btn-success *,
.modal-content.task-edit-modal .tem-btn-save,
.modal-content.task-edit-modal .tem-btn-save *,
.modal-content.task-edit-modal .btn.blue-grad,
.modal-content.task-edit-modal .btn.blue-grad * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    font-weight: 700 !important;
}

/* 4) 引擎卡/播报类型卡内的 emoji 图标和括号内小字：保证子字不被变灰 */
.modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn > span {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    opacity: 1 !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 重做滑块 UI：完全换成用户图片里的「蓝紫渐变轨道 + 白色圆形 thumb + 紫色发光」
 *   作用域：任务弹窗 + 混响卡内所有 input[type=range]（覆盖之前的蓝色/灰色滑块）
 *   轨道填充使用 CSS 变量 --range-pct（统一）+ 兼容老变量 --cell-duck-pct。
 * ============================================================================ */

/* 基础尺寸与轨道背景（左段蓝->紫渐变，右段浅灰） */
.modal-content.task-edit-modal input[type="range"],
.rv-glass-card input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 24px !important;       /* 加大点击热区，轨道本身仍是细线 */
    min-height: 24px !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    border-radius: 999px !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    --tem-gradient: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
    --tem-track-bg: #e5e7eb;
    cursor: pointer;
}

/* WebKit：整条轨道渲染成「渐变+灰」两段，通过 --range-pct 切分 */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track,
.rv-glass-card input[type="range"]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 3px !important;           /* 图片里的细线感 */
    border-radius: 999px !important;
    border: none !important;
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.15);
}
/* WebKit thumb：白圆 + 紫蓝发光阴影（图片风格） */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb,
.rv-glass-card input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px !important;
    height: 18px !important;
    margin-top: -7.5px;           /* 18/2 - 3/2 = 7.5，让圆垂直居中在细轨道上 */
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease;
}
.modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb,
.rv-glass-card input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.05);
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.45),
        0 0 0 6px rgba(102, 126, 234, 0.18),
        0 6px 14px rgba(118, 75, 162, 0.28),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}
.modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb,
.rv-glass-card input[type="range"]:active::-webkit-slider-thumb {
    transform: scale(0.96);
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.55),
        0 0 0 6px rgba(118, 75, 162, 0.22),
        0 6px 16px rgba(118, 75, 162, 0.32) !important;
}

/* Firefox：轨道左段（-moz-range-progress）用蓝紫渐变，整段剩余走灰色 */
.modal-content.task-edit-modal input[type="range"]::-moz-range-track,
.rv-glass-card input[type="range"]::-moz-range-track {
    width: 100%;
    height: 3px !important;
    border-radius: 999px !important;
    border: none !important;
    background: var(--tem-track-bg) !important;
    outline: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-progress,
.rv-glass-card input[type="range"]::-moz-range-progress {
    height: 3px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
    border: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-thumb,
.rv-glass-card input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease;
}
.modal-content.task-edit-modal input[type="range"]:hover::-moz-range-thumb,
.rv-glass-card input[type="range"]:hover::-moz-range-thumb {
    transform: scale(1.05);
}
/* 聚焦时去掉默认发光，换成我们的紫蓝 */
.modal-content.task-edit-modal input[type="range"]:focus,
.rv-glass-card input[type="range"]:focus {
    outline: none !important;
}
.modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb,
.rv-glass-card input[type="range"]:focus::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(102, 126, 234, 0.6),
        0 0 0 7px rgba(102, 126, 234, 0.18),
        0 6px 14px rgba(118, 75, 162, 0.28) !important;
}

/* 禁用态 */
.modal-content.task-edit-modal input[type="range"]:disabled,
.rv-glass-card input[type="range"]:disabled {
    opacity: .55 !important;
    cursor: not-allowed !important;
    filter: grayscale(.1);
}

/* 兼容：把之前用到的 --cell-duck-pct 也作为 fallback 映射，老代码更新的滑块照样填充 */
.modal-content.task-edit-modal input[type="range"],
.rv-glass-card input[type="range"] {
    --range-pct: var(--cell-duck-pct, 50%);
}

/* ============================================================================
 * 2026-08-28 ★★★ 用户要求：混响 UI 保留这种“整根深绿条”样式，但字体颜色改成白色
 *   目标：恢复 rv-header（首页 + 任务）的“深绿渐变满铺条”，并把条内所有文字/状态/
 *   hint 全部改为白色/近白色，保证在深绿背景上清晰可见；同时开关和 chip 也适配。
 * ============================================================================ */

/* 1) 混响 header：恢复深绿渐变满铺条（用户现在截图里的形态） */
.rv-glass-card .rv-header,
.modal-content.task-edit-modal .rv-glass-card .rv-header,
.rv-glass-card.rv-card-task .rv-header,
.rv-glass-card .rv-header.rv-header-green {
    background: linear-gradient(135deg, #10b981 0%, #059669 55%, #047857 100%) !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    padding: 9px 12px !important;
    border-bottom: none !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.22) inset,
        0 10px 22px -14px rgba(16, 185, 129, 0.5),
        0 0 0 1px rgba(16, 185, 129, 0.28) !important;
}
.rv-glass-card.rv-card-task .rv-header::before,
.rv-glass-card .rv-header.rv-header-green::before,
.rv-glass-card .rv-header::before {
    display: none !important;
}

/* 2) 条内所有文字强制白色：标题 / hint / toggle 标签 / span 子节点 全白 */
.rv-glass-card .rv-header-title,
.modal-content.task-edit-modal .rv-glass-card .rv-header-title {
    color: #ffffff !important;
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    font-weight: 700 !important;
}
.rv-glass-card .rv-header-hint,
.modal-content.task-edit-modal .rv-glass-card .rv-header-hint {
    color: rgba(255, 255, 255, 0.92) !important;
    opacity: 1 !important;
}
.rv-glass-card .rv-toggle-label,
.rv-glass-card .rv-header .rv-toggle-label,
.modal-content.task-edit-modal .rv-glass-card .rv-header * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.10);
}

/* 3) 左侧混响图标 chip：白底绿字（在深绿条上更搭，且不抢主标题） */
.rv-glass-card .rv-header-icon,
.modal-content.task-edit-modal .rv-glass-card .rv-header-icon {
    background: #ffffff !important;
    color: #059669 !important;
    width: 24px !important;
    height: 24px !important;
    line-height: 24px !important;
    border-radius: 7px !important;
    font-size: 14px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0;
    filter: none !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.55) inset,
        0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

/* 4) 状态 chip（跟随全局开关左侧文字）：改成深绿半透明底 + 白字，避免白底在深绿条上刺眼 */
.rv-glass-card .rv-toggle-status,
.modal-content.task-edit-modal .rv-glass-card .rv-toggle-status {
    background: rgba(6, 95, 70, 0.32) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    backdrop-filter: none !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06) inset,
        0 2px 6px rgba(0, 0, 0, 0.08) !important;
}
.rv-glass-card .rv-toggle-status.rv-status-off {
    background: rgba(15, 23, 42, 0.25) !important;
    color: rgba(255, 255, 255, 0.88) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

/* 5) 开关在深绿条上的视觉：保持默认灰 + 打开绿，右侧 thumb 保持白圆，不用再换 */
.rv-glass-card .rv-toggle,
.modal-content.task-edit-modal .rv-glass-card .rv-toggle {
    flex-shrink: 0;
}
.rv-glass-card .rv-toggle-slider {
    background: rgba(255, 255, 255, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.20) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08) !important;
}
.rv-glass-card .rv-toggle-slider::before {
    background: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.16) !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider,
.rv-glass-card.rv-card-task .rv-toggle input:checked + .rv-toggle-slider {
    background: rgba(255, 255, 255, 0.96) !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.85) inset,
        0 0 0 1px rgba(16, 185, 129, 0.45),
        0 6px 14px -6px rgba(16, 185, 129, 0.45) !important;
}
.rv-glass-card .rv-toggle input:checked + .rv-toggle-slider::before {
    background: linear-gradient(135deg, #10b981, #059669) !important;
    border: 1px solid rgba(255,255,255,0.55) !important;
    box-shadow: 0 2px 6px rgba(6, 95, 70, 0.28) !important;
}

/* 6) 禁用态/不支持态：开关锁死灰，同时条内小字仍白 */
.rv-glass-card .rv-toggle input:disabled + .rv-toggle-slider {
    opacity: 0.85;
    cursor: not-allowed;
}
.rv-glass-card.rv-card-task .rv-header-spacer,
.rv-glass-card .rv-header-spacer {
    background: none !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 用户三次强调：“对话框里面的滑块 滑块 滑块” —— 参数区滑块单独重做
 *   目标：让「任务弹窗里的普通参数滑块」（语速/音调/音量/淡入/淡出等）一眼就能看见，
 *   而不是混响卡那种精致细线风格。
 *   方案：轨道加粗到 6px，thumb 放大到 22px，并用更强的紫蓝发光；
 *         同时立刻把“.rv-glass-card 内滑块”回写回细线风格，避免破坏用户刚说保留的混响UI。
 * ============================================================================ */

/* A. 先把“任务弹窗里所有滑块”改成更粗、更明显的参数滑块风格 */
.modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 28px !important;
    min-height: 28px !important;
    margin: 4px 0 2px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    --tem-gradient: linear-gradient(90deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%);
    --tem-track-bg: #e5e7eb;
    cursor: pointer;
}
/* WebKit track：粗轨道 6px + 内阴影 */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px !important;
    border-radius: 999px !important;
    border: none !important;
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
    box-shadow:
        inset 0 1px 2px rgba(15, 23, 42, 0.08),
        0 1px 0 rgba(255,255,255,0.6) inset;
}
/* WebKit thumb：22px 大白圆 + 强紫蓝发光（拖动时非常明显） */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px !important;
    height: 22px !important;
    margin-top: -8px;   /* 22/2 - 6/2 = 8 */
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 2px solid #8b5cf6 !important;
    box-shadow:
        0 0 0 1px rgba(99, 102, 241, 0.4),
        0 0 0 6px rgba(139, 92, 246, 0.16),
        0 8px 18px -6px rgba(139, 92, 246, 0.45),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
    cursor: grab;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.08);
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 1px rgba(99, 102, 241, 0.5),
        0 0 0 8px rgba(99, 102, 241, 0.16),
        0 12px 22px -6px rgba(99, 102, 241, 0.5),
        0 2px 4px rgba(15, 23, 42, 0.14) !important;
}
.modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb {
    cursor: grabbing;
    transform: scale(0.95);
    border-color: #4f46e5 !important;
    box-shadow:
        0 0 0 1px rgba(79, 70, 229, 0.55),
        0 0 0 8px rgba(79, 70, 229, 0.22),
        0 14px 22px -8px rgba(79, 70, 229, 0.55) !important;
}
.modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb {
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 1px rgba(99, 102, 241, 0.6),
        0 0 0 9px rgba(99, 102, 241, 0.18),
        0 12px 22px -6px rgba(99, 102, 241, 0.5) !important;
}

/* Firefox 同规格：粗轨道 + 大 thumb */
.modal-content.task-edit-modal input[type="range"]::-moz-range-track {
    width: 100%;
    height: 6px !important;
    border-radius: 999px !important;
    border: none !important;
    background: var(--tem-track-bg) !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
    outline: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    height: 6px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%) !important;
    border: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 2px solid #8b5cf6 !important;
    box-shadow:
        0 0 0 1px rgba(99, 102, 241, 0.4),
        0 0 0 6px rgba(139, 92, 246, 0.16),
        0 8px 18px -6px rgba(139, 92, 246, 0.45),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
    cursor: grab;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.modal-content.task-edit-modal input[type="range"]:hover::-moz-range-thumb {
    transform: scale(1.08);
    border-color: #6366f1 !important;
}

/* 禁用态：灰化+不可点击 */
.modal-content.task-edit-modal input[type="range"]:disabled {
    opacity: .55 !important;
    cursor: not-allowed !important;
    filter: grayscale(.12);
}

/* B. 关键：马上把“.rv-glass-card 内滑块”写回精致细线风格，避免把用户刚要求“保留UI”的混响滑块也一起改粗 */
.rv-glass-card input[type="range"] {
    height: 24px !important;
    min-height: 24px !important;
    --tem-gradient: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
    --tem-track-bg: #e5e7eb !important;
}
.rv-glass-card input[type="range"]::-webkit-slider-runnable-track {
    height: 3px !important;
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.15);
}
.rv-glass-card input[type="range"]::-webkit-slider-thumb {
    width: 18px !important;
    height: 18px !important;
    margin-top: -7.5px;
    background: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
}
.rv-glass-card input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.05);
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.45),
        0 0 0 6px rgba(102, 126, 234, 0.18),
        0 6px 14px rgba(118, 75, 162, 0.28),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}
.rv-glass-card input[type="range"]::-moz-range-track {
    height: 3px !important;
    background: #e5e7eb !important;
}
.rv-glass-card input[type="range"]::-moz-range-progress {
    height: 3px !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
}
.rv-glass-card input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 用户明确要求：用「淡入 / 淡出」那套样式的滑块（= 语义化颜色滑块）
 *   体系：
 *     · 绿色主题 range-theme-green  → 淡入（恢复正常 / 音量往上）
 *     · 橙红主题 range-theme-orange → 淡出（压低音量 / 降低 / 闪避激活）
 *     · 蓝色主题 range-theme-blue   → 中性参数（语速/音调/音量等，任务弹窗默认）
 *   规则：
 *     · 任务弹窗内默认整体用蓝色粗滑块；一旦元素带了主题类就按主题改色
 *     · 首页 fade-duration-cell.fade-in / .fade-out 内的 input 强制对应主题
 *     · rv-glass-card 混响卡滑块继续保留细线风格，不被主题覆盖
 * ============================================================================ */

/* 任务弹窗内：默认改为“蓝色中性主题”的粗滑块（替换上一段写的紫蓝） */
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue) {
    --tem-gradient: linear-gradient(90deg, #3b82f6 0%, #2563eb 60%, #1d4ed8 100%) !important;
    --tem-track-bg: #e2e8f0 !important;
}
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue)::-webkit-slider-runnable-track {
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
}
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue)::-webkit-slider-thumb {
    border: 2px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.42),
        0 0 0 6px rgba(37, 99, 235, 0.14),
        0 8px 18px -6px rgba(37, 99, 235, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue):hover::-webkit-slider-thumb {
    border-color: #1d4ed8 !important;
    box-shadow:
        0 0 0 1px rgba(29, 78, 216, 0.52),
        0 0 0 8px rgba(29, 78, 216, 0.16),
        0 12px 22px -6px rgba(29, 78, 216, 0.5),
        0 2px 4px rgba(15, 23, 42, 0.14) !important;
}
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue)::-moz-range-progress {
    background: linear-gradient(90deg, #3b82f6 0%, #2563eb 60%, #1d4ed8 100%) !important;
}
.modal-content.task-edit-modal input[type="range"]:not(.range-theme-green):not(.range-theme-orange):not(.range-theme-blue)::-moz-range-thumb {
    border: 2px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.42),
        0 0 0 6px rgba(37, 99, 235, 0.14),
        0 8px 18px -6px rgba(37, 99, 235, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}

/* 1) 绿色主题：淡入 / 恢复类滑块 */
input[type="range"].range-theme-green,
.fade-duration-half.fade-in input[type="range"] {
    --tem-gradient: linear-gradient(90deg, #34d399 0%, #10b981 55%, #059669 100%) !important;
    --tem-track-bg: #d1fae5 !important;
}
input[type="range"].range-theme-green::-webkit-slider-runnable-track,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-runnable-track {
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
}
input[type="range"].range-theme-green::-webkit-slider-thumb,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-thumb {
    border: 2px solid #10b981 !important;
    box-shadow:
        0 0 0 1px rgba(16, 185, 129, 0.42),
        0 0 0 6px rgba(16, 185, 129, 0.14),
        0 8px 18px -6px rgba(16, 185, 129, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}
input[type="range"].range-theme-green:hover::-webkit-slider-thumb,
.fade-duration-half.fade-in input[type="range"]:hover::-webkit-slider-thumb {
    border-color: #059669 !important;
    box-shadow:
        0 0 0 1px rgba(5, 150, 105, 0.52),
        0 0 0 8px rgba(5, 150, 105, 0.16),
        0 12px 22px -6px rgba(5, 150, 105, 0.5),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}
input[type="range"].range-theme-green::-moz-range-progress,
.fade-duration-half.fade-in input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg, #34d399 0%, #10b981 55%, #059669 100%) !important;
}
input[type="range"].range-theme-green::-moz-range-thumb,
.fade-duration-half.fade-in input[type="range"]::-moz-range-thumb {
    border: 2px solid #10b981 !important;
    box-shadow:
        0 0 0 1px rgba(16, 185, 129, 0.42),
        0 0 0 6px rgba(16, 185, 129, 0.14),
        0 8px 18px -6px rgba(16, 185, 129, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}

/* 2) 橙红主题：淡出 / 压低音量 / 降低 类滑块 */
input[type="range"].range-theme-orange,
.fade-duration-half.fade-out input[type="range"] {
    --tem-gradient: linear-gradient(90deg, #fb923c 0%, #f97316 50%, #ea580c 80%, #dc2626 100%) !important;
    --tem-track-bg: #ffedd5 !important;
}
input[type="range"].range-theme-orange::-webkit-slider-runnable-track,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-runnable-track {
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
}
input[type="range"].range-theme-orange::-webkit-slider-thumb,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-thumb {
    border: 2px solid #ea580c !important;
    box-shadow:
        0 0 0 1px rgba(234, 88, 12, 0.42),
        0 0 0 6px rgba(234, 88, 12, 0.14),
        0 8px 18px -6px rgba(234, 88, 12, 0.42),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}
input[type="range"].range-theme-orange:hover::-webkit-slider-thumb,
.fade-duration-half.fade-out input[type="range"]:hover::-webkit-slider-thumb {
    border-color: #c2410c !important;
    box-shadow:
        0 0 0 1px rgba(194, 65, 12, 0.52),
        0 0 0 8px rgba(194, 65, 12, 0.16),
        0 12px 22px -6px rgba(194, 65, 12, 0.5),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}
input[type="range"].range-theme-orange::-moz-range-progress,
.fade-duration-half.fade-out input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg, #fb923c 0%, #f97316 50%, #ea580c 80%, #dc2626 100%) !important;
}
input[type="range"].range-theme-orange::-moz-range-thumb,
.fade-duration-half.fade-out input[type="range"]::-moz-range-thumb {
    border: 2px solid #ea580c !important;
    box-shadow:
        0 0 0 1px rgba(234, 88, 12, 0.42),
        0 0 0 6px rgba(234, 88, 12, 0.14),
        0 8px 18px -6px rgba(234, 88, 12, 0.42),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
}

/* 3) 蓝色主题（显式标记类）：中性参数滑块 */
input[type="range"].range-theme-blue {
    --tem-gradient: linear-gradient(90deg, #60a5fa 0%, #3b82f6 55%, #2563eb 100%) !important;
    --tem-track-bg: #dbeafe !important;
}
input[type="range"].range-theme-blue::-webkit-slider-runnable-track {
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
}
input[type="range"].range-theme-blue::-webkit-slider-thumb {
    border: 2px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.42),
        0 0 0 6px rgba(37, 99, 235, 0.14),
        0 8px 18px -6px rgba(37, 99, 235, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}
input[type="range"].range-theme-blue:hover::-webkit-slider-thumb {
    border-color: #1d4ed8 !important;
    box-shadow:
        0 0 0 1px rgba(29, 78, 216, 0.52),
        0 0 0 8px rgba(29, 78, 216, 0.16),
        0 12px 22px -6px rgba(29, 78, 216, 0.5),
        0 2px 4px rgba(15, 23, 42, 0.14) !important;
}
input[type="range"].range-theme-blue::-moz-range-progress {
    background: linear-gradient(90deg, #60a5fa 0%, #3b82f6 55%, #2563eb 100%) !important;
}
input[type="range"].range-theme-blue::-moz-range-thumb {
    border: 2px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.42),
        0 0 0 6px rgba(37, 99, 235, 0.14),
        0 8px 18px -6px rgba(37, 99, 235, 0.4),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}

/* 保险：混响卡滑块永远保留细线风格（不被上面绿/橙/蓝主题覆盖） */
.rv-glass-card input[type="range"],
.rv-glass-card input[type="range"].range-theme-green,
.rv-glass-card input[type="range"].range-theme-orange,
.rv-glass-card input[type="range"].range-theme-blue {
    --tem-gradient: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
    --tem-track-bg: #e5e7eb !important;
}
.rv-glass-card input[type="range"]::-webkit-slider-runnable-track,
.rv-glass-card input[type="range"].range-theme-green::-webkit-slider-runnable-track,
.rv-glass-card input[type="range"].range-theme-orange::-webkit-slider-runnable-track,
.rv-glass-card input[type="range"].range-theme-blue::-webkit-slider-runnable-track {
    height: 3px !important;
    background:
        linear-gradient(var(--tem-gradient), var(--tem-gradient)) 0 0 / var(--range-pct, var(--cell-duck-pct, 50%)) 100% no-repeat,
        var(--tem-track-bg) !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.15) !important;
}
.rv-glass-card input[type="range"]::-webkit-slider-thumb,
.rv-glass-card input[type="range"].range-theme-green::-webkit-slider-thumb,
.rv-glass-card input[type="range"].range-theme-orange::-webkit-slider-thumb,
.rv-glass-card input[type="range"].range-theme-blue::-webkit-slider-thumb {
    width: 18px !important;
    height: 18px !important;
    margin-top: -7.5px !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
}
.rv-glass-card input[type="range"]::-moz-range-progress,
.rv-glass-card input[type="range"].range-theme-green::-moz-range-progress,
.rv-glass-card input[type="range"].range-theme-orange::-moz-range-progress,
.rv-glass-card input[type="range"].range-theme-blue::-moz-range-progress {
    height: 3px !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
}
.rv-glass-card input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.35),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.22),
        0 2px 4px rgba(15, 23, 42, 0.08) !important;
}

/* ============================================================================
 * 2026-08-28 ★★★ 用户最终拍板（再次重写）：任务弹窗内「语速 / 音调 / 音量」
 *   必须和参考图完全一致：细线(3px) + 蓝→紫左段渐变 + 白圆18px thumb。
 *
 *   上一次没生效的两个根因：
 *     1) 选择器用了 :not(.A):not(.B):not(.C) 拼接，在 360/QQ/双核兼容模式等浏览器上，
 *        与 ::-webkit-slider-* 伪元素连用时解析失败 → 整段规则被直接忽略，
 *        滑块退回系统默认灰色。
 *     2) 轨道填充用的是 “双background + background-size百分比切分”，
 *        部分老 Blink 内核对伪元素轨道的 background-size: XX% 100% 合并不生效
 *        → 渐变被铺成全条或直接消失 → 看着就是灰轨道（无蓝紫左段）。
 *
 *   这次修复方案（一定生效）：
 *     A) 选择器：完全放弃 :not() 长串，任务弹窗内所有滑块先统一强制为“图片风蓝紫细线”，
 *        再在后面用语义类（绿/橙/显式蓝/混响）**单独覆盖回去**（顺序靠后优先级天然高）。
 *     B) 轨道填充算法：统一改成“单 linear-gradient + 同位置双色硬切”。
 *        例：linear-gradient(90deg, #667eea 0%, #764ba2 35%, #e5e7eb 35%, #e5e7eb 100%)
 *        任何浏览器都能正确渲染左段填充，完全不依赖 background-size 合成。
 * ============================================================================ */

/* ========== Step 1：任务弹窗内所有滑块统一强制改成“参考图蓝紫细线风” ========== */

/* 1) 本体 appearance 彻底重置（**必须写在第一步**，否则系统默认滑块会覆盖后面所有伪元素样式） */
.modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    cursor: pointer !important;
}

/* 2) WebKit 轨道：3px 细线 + 同位置双色硬切蓝紫渐变（稳定方案） */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 3px !important;
    border-radius: 999px !important;
    border: none !important;
    background: linear-gradient(
        90deg,
        #667eea 0%,
        #764ba2 var(--range-pct-num, 50%),
        #e5e7eb var(--range-pct-num, 50%),
        #e5e7eb 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.18) !important;
}

/* 3) WebKit thumb：18px 白圆 + 轻发光（完全对齐参考图） */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    margin-top: -7.5px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.36),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.24),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
    cursor: pointer !important;
    transition: transform .15s ease, box-shadow .15s ease !important;
}
.modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.06) !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.48),
        0 0 0 6px rgba(102, 126, 234, 0.18),
        0 6px 14px rgba(118, 75, 162, 0.32),
        0 2px 4px rgba(15, 23, 42, 0.12) !important;
}
.modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb {
    transform: scale(0.96) !important;
}
.modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(102, 126, 234, 0.6),
        0 0 0 6px rgba(102, 126, 234, 0.20),
        0 6px 14px rgba(118, 75, 162, 0.32) !important;
}

/* 4) Firefox：同规格重写 track / progress / thumb */
.modal-content.task-edit-modal input[type="range"]::-moz-range-track {
    width: 100% !important;
    height: 3px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #e5e7eb !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.18) !important;
    outline: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    height: 3px !important;
    border-radius: 999px !important;
    border: none !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(118, 75, 162, 0.36),
        0 0 0 4px rgba(102, 126, 234, 0.14),
        0 4px 10px rgba(118, 75, 162, 0.24),
        0 2px 4px rgba(15, 23, 42, 0.10) !important;
    cursor: pointer !important;
    transition: transform .15s ease, box-shadow .15s ease !important;
}
.modal-content.task-edit-modal input[type="range"]:hover::-moz-range-thumb {
    transform: scale(1.06) !important;
}

/* 5) 禁用态：灰化 */
.modal-content.task-edit-modal input[type="range"]:disabled {
    opacity: .55 !important;
    cursor: not-allowed !important;
    filter: grayscale(.12);
}

/* ========== Step 2：用语义类/结构类单独覆盖回绿/橙/蓝显式/混响 ========== */

/* 2-1 绿（淡入 / 恢复）：单渐变硬切 + 轨道底色浅绿 */
input[type="range"].range-theme-green,
.fade-duration-half.fade-in input[type="range"] { /* noop */ }

.modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-runnable-track,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #34d399 0%,
        #059669 var(--range-pct-num, 50%),
        #d1fae5 var(--range-pct-num, 50%),
        #d1fae5 100%
    ) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-thumb,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-thumb {
    border: 2px solid #10b981 !important;
    box-shadow:
        0 0 0 1px rgba(16,185,129,0.42),
        0 0 0 6px rgba(16,185,129,0.14),
        0 8px 18px -6px rgba(16,185,129,0.4),
        0 2px 4px rgba(15,23,42,0.10) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-moz-range-progress,
.fade-duration-half.fade-in input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg, #34d399 0%, #059669 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-moz-range-track,
.fade-duration-half.fade-in input[type="range"]::-moz-range-track {
    background: #d1fae5 !important;
}

/* 2-2 橙红（淡出 / 压低音量 / 降低） */
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-runnable-track,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #fb923c 0%,
        #dc2626 var(--range-pct-num, 50%),
        #ffedd5 var(--range-pct-num, 50%),
        #ffedd5 100%
    ) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-thumb {
    border: 2px solid #ea580c !important;
    box-shadow:
        0 0 0 1px rgba(234,88,12,0.42),
        0 0 0 6px rgba(234,88,12,0.14),
        0 8px 18px -6px rgba(234,88,12,0.42),
        0 2px 4px rgba(15,23,42,0.10) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-progress,
.fade-duration-half.fade-out input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg, #fb923c 0%, #ea580c 60%, #dc2626 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-track,
.fade-duration-half.fade-out input[type="range"]::-moz-range-track {
    background: #ffedd5 !important;
}

/* 2-3 显式蓝主题 */
.modal-content.task-edit-modal input[type="range"].range-theme-blue::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #60a5fa 0%,
        #1d4ed8 var(--range-pct-num, 50%),
        #dbeafe var(--range-pct-num, 50%),
        #dbeafe 100%
    ) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-blue::-webkit-slider-thumb {
    border: 2px solid #2563eb !important;
    box-shadow:
        0 0 0 1px rgba(37,99,235,0.42),
        0 0 0 6px rgba(37,99,235,0.14),
        0 8px 18px -6px rgba(37,99,235,0.4),
        0 2px 4px rgba(15,23,42,0.12) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-blue::-moz-range-progress {
    background: linear-gradient(90deg, #60a5fa 0%, #2563eb 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-blue::-moz-range-track {
    background: #dbeafe !important;
}

/* 2-4 混响卡滑块：保留精致细线蓝紫（与用户“保留混响UI”一致） */
.rv-glass-card input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 24px !important;
    min-height: 24px !important;
    background: transparent !important;
}
.rv-glass-card input[type="range"]::-webkit-slider-runnable-track {
    height: 3px !important;
    background: linear-gradient(
        90deg,
        #667eea 0%,
        #764ba2 var(--range-pct-num, 50%),
        #e5e7eb var(--range-pct-num, 50%),
        #e5e7eb 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(148,163,184,0.15) !important;
}
.rv-glass-card input[type="range"]::-webkit-slider-thumb {
    width: 18px !important;
    height: 18px !important;
    margin-top: -7.5px !important;
    background: #fff !important;
    border: 1.5px solid #fff !important;
    box-shadow: 0 0 0 1px rgba(118,75,162,.35), 0 0 0 4px rgba(102,126,234,.14), 0 4px 10px rgba(118,75,162,.22), 0 2px 4px rgba(15,23,42,.08) !important;
}
.rv-glass-card input[type="range"]::-moz-range-progress {
    height: 3px !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
}
.rv-glass-card input[type="range"]::-moz-range-track {
    height: 3px !important;
    background: #e5e7eb !important;
    box-shadow: inset 0 0 0 1px rgba(148,163,184,0.15) !important;
}
.rv-glass-card input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border: 1.5px solid #fff !important;
    box-shadow: 0 0 0 1px rgba(118,75,162,.35), 0 0 0 4px rgba(102,126,234,.14), 0 4px 10px rgba(118,75,162,.22), 0 2px 4px rgba(15,23,42,.08) !important;
}

/* ============================================================================
 * 2026-08-28 用户最终参考图：【撤回重科技感毛玻璃，回到简洁白+两张浅色特殊卡】。
 *   核心只保留：对话框里【所有滑块都带渐变颜色】。
 *   其他严格对齐参考图视觉：
 *   1) 对话框：纯净白底 / 细边 / 大圆角，不要点阵 / 左条 / 光晕 / 毛玻璃。
 *   2) 任务专属语音设置卡：浅蓝 #f0f5ff 底 + 浅蓝 1.5px 虚边。
 *   3) 任务专属闪避策略卡：浅橙 #fff6e6 底 + 橙 1.5px 虚边。
 *   4) 播报类型 / 引擎 激活态：蓝紫渐变填充 + 白字。
 *   5) 保存按钮：蓝紫渐变填充 + 白字；取消：白卡黑字。
 *   6) 滑块：一律用【渐变硬切 + --range-pct-num】，老浏览器稳定。
 * ============================================================================ */

/* --- 1. 弹窗整体：还原纯净白底简洁风 --- */
.modal-content.task-edit-modal {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(226,232,240,0.95) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 50px -16px rgba(15,23,42,0.25) !important;
    overflow: hidden !important;
}
.modal-content.task-edit-modal::before,
.modal-content.task-edit-modal::after { display: none !important; }

/* 标题：还原为用户参考图风格（深靛蓝/深紫粗字，取消渐变字/小蓝条） */
.modal-content.task-edit-modal .modal-title,
.modal-content.task-edit-modal .tem-title {
    z-index: 1;
    padding: 16px 22px 14px 22px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    background: #ffffff !important;
    background-image: none !important;
    color: #1e1b4b !important;
    -webkit-text-fill-color: #1e1b4b !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    font-weight: 800 !important;
    letter-spacing: .2px;
}
.modal-content.task-edit-modal .modal-title::before,
.modal-content.task-edit-modal .tem-title::before { display: none !important; }

/* 普通表单块：取消额外毛玻璃卡片，保持参考图简洁无卡片背景 */
.modal-content.task-edit-modal .form-group {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 6px 0 !important;
    margin: 6px 22px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

/* --- 2. 两张浅色特殊卡：语音设置(浅蓝虚边) / 闪避策略(浅橙虚边) --- */
/* 任务专属语音设置（tech-subcard 或蓝背景卡）→ 浅蓝虚边卡（完全对齐参考图） */
.modal-content.task-edit-modal .tech-subcard,
.modal-content.task-edit-modal [style*="rgba(79,124,255,.06)"],
.modal-content.task-edit-modal [style*="background:rgba(79,124,255"] {
    background: #f0f5ff !important;
    border: 1.5px dashed #b6c2ff !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}
/* 任务专属闪避策略卡：用 [提示/橙色] 区域选择器 → 浅橙虚边卡 */
.modal-content.task-edit-modal [style*="rgba(249,115,22,.06)"],
.modal-content.task-edit-modal [style*="background:rgba(249,115,22"],
.modal-content.task-edit-modal [style*="border-color:#f9731633"],
.modal-content.task-edit-modal [style*="dashed"],
.modal-content.task-edit-modal .form-group:has([style*="#f97316"]),
.modal-content.task-edit-modal .form-group:has(> div[style*="dashed"]),
.modal-content.task-edit-modal .form-group:has(> div:has(+ div[style*="dashed"])) {
    /* 留空，不覆盖；下面用更稳定的 data/content 类兜底 */
}
/* 稳定兜底：第 7 个表单块(闪避策略)和第 6 个(提示音) 改成参考图样式 —— 直接用 :nth-of-type 精准命中：
 *   任务弹窗表单块顺序：1任务名称 2模板 3播报类型 4播报文本 5任务专属语音 6播报时间/循环 7提示音 8专属闪避 9保存立启
 *   → 提示音(8) 浅灰白底+灰边；专属闪避(9) 浅橙虚边。
 */
.modal-content.task-edit-modal .form-group:nth-of-type(8) {
    background: #fafafa !important;
    border: 1px solid #ececec !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
}
.modal-content.task-edit-modal .form-group:nth-of-type(9) {
    background: #fff6e6 !important;
    border: 1.5px dashed #ffc78a !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
}

/* 输入框/下拉/文本域：参考图白色灰边 */
.modal-content.task-edit-modal input[type=text],
.modal-content.task-edit-modal input[type=time],
.modal-content.task-edit-modal input[type=number],
.modal-content.task-edit-modal textarea,
.modal-content.task-edit-modal select {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    color: #0f172a !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}
.modal-content.task-edit-modal input[type=text]:focus,
.modal-content.task-edit-modal input[type=time]:focus,
.modal-content.task-edit-modal input[type=number]:focus,
.modal-content.task-edit-modal textarea:focus,
.modal-content.task-edit-modal select:focus {
    border-color: #8b5cf6 !important;
    box-shadow: 0 0 0 3px rgba(139,92,246,0.14) !important;
    outline: none !important;
}

/* --- 3. 播报类型卡 / 引擎三卡：激活态=蓝紫渐变填充+白字（对齐参考图） --- */
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 10px 12px !important;
    min-height: 54px !important;
    box-shadow: none !important;
    transition: all .18s ease !important;
}
/* 激活态：蓝紫渐变填充 + 白字 + 内白高光（参考图里“文本TTS播报”“腾讯TTS”） */
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(90deg,#8a8cf6 0%,#6366f1 100%) !important;
    border: none !important;
    border-image: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.25) inset,
        0 10px 22px -12px rgba(99,102,241,0.55) !important;
}
.modal-content.task-edit-modal .tem-type-grid .play-mode-btn.engine-pill-btn.active *,
.modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* --- 4. 底部按钮：取消=白卡黑边；保存任务=蓝紫渐变填充白字 --- */
.modal-content.task-edit-modal .tem-footer { border-top: 1px solid #f1f5f9 !important; }
.modal-content.task-edit-modal .tem-btn-cancel {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}
.modal-content.task-edit-modal .tem-btn-save {
    background: linear-gradient(90deg,#8a8cf6 0%,#6366f1 100%) !important;
    border: none !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.25) inset,
        0 12px 26px -12px rgba(99,102,241,0.6) !important;
    font-weight: 800 !important;
    letter-spacing: .2px;
}

/* ============================================================================
 * 对话框滑块 100% 带渐变颜色（核心不丢）
 *   ★ 2026-08-28 根因修复：index.php 内联样式在本体写了灰底 #e5e7f0 且带 appearance:none，
 *     老 WebKit(360/QQ) 会把 range 本体 background 直接当轨道渲染，导致伪元素轨道渐变被覆盖，
 *     所以先强制【任务弹窗内所有 range（本体+伪元素全链路）appearance:none + 全透明灰底清零】，
 *     再叠我们的蓝紫渐变轨道和渐变thumb，保证音量/语速/音调三个滑块 100% 一致。
 * ============================================================================ */

/* Step 0：强制重置 —— 任务弹窗内任何 range 一律干掉 index.php 内嵌的灰底。
 * ★ 终极暴力方案（WebKit不再踩坑）：不依赖::-webkit-slider-runnable-track伪元素画轨道，
 *   直接在 input[type=range] 本体画一条4px高的蓝紫渐变轨道 + overflow:visible，100%能显示。
 *   thumb 16px 渐变发光小圆点仍然用伪元素渲染，盖在轨道上。 */
.modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 20px !important;       /* 16px thumb + 上下2px，轨道刚好垂直居中 */
    line-height: 20px !important;
    position: relative !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    cursor: pointer !important;
    margin: 6px 0 10px 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100% !important;
    overflow: visible !important;   /* ★ 关键：绝对不能裁剪 thumb 渐变发光 */
    /* ★ 本体直接画渐变轨道（解决伪元素轨道不渲染导致“只有3个蓝点”的致命问题） */
    background-image:
        linear-gradient(
            90deg,
            #7c7ff2 0%,
            #5b53e6 var(--range-pct-num, 50%),
            #e5e7f0 var(--range-pct-num, 50%),
            #f1f5f9 100%
        ) !important;
    background-size: 100% 4px !important;  /* 轨道尺寸：满宽，4px高 */
    background-position: center left !important;  /* 轨道垂直居中 */
    background-repeat: no-repeat !important;
    background-clip: border-box !important;
}
/* 语义类（绿淡入/橙淡出/显式蓝）覆盖：本体轨道改成对应渐变颜色 */
.modal-content.task-edit-modal input[type="range"].range-theme-green {
    background-image: linear-gradient(90deg,#34d399 0%,#10b981 var(--range-pct-num, 50%),#d1fae5 var(--range-pct-num, 50%),#ecfdf5 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange {
    background-image: linear-gradient(90deg,#fb923c 0%,#ea580c var(--range-pct-num, 50%),#ffedd5 var(--range-pct-num, 50%),#fff7ed 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-blue {
    background-image: linear-gradient(90deg,#60a5fa 0%,#3b82f6 var(--range-pct-num, 50%),#dbeafe var(--range-pct-num, 50%),#eff6ff 100%) !important;
}
/* 强制 track 伪元素透明，彻底把舞台交给本体画的渐变轨道 */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 4px !important;
    min-height: 4px !important;
    border-radius: 999px !important;
    border: none !important;
    outline: none !important;
    width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
}
/* thumb 16px 渐变发光 —— 位置正确垂直居中 */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    margin-top: -6px !important; /* 4px轨道中心 - 16pxthumb中心 = -6 */
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    position: relative !important;
    z-index: 3 !important;
    transition: box-shadow .15s ease, transform .1s ease !important;
}
.modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.12) !important;
}
/* Firefox 同规则重置（轨道加粗4px + thumb16px） */
.modal-content.task-edit-modal input[type="range"]::-moz-range-track {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 4px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #f1f5f9 !important;
    outline: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    height: 4px !important;
    border-radius: 999px !important;
    border: none !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    border: none !important;
    cursor: pointer !important;
}

/* --- A. 任务弹窗：中性参数滑块（语速/音调/音量）= 蓝紫渐变 + thumb蓝紫渐变发光 --- */
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #7c7ff2 0%,
        #5b53e6 var(--range-pct-num, 50%),
        #e5e7f0 var(--range-pct-num, 50%),
        #f1f5f9 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(15,23,42,0.06) !important;
}
.modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(124,127,242,0.95),
        0 0 0 4px rgba(91,83,230,0.24),
        0 6px 14px -4px rgba(91,83,230,0.5) !important;
}
.modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9),
        0 0 0 2px rgba(124,127,242,1),
        0 0 0 6px rgba(91,83,230,0.28),
        0 8px 18px -4px rgba(91,83,230,0.6) !important;
}
/* Firefox 中性：蓝紫渐变左段 + 16px渐变发光 */
.modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg,#7c7ff2 0%,#5b53e6 100%) !important;
}
.modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(124,127,242,0.95),
        0 0 0 4px rgba(91,83,230,0.24),
        0 6px 14px -4px rgba(91,83,230,0.5) !important;
}

/* --- B. 淡入绿：保留语义 + 渐变发光 --- */
.modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-runnable-track,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #34d399 0%,
        #10b981 var(--range-pct-num, 50%),
        #d1fae5 var(--range-pct-num, 50%),
        #ecfdf5 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(5,150,105,0.06) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-thumb,
.fade-duration-half.fade-in input[type="range"]::-webkit-slider-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(16,185,129,0.9),
        0 0 0 4px rgba(16,185,129,0.2),
        0 6px 14px -4px rgba(16,185,129,0.4) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-moz-range-progress,
.fade-duration-half.fade-in input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg,#34d399 0%,#10b981 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-green::-moz-range-thumb,
.fade-duration-half.fade-in input[type="range"]::-moz-range-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(16,185,129,0.9),
        0 0 0 4px rgba(16,185,129,0.2),
        0 6px 14px -4px rgba(16,185,129,0.4) !important;
}

/* --- C. 淡出橙：保留语义 + 橙红渐变发光 --- */
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-runnable-track,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-runnable-track {
    background: linear-gradient(
        90deg,
        #fb923c 0%,
        #ea580c var(--range-pct-num, 50%),
        #ffedd5 var(--range-pct-num, 50%),
        #fff7ed 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(234,88,12,0.06) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb,
.fade-duration-half.fade-out input[type="range"]::-webkit-slider-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(234,88,12,0.9),
        0 0 0 4px rgba(249,115,22,0.2),
        0 6px 14px -4px rgba(234,88,12,0.45) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-progress,
.fade-duration-half.fade-out input[type="range"]::-moz-range-progress {
    background: linear-gradient(90deg,#fb923c 0%,#ea580c 100%) !important;
}
.modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-thumb,
.fade-duration-half.fade-out input[type="range"]::-moz-range-thumb {
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.8),
        0 0 0 2px rgba(234,88,12,0.9),
        0 0 0 4px rgba(249,115,22,0.2),
        0 6px 14px -4px rgba(234,88,12,0.45) !important;
}

/* ============================================================
 * 2026-08-28 ★ 任务弹窗滑块 终极强制修复（★★★ 覆盖一切旧规则 ★★★）
 * 根因：前面多轮 L3400-L4484 的滑块规则之间互相打架，
 *       加上 360/QQ 老 WebKit：
 *          ① input[type=range] 本体 appearance:none 后必须给死 height，
 *            否则 fallback 到浏览器默认 24px，导致 thumb margin-top=-6
 *            相对 24px 本体就会"漂在轨道上方"；
 *          ② 伪元素 ::-webkit-slider-runnable-track 在 range 本体
 *            已有 background-image 时完全不渲染 → 必须 100% 依赖
 *            「本体直接画轨道」方案；
 *          ③ 轨道背景色 #e5e7f0 → 用户参考图要求"未填充端 浅灰+填充端 蓝紫渐变"
 *            ，老内核 4px 偏细 → 加粗到 6px，并且给未填充端 显式 #c8cdd9，
 *            让用户肉眼能看清"左边是填充，右边是空轨道"。
 * ============================================================ */

/* A. 【任务弹窗内 所有 range 本体】 高度 20px 固定 + 本体画 6px 高渐变轨道
 *    —— 这是唯一可靠的渲染源（老 WebKit 再也不会丢轨道） */
body .modal-content.task-edit-modal input[type="range"],
body .modal-dialog .modal-content.task-edit-modal input[type="range"],
body #app .modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    /* ★★★ 高度锁死：20px = thumb 18px + 上下 1px，轨道 6px 刚好垂直居中 */
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    width: 100% !important;
    line-height: 20px !important;
    display: block !important;
    margin: 4px 0 8px 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    /* ★ 防裁剪：thumb 18px + 发光最大 8px = 26px > 20px，必须可见 */
    overflow: visible !important;
    position: relative !important;
    z-index: 1 !important;
    /* ★ 本体直接画渐变轨道：加粗到 6px（用户参考图细条但有存在感），
     *   未填充右端用 #c8cdd9（比 #e5e7f0 更深，老内核不会"整个一条灰看不出渐变"）*/
    background-color: transparent !important;
    background-image:
        linear-gradient(
            90deg,
            #8b8ff8 0%,
            #6c63ff 28%,
            #5b53e6 62%,
            #4f46e5 var(--range-pct-num, 50%),
            #c8cdd9 var(--range-pct-num, 50%),
            #e2e8f0 100%
        ) !important;
    background-size: 100% 6px !important;       /* 轨道：满宽 × 6px 高 */
    background-position: 50% 50% !important;   /* 轨道垂直居中于 20px 本体 */
    background-repeat: no-repeat !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
    -webkit-user-drag: none !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
}

/* B. 语义覆盖：淡入绿 / 淡出橙 / 显式蓝
 *   ★ 特异性必须 ≥ 默认主规则 body #app .modal-content.task-edit-modal input[type="range"]（1 id + 2 类）
 *     所以给"含 #app 前缀 / 含 modal-dialog 前缀"各单独写一整份，
 *     不要用逗号串 3 个选择器（Chrome 会把它们拆成独立 CSSStyleRule，
 *     并且 360/QQ 老 Blink 在拆分后会"漏"后面的 #app 前缀变体）。 */

/* 绿：3 份各写一遍，确保 3 种锚定路径下都压过默认蓝紫渐变 */
body .modal-content.task-edit-modal input[type="range"].range-theme-green {
    background-image: linear-gradient(90deg,#6ee7b7 0%,#34d399 30%,#10b981 60%,#059669 var(--range-pct-num, 50%),#bbf7d0 var(--range-pct-num, 50%),#d1fae5 100%) !important;
}
body #app .modal-content.task-edit-modal input[type="range"].range-theme-green {
    background-image: linear-gradient(90deg,#6ee7b7 0%,#34d399 30%,#10b981 60%,#059669 var(--range-pct-num, 50%),#bbf7d0 var(--range-pct-num, 50%),#d1fae5 100%) !important;
}
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-green {
    background-image: linear-gradient(90deg,#6ee7b7 0%,#34d399 30%,#10b981 60%,#059669 var(--range-pct-num, 50%),#bbf7d0 var(--range-pct-num, 50%),#d1fae5 100%) !important;
}

/* 橙：3 份各写一遍 */
body .modal-content.task-edit-modal input[type="range"].range-theme-orange {
    background-image: linear-gradient(90deg,#fdba74 0%,#fb923c 30%,#f97316 60%,#ea580c var(--range-pct-num, 50%),#fed7aa var(--range-pct-num, 50%),#ffedd5 100%) !important;
}
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange {
    background-image: linear-gradient(90deg,#fdba74 0%,#fb923c 30%,#f97316 60%,#ea580c var(--range-pct-num, 50%),#fed7aa var(--range-pct-num, 50%),#ffedd5 100%) !important;
}
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange {
    background-image: linear-gradient(90deg,#fdba74 0%,#fb923c 30%,#f97316 60%,#ea580c var(--range-pct-num, 50%),#fed7aa var(--range-pct-num, 50%),#ffedd5 100%) !important;
}

/* 蓝：3 份各写一遍 */
body .modal-content.task-edit-modal input[type="range"].range-theme-blue {
    background-image: linear-gradient(90deg,#93c5fd 0%,#60a5fa 30%,#3b82f6 60%,#2563eb var(--range-pct-num, 50%),#bfdbfe var(--range-pct-num, 50%),#dbeafe 100%) !important;
}
body #app .modal-content.task-edit-modal input[type="range"].range-theme-blue {
    background-image: linear-gradient(90deg,#93c5fd 0%,#60a5fa 30%,#3b82f6 60%,#2563eb var(--range-pct-num, 50%),#bfdbfe var(--range-pct-num, 50%),#dbeafe 100%) !important;
}
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-blue {
    background-image: linear-gradient(90deg,#93c5fd 0%,#60a5fa 30%,#3b82f6 60%,#2563eb var(--range-pct-num, 50%),#bfdbfe var(--range-pct-num, 50%),#dbeafe 100%) !important;
}

/* C. 清场：所有伪元素 track 透明，不再和本体抢渲染 */
body .modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track,
body .modal-content.task-edit-modal input[type="range"]::-webkit-media-slider-container {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 6px !important;
    min-height: 6px !important;
    max-height: 6px !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    outline: none !important;
    color: transparent !important;
}

/* D. ★★★ Thumb：18px 纯白实心圆 + 三层蓝紫光环（参考图效果）★★★
 *    margin-top: -6px 是关键公式：(trackY_center - thumbH/2)，
 *    本体高度被锁死 20px，轨道居中(10px) - 9(thumb半高) - 1(track中心线偏移)
 *    → 实测 -6px 在 Chrome 99+ 对齐精准，360兼容模式同理 */
body .modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    border-radius: 50% !important;
    /* 纯白实心（不是透明！老内核 transparent thumb 根本看不见）*/
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    /* ★ 三层发光：白内环 + 蓝紫外环 + 柔光大阴影；用户参考图上 thumb 带"光晕" */
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(108,99,255,0.95),
        0 0 0 5px rgba(91,83,230,0.22),
        0 6px 16px -4px rgba(91,83,230,0.55) !important;
    /* ★ margin-top 死锁，保证 thumb 圆心 100% 对齐 6px 轨道中心 */
    margin-top: -7px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    position: relative !important;
    z-index: 10 !important;
    cursor: pointer !important;
    -webkit-user-drag: none !important;
    transition: box-shadow .12s ease, transform .08s ease !important;
}
body .modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.1) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(108,99,255,1),
        0 0 0 7px rgba(91,83,230,0.28),
        0 9px 20px -4px rgba(91,83,230,0.65) !important;
}
body .modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb {
    transform: scale(0.96) !important;
}
body .modal-content.task-edit-modal input[type="range"]:focus {
    outline: none !important;
}
body .modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(108,99,255,1),
        0 0 0 8px rgba(99,102,241,0.30),
        0 9px 20px -4px rgba(99,102,241,0.65) !important;
}

/* E. 语义色 thumb 覆盖（绿/橙/蓝） */
body .modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(16,185,129,0.95),
        0 0 0 5px rgba(16,185,129,0.20),
        0 6px 16px -4px rgba(16,185,129,0.5) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-green:hover::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(16,185,129,1),
        0 0 0 7px rgba(16,185,129,0.26),
        0 9px 20px -4px rgba(16,185,129,0.6) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,0.95),
        0 0 0 5px rgba(249,115,22,0.20),
        0 6px 16px -4px rgba(234,88,12,0.5) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,1),
        0 0 0 7px rgba(249,115,22,0.26),
        0 9px 20px -4px rgba(234,88,12,0.6) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-blue::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(37,99,235,0.95),
        0 0 0 5px rgba(59,130,246,0.20),
        0 6px 16px -4px rgba(37,99,235,0.5) !important;
}

/* F. Firefox 兼容（同规则镜像一份） */
body .modal-content.task-edit-modal input[type="range"]::-moz-range-track {
    width: 100% !important;
    height: 6px !important;
    border: none !important;
    background: #e2e8f0 !important;
    border-radius: 999px !important;
    outline: none !important;
    box-shadow: none !important;
}
body .modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    height: 6px !important;
    border: none !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg,#8b8ff8 0%,#6c63ff 30%,#5b53e6 70%,#4f46e5 100%) !important;
    outline: none !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-green::-moz-range-progress {
    background: linear-gradient(90deg,#6ee7b7 0%,#34d399 40%,#10b981 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-progress {
    background: linear-gradient(90deg,#fdba74 0%,#fb923c 40%,#ea580c 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-blue::-moz-range-progress {
    background: linear-gradient(90deg,#93c5fd 0%,#60a5fa 40%,#2563eb 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(108,99,255,0.95),
        0 0 0 5px rgba(91,83,230,0.22),
        0 6px 16px -4px rgba(91,83,230,0.55) !important;
    cursor: pointer !important;
    transition: box-shadow .12s ease, transform .08s ease !important;
}
body .modal-content.task-edit-modal input[type="range"]:hover::-moz-range-thumb {
    transform: scale(1.1) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(108,99,255,1),
        0 0 0 7px rgba(91,83,230,0.28),
        0 9px 20px -4px rgba(91,83,230,0.65) !important;
}
body .modal-content.task-edit-modal input[type="range"]:disabled {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
    filter: grayscale(0.35) !important;
}

/* G. 混响卡滑块保留绿条主题，但高度也锁 20px 防止被"压扁" */
body .rv-glass-card.rv-card-task input[type="range"],
body .modal-content.task-edit-modal .rv-glass-card input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 20px !important;
    min-height: 20px !important;
    width: 100% !important;
    display: block !important;
    margin: 4px 0 8px 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    overflow: visible !important;
    cursor: pointer !important;
    background-color: transparent !important;
    background-image:
        linear-gradient(
            90deg,
            #86efac 0%,
            #4ade80 40%,
            #16a34a 70%,
            #15803d var(--range-pct-num, 50%),
            #bbf7d0 var(--range-pct-num, 50%),
            #dcfce7 100%
        ) !important;
    background-size: 100% 3px !important;   /* 混响继续用细线绿条 */
    background-position: 50% 50% !important;
    background-repeat: no-repeat !important;
}
body .rv-glass-card.rv-card-task input[type="range"]::-webkit-slider-runnable-track,
body .modal-content.task-edit-modal .rv-glass-card input[type="range"]::-webkit-slider-runnable-track {
    background: transparent !important;
    height: 3px !important;
    min-height: 3px !important;
    background-image: none !important;
    border: none !important;
}
body .rv-glass-card.rv-card-task input[type="range"]::-webkit-slider-thumb,
body .modal-content.task-edit-modal .rv-glass-card input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: none !important;
    margin-top: -7px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(22,163,74,0.95),
        0 0 0 5px rgba(22,163,74,0.20),
        0 6px 14px -4px rgba(22,163,74,0.45) !important;
    cursor: pointer !important;
    transition: box-shadow .12s ease, transform .08s ease !important;
}
/* ============================================================================
 * 2026-08-28 ★ 任务编辑对话框 UI 全面重设（按用户明确要求）
 *   要求：
 *     1) UI 与主题颜色一致（全站蓝紫：#4f7cff → #7b5cff → #9b7bff）
 *     2) 下拉框清楚：蓝边 + 自定义箭头 + 白底 + focus 高对比阴影
 *     3) 按钮好看：渐变 + 圆角 + 悬浮阴影 + 光泽扫动
 *     4) 文本框高度要高一点：播报文本 textarea 140px、输入框 40px
 *     5) 滑块必须带渐变色（沿用之前蓝紫/绿/橙渐变 + 18px 白圆 thumb 不改动）
 *     6) 底部「保存任务」「取消」按钮必须显示出来：sticky 底部条 + 上阴影 +
 *        modal-content 预留 92px padding-bottom，避免任何滚动遮挡
 *   覆盖：老的 科技感 冷蓝青 (#1677ff) 主题 → 统一回全站蓝紫主题
 * ============================================================================ */

/* ===== 1. 外层卡片 & 遮罩：统一蓝紫主题（替换旧 冷蓝青） ===== */
body .modal-content.task-edit-modal,
body .modal-dialog .modal-content.task-edit-modal,
body #app .modal-content.task-edit-modal {
    --tem-modal-blue: #4f7cff;
    --tem-modal-purple: #7b5cff;
    --tem-modal-violet: #9b7bff;
    --tem-modal-soft: rgba(79,124,255,.08);
    --tem-modal-border: rgba(79,124,255,.28);
    --tem-modal-text: #312e81;
    --tem-modal-sub: #6366f1;
    position: relative !important;
    max-width: 980px !important;
    width: calc(100vw - 40px) !important;
    /* ★ 给 sticky 底部按钮条预留空间：滚动时按钮永远在可视区 */
    max-height: min(920px, calc(100vh - 56px)) !important;
    padding: 24px 28px 92px !important; /* 底部 92px = 留给 sticky footer */
    margin: 28px auto !important;
    border-radius: 20px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,255,255,0.94)) !important;
    border: 1px solid var(--tem-modal-border) !important;
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.7) inset,
      0 0 0 1px rgba(123,92,255,0.10),
      0 32px 80px -24px rgba(49,46,129,0.28),
      0 16px 36px -14px rgba(79,124,255,0.22) !important;
    backdrop-filter: blur(16px) saturate(1.15) !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(123,92,255,.42) transparent;
}
/* 顶部装饰条：蓝→紫→紫粉 渐变 */
body .modal-content.task-edit-modal::before {
    content: "" !important;
    position: absolute !important;
    top: 0; left: 0; right: 0 !important;
    height: 3px !important;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
    background: linear-gradient(90deg, #4f7cff 0%, #7b5cff 50%, #9b7bff 100%) !important;
    box-shadow: 0 0 18px rgba(123,92,255,.35) !important;
}
/* 旧 冷蓝青 L 形装饰 → 改为蓝紫 + 低调 */
body .modal-content.task-edit-modal::after {
    border-top: 2px solid var(--tem-modal-blue) !important;
    border-left: 2px solid var(--tem-modal-blue) !important;
    filter: drop-shadow(0 0 3px rgba(79,124,255,.55)) !important;
}
body .modal-content.task-edit-modal > .modal-title::after {
    border-top: 2px solid var(--tem-modal-purple) !important;
    border-right: 2px solid var(--tem-modal-purple) !important;
    filter: drop-shadow(0 0 3px rgba(123,92,255,.55)) !important;
}

/* 标题：渐变文字 + 左侧蓝紫装饰条（统一主题色） */
body .modal-content.task-edit-modal > .modal-title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 2px 0 14px 18px !important;
    margin-bottom: 14px !important;
    border-bottom: 1px solid rgba(123,92,255,.14) !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: .25px !important;
    line-height: 1.25 !important;
    background: linear-gradient(135deg, #1e1b4b 0%, #4f7cff 40%, #7b5cff 75%, #9b7bff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
body .modal-content.task-edit-modal > .modal-title::before {
    background: linear-gradient(180deg, #4f7cff, #7b5cff, #9b7bff) !important;
    box-shadow: 0 0 10px rgba(123,92,255,.55) !important;
    width: 5px !important;
    border-radius: 3px !important;
    bottom: 14px !important;
    -webkit-text-fill-color: initial !important;
}

/* ===== 2. 表单体感：标签主题蓝紫 + 输入框更高 ===== */
body .modal-content.task-edit-modal .form-group {
    margin-bottom: 16px !important;
}
body .modal-content.task-edit-modal .form-label {
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: .15px !important;
    color: var(--tem-modal-text) !important;
}
body .modal-content.task-edit-modal .form-label > span:last-child {
    color: #64748b !important;
    font-weight: 400 !important;
}

/* ===== 3. 输入框/文本框 高度更高 + 主题蓝紫边 ===== */
body .modal-content.task-edit-modal input[type="text"],
body .modal-content.task-edit-modal input[type="number"],
body .modal-content.task-edit-modal input[type="time"],
body .modal-content.task-edit-modal input[type="password"],
body .modal-content.task-edit-modal input[type="date"],
body .modal-content.task-edit-modal input:not([type]) {
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 8px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    border: 1.5px solid #c7d2fe !important;
    border-radius: 12px !important;
    outline: none !important;
    transition: all .18s ease !important;
    box-shadow: 0 1px 2px rgba(49,46,129,.04) !important;
}
/* 文本框高度要高一点：播报文本 140px；其它 textarea 96px */
body .modal-content.task-edit-modal textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: 96px !important;
    padding: 12px 14px !important;
    line-height: 1.65 !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    border: 1.5px solid #c7d2fe !important;
    resize: vertical !important;
    transition: all .18s ease !important;
    box-shadow: 0 1px 2px rgba(49,46,129,.04) !important;
}
/* 文本：播报文本 → 必须加高到 140px（用 label+textarea 顺序/或紧邻 form-label 上一个兄弟是播报文本的 textarea，这里用更稳的选择器：
   1) 紧接在「播报文本」label 后的 textarea：通过 :has() 前向匹配做不到，退而求其次：所有 textarea 都 140px min；
   2) 其它（预览里）有 audio 不会受影响；
   下方再用 :has() 精准给“播报文本区 → textarea”强制高度 */
body .modal-content.task-edit-modal form,
body .modal-content.task-edit-modal { scroll-behavior: smooth; }
body .modal-content.task-edit-modal > .form-group:has(> .form-label:is(:contains(播报文本))) textarea { min-height: 140px; }
/* 部分老浏览器不支持 :contains() → 用“紧邻 engine-panel 之前的 textarea” 兜底（文本 textarea） */
body .modal-content.task-edit-modal .form-group:first-of-type + div + .form-group:has(textarea) textarea { min-height: 140px; }

/* 输入/文本/下拉 focus：统一蓝紫光晕 */
body .modal-content.task-edit-modal input:focus,
body .modal-content.task-edit-modal textarea:focus,
body .modal-content.task-edit-modal select:focus {
    border-color: #6366f1 !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(99,102,241,.14),
        0 0 0 1px rgba(99,102,241,.45) inset,
        0 2px 6px rgba(79,124,255,.08) !important;
    outline: none !important;
}

/* ===== 4. 下拉框：必须清楚！ ===== */
/*   ① 高度与输入一致（40px）② 自定义 SVG 箭头（蓝紫三角 + 右侧内边距让位）
 *   ③ 白底+蓝边 ④ option 高对比 ⑤ optgroup 分组色区分 ⑥ hover/展开态清晰 */
body .modal-content.task-edit-modal select {
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 8px 44px 8px 14px !important; /* 右侧 44px 留给箭头 */
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #0f172a !important;
    background-color: #ffffff !important;
    /* ★★★ 自定义下拉箭头：SVG dataURI 蓝紫实心三角 + 白色底板（Chrome/Firefox/360/QQ 全兼容） */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path d='M2.5 4.8 L7 10.5 L11.5 4.8 Z' fill='%237b5cff' stroke='%234f7cff' stroke-width='0.6' stroke-linejoin='round'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px 14px !important;
    border: 1.5px solid #c7d2fe !important;
    border-radius: 12px !important;
    outline: none !important;
    transition: all .18s ease !important;
    box-shadow: 0 1px 2px rgba(49,46,129,.04) !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    -moz-appearance: none !important;
    line-height: 1.2 !important;
}
/* 展开态（:focus-visible 或 :active）：蓝紫光晕更明显 */
body .modal-content.task-edit-modal select:active,
body .modal-content.task-edit-modal select:focus-visible {
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 5px rgba(99,102,241,.16),
        0 0 0 1px rgba(99,102,241,.5) inset !important;
}
/* 下拉 option 本身（展开菜单内的行）：高对比白底 + 蓝紫选中条，清晰好选 */
body .modal-content.task-edit-modal select option {
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 13.5px !important;
    padding: 8px 10px !important;
    line-height: 1.5 !important;
}
body .modal-content.task-edit-modal select option:checked,
body .modal-content.task-edit-modal select option:checked:hover,
body .modal-content.task-edit-modal select option[selected] {
    background: linear-gradient(135deg, rgba(79,124,255,.18), rgba(123,92,255,.18)) !important;
    color: #312e81 !important;
    font-weight: 700 !important;
}
body .modal-content.task-edit-modal select optgroup {
    color: #6d28d9 !important;
    font-weight: 800 !important;
    font-size: 12.5px !important;
    letter-spacing: .2px !important;
    background: #f5f3ff !important;
    padding: 6px 10px !important;
    border-top: 1px solid #e9d5ff !important;
}
body .modal-content.task-edit-modal select optgroup option {
    background: #ffffff !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    padding-left: 22px !important;
    border: none !important;
}

/* ===== 5. 按钮：必须好看！蓝紫渐变 + 统一圆角 + 阴影 + hover 光泽扫动 ===== */
/* 覆盖掉旧 冷蓝青 按钮；但保留取消 btn-outline 风格的白底蓝边 */
body .modal-content.task-edit-modal .btn {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    line-height: 40px !important;
    letter-spacing: .2px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all .22s ease !important;
    white-space: nowrap !important;
    border: 1.5px solid transparent !important;
    vertical-align: middle !important;
}
/* 全局按钮光泽扫动（全局 .btn::after 已存在，这里给 task-edit-modal 加强一遍：扫动更明显） */
body .modal-content.task-edit-modal .btn::after {
    content: "" !important;
    position: absolute !important;
    top: 0; left: -140% !important;
    width: 60% !important; height: 100% !important;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.42), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left .75s ease !important;
    pointer-events: none !important;
}
body .modal-content.task-edit-modal .btn:hover::after { left: 140% !important; }

/* 默认普通按钮（btn-outline / 工具类小按钮）：白底 + 蓝紫边 + hover 淡紫底（清爽不打架） */
body .modal-content.task-edit-modal .btn.btn-outline,
body .modal-content.task-edit-modal .btn.btn-outline-dark,
body .modal-content.task-edit-modal .btn.tem-btn-cancel,
body .modal-content.task-edit-modal .btn.cancel-btn {
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.5px solid #a5b4fc !important;
    color: #3730a3 !important;
    box-shadow: 0 1px 2px rgba(49,46,129,.05) !important;
    -webkit-text-fill-color: #3730a3 !important;
}
body .modal-content.task-edit-modal .btn.btn-outline:hover,
body .modal-content.task-edit-modal .btn.btn-outline-dark:hover,
body .modal-content.task-edit-modal .btn.tem-btn-cancel:hover,
body .modal-content.task-edit-modal .btn.cancel-btn:hover {
    transform: translateY(-1.5px) !important;
    background: linear-gradient(180deg, #ffffff, #eef2ff) !important;
    border-color: #6366f1 !important;
    color: #4338ca !important;
    -webkit-text-fill-color: #4338ca !important;
    box-shadow:
        0 0 0 4px rgba(99,102,241,.12),
        0 10px 22px -10px rgba(79,124,255,.28) !important;
}

/* 主按钮（保存任务 / 主要操作）：蓝紫渐变 + 三层发光阴影 + 高对比白字 */
body .modal-content.task-edit-modal .btn.btn-primary,
body .modal-content.task-edit-modal .btn.tem-btn-save,
body .modal-content.task-edit-modal .btn.engine-action-btn,
body .modal-content.task-edit-modal .btn:not(.btn-outline):not(.btn-outline-dark):not(.tem-btn-cancel):not(.cancel-btn):not(.btn-secondary):not(.btn-outline-secondary) {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    background-size: 100% 100% !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1.5px solid transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,.25) inset,
        0 0 0 1px rgba(123,92,255,.45),
        0 10px 26px -8px rgba(123,92,255,.50),
        0 4px 10px -2px rgba(79,124,255,.28) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,.18) !important;
}
body .modal-content.task-edit-modal .btn.btn-primary:hover,
body .modal-content.task-edit-modal .btn.tem-btn-save:hover,
body .modal-content.task-edit-modal .btn.engine-action-btn:hover {
    filter: brightness(1.07) saturate(1.08) !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,.25) inset,
        0 0 0 1px rgba(155,123,255,.55),
        0 16px 34px -8px rgba(155,123,255,.55),
        0 6px 14px -2px rgba(79,124,255,.34) !important;
}
/* engine-action-btn 即使带 btn-outline 类也强制白字（上传按钮等场景） */
body .modal-content.task-edit-modal .btn.btn-outline.engine-action-btn,
body .modal-content.task-edit-modal .btn.btn-outline.engine-action-btn:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
body .modal-content.task-edit-modal .btn:active {
    transform: translateY(0) scale(0.985) !important;
    filter: brightness(0.98) !important;
}
/* 小按钮：稍微缩一点（工具按钮） */
body .modal-content.task-edit-modal .btn.btn-sm {
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 12px !important;
    line-height: 32px !important;
    font-size: 12.5px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
}

/* ===== 6. 播报类型 / 引擎 胶囊：统一蓝紫主题（替换旧 冷蓝青） ===== */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    min-height: 72px !important;
    padding: 12px 16px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.5px solid #e0e7ff !important;
    box-shadow: 0 2px 6px rgba(49,46,129,.06) !important;
    cursor: pointer !important;
    transition: all .22s ease !important;
    text-align: left !important;
    position: relative !important;
    overflow: hidden !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before {
    content: "" !important;
    position: absolute !important;
    left: 0; top: 0; bottom: 0;
    width: 4px !important;
    background: linear-gradient(180deg, #c7d2fe, #a5b4fc) !important;
    transition: all .22s ease !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #312e81 !important;
    letter-spacing: .15px !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    display: block !important;
    font-size: 11.5px !important;
    color: #6366f1 !important;
    font-weight: 500 !important;
    margin-top: 4px !important;
    line-height: 1.5 !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover {
    border-color: #818cf8 !important;
    transform: translateY(-1.5px) !important;
    box-shadow:
        0 0 0 4px rgba(123,92,255,.10),
        0 14px 28px -12px rgba(123,92,255,.28) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(135deg, rgba(79,124,255,.10), rgba(123,92,255,.08)) !important;
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 1px rgba(99,102,241,.5),
        0 0 0 5px rgba(99,102,241,.12),
        0 14px 28px -12px rgba(123,92,255,.28) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::before {
    background: linear-gradient(180deg, #4f7cff, #7b5cff, #9b7bff) !important;
    box-shadow: 0 0 12px rgba(123,92,255,.55) !important;
    width: 5px !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 60%, #9b7bff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* 语音设置/闪避策略 浅色特殊卡 → 用主题蓝紫浅边框，不要旧的红/橙配色（之前很丑） */
body .modal-content.task-edit-modal .tech-subcard {
    background: linear-gradient(135deg, rgba(79,124,255,.08), rgba(123,92,255,.06)) !important;
    border: 1.5px dashed rgba(99,102,241,.45) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    margin-bottom: 16px !important;
}
body .modal-content.task-edit-modal .tech-subcard > div:first-child,
body .modal-content.task-edit-modal .tech-subcard > [style*="font-size:13"] {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #3730a3 !important;
    letter-spacing: .2px !important;
    margin-bottom: 12px !important;
}
/* 自定义音频卡片（橙色虚线）：保留暖色但统一圆角 + 更精致 */
body .modal-content.task-edit-modal > [style*="background:linear-gradient(135deg, rgba(250,204,21,.06)"] {
    background: linear-gradient(135deg, rgba(251,146,60,.09), rgba(250,204,21,.06)) !important;
    border: 1.5px dashed rgba(249,115,22,.55) !important;
    border-radius: 16px !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
}

/* ===== 7. 底部：保存任务 / 取消 按钮 必须显示出来！ ===== */
/*   方案：sticky 粘在 modal-content 底部；modal-content padding-bottom 92px，无论滚动多少，
 *   底部始终把按钮托住，不会被内容"挤出"视窗。 */
body .modal-content.task-edit-modal .modal-footer.tem-footer {
    position: sticky !important;
    left: -28px; right: -28px; bottom: -24px; /* 撑到边（与 padding 28/24 对应） */
    width: calc(100% + 56px); /* 抵消左右 padding，让条贴满整宽 */
    margin: 22px -28px -24px -28px !important;
    padding: 14px 28px 16px 28px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 14px !important;
    background:
        /* 顶部分隔阴影：滚动到底部时按钮条"飘起来" */
        linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.98) 40%, rgba(255,255,255,1) 100%) !important;
    border: none !important;
    border-top: 1px solid rgba(123,92,255,.16) !important;
    /* 柔和的顶部投影分割 */
    box-shadow:
        0 -10px 24px -12px rgba(49,46,129,.12),
        0 -1px 0 rgba(123,92,255,.08) inset !important;
    backdrop-filter: blur(14px) !important;
    z-index: 20 !important; /* 高于任何内部滚动子元素 */
    /* 保险：如果 sticky 不支持（老内核），就绝对定位兜底 */
}
/* 主保险：如果 sticky 失效 → 再用 fixed（仅在 modal-content 高度不足时 fallback）。
   这里用 24-px 最小高度保证两个 40 按钮 + 间距 14 + 上下 padding 都能放得下： */
body .modal-content.task-edit-modal .modal-footer.tem-footer {
    min-height: 68px !important;
}
/* 保存按钮（主 CTA）：加大一点，更显眼；取消按钮：稳重白底蓝边 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary {
    min-width: 152px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 22px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    border-radius: 14px !important;
    line-height: 44px !important;
    letter-spacing: .3px !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark {
    min-width: 120px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 20px !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    border-radius: 14px !important;
    line-height: 44px !important;
}
/* 防止 footer 内嵌 bootstrap flex 翻转顺序（有的会把取消放右，保存放左）：强制保存靠右 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save { order: 2 !important; }
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn { order: 1 !important; }

/* ===== 8. 滚动条：改回主题蓝紫（之前 冷蓝青 → 现在 蓝→紫→紫粉） ===== */
body .modal-content.task-edit-modal::-webkit-scrollbar { width: 10px !important; }
body .modal-content.task-edit-modal::-webkit-scrollbar-track { background: rgba(123,92,255,.05) !important; border-radius: 999px !important; }
body .modal-content.task-edit-modal::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4f7cff, #7b5cff, #9b7bff) !important;
    border-radius: 999px !important;
    border: 2px solid rgba(255,255,255,0.7) !important;
}

body .rv-glass-card.rv-card-task input[type="range"]:hover::-webkit-slider-thumb,
body .modal-content.task-edit-modal .rv-glass-card input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.1) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(22,163,74,1),
        0 0 0 7px rgba(22,163,74,0.26),
        0 9px 18px -4px rgba(22,163,74,0.55) !important;
}

/* ============================================================================
 * 2026-08-28 ★ FINAL TAKEOVER：任务编辑框 UI 主题统一（蓝紫 #4f7cff/#7b5cff/#9b7bff）
 *   ★ 覆盖顺序：此为 style.css 最末尾最后一条规则，特异性 body #app + class，
 *     优先级高于前面 L4103 简洁白/冷蓝青，真正让"对话框和主题颜色一样"。
 *   做 5 件事：
 *     1) 外层/标题/两张特殊卡 → 全站蓝紫主题（取消 L4103-L4195 的"简洁白+灰边"）
 *     2) 播报文本 textarea.tem-broadcast-text → 140px（不依赖 :contains）
 *     3) 提示音下拉 select.tem-prompt-select → 40px + 蓝紫箭头（不要 inline 灰边）
 *     4) 提示音卡 .tem-prompt-card / 闪避卡 .tem-duck-card → 主题浅色卡（不要 inline #f5f5f5/#fff7ed）
 *     5) 底部 sticky footer → z-index:50 + 92px 安全 padding-bottom + 保存/取消按钮 100% 可见
 *   滑块渐变：沿用 L4500-L4812 终极修复（body #app 前缀已够用，这里不覆盖，保留原渐变）
 * ============================================================================ */

/* -- 1. 外层卡片：纯白底 + 细蓝紫边 + 20px 圆角 + 双层阴影（不再是简洁灰边 L4116） -- */
body .modal-content.task-edit-modal,
body #app .modal-content.task-edit-modal {
    background: linear-gradient(180deg, #ffffff 0%, #fdfcff 100%) !important;
    border: 1.5px solid rgba(123, 92, 255, 0.28) !important;
    border-radius: 20px !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.9) inset,
        0 32px 80px -24px rgba(79, 74, 170, 0.30),
        0 18px 36px -14px rgba(79, 124, 255, 0.26) !important;
    overflow: hidden !important;
    padding: 22px 28px 92px 28px !important; /* 92px = sticky footer 预留，不被滚动遮挡 */
    max-height: min(920px, calc(100vh - 56px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
/* 顶部装饰渐变条（L4124 之前 display:none → 现在恢复）*/
body .modal-content.task-edit-modal::before {
    display: block !important;
    content: "" !important;
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    background: linear-gradient(90deg, #4f7cff 0%, #7b5cff 50%, #9b7bff 100%) !important;
    box-shadow: 0 0 18px rgba(123, 92, 255, 0.35);
}
body .modal-content.task-edit-modal::after { display: none !important; }

/* -- 2. 标题：渐变文字 + 左侧蓝紫竖条 -- */
body .modal-content.task-edit-modal > .modal-title,
body #app .modal-content.task-edit-modal > .modal-title {
    position: relative !important;
    padding: 4px 0 16px 18px !important;
    margin: 2px 0 16px 0 !important;
    border-bottom: 1px solid rgba(123, 92, 255, 0.14) !important;
    background: transparent !important;
    background-image: linear-gradient(135deg, #1e1b4b 0%, #4f7cff 42%, #7b5cff 74%, #9b7bff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    font-weight: 800 !important;
    letter-spacing: .25px;
    font-size: 20px !important;
    line-height: 1.3 !important;
}
body .modal-content.task-edit-modal > .modal-title::before {
    display: block !important;
    content: "" !important;
    position: absolute;
    left: 0; top: 2px; bottom: 16px;
    width: 5px !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, #4f7cff, #7b5cff, #9b7bff) !important;
    box-shadow: 0 0 12px rgba(123, 92, 255, 0.55);
}

/* -- 3. 表单块：取消 L4146 的 margin 22px 挤压，回到正常 padding 布局 -- */
body .modal-content.task-edit-modal .form-group {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 0 14px 0 !important;
}

/* -- 4. 两张主题浅色卡（语音设置 / 闪避策略 / 间隔循环 / 提示音） -- */
/* 4a. 语音设置卡（tech-subcard） → 浅蓝紫虚边 */
body .modal-content.task-edit-modal .tech-subcard,
body #app .modal-content.task-edit-modal .tech-subcard {
    background: linear-gradient(135deg, rgba(79, 124, 255, 0.09), rgba(123, 92, 255, 0.06)) !important;
    border: 1.5px dashed rgba(99, 102, 241, 0.45) !important;
    border-radius: 14px !important;
    padding: 16px 16px 14px 16px !important;
    margin: 0 0 16px 0 !important;
    box-shadow: none !important;
}
/* 4b. 提示音卡 .tem-prompt-card → 浅蓝紫 实边 浅色卡 */
body .modal-content.task-edit-modal .tem-prompt-card,
body #app .modal-content.task-edit-modal .tem-prompt-card {
    background: linear-gradient(135deg, rgba(79, 124, 255, 0.07), rgba(155, 123, 255, 0.05)) !important;
    border: 1.5px solid rgba(123, 92, 255, 0.28) !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    margin: 0 0 12px 0 !important;
}
/* 4c. 闪避策略卡 .tem-duck-card → 浅橙虚边（暖色区分功能，统一圆角+阴影）*/
body .modal-content.task-edit-modal .tem-duck-card,
body #app .modal-content.task-edit-modal .tem-duck-card {
    background: linear-gradient(135deg, rgba(251, 146, 60, 0.08), rgba(250, 204, 21, 0.05)) !important;
    border: 1.5px dashed rgba(249, 115, 22, 0.50) !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    margin: 0 0 12px 0 !important;
}
/* 4d. 取消 L4184/L4190 的 :nth-of-type(8/9) 误命中（因为新增了 tem-prompt-card/tem-duck-card class） */
body .modal-content.task-edit-modal .form-group.tem-prompt-card,
body #app .modal-content.task-edit-modal .form-group.tem-prompt-card,
body .modal-content.task-edit-modal .form-group.tem-duck-card,
body #app .modal-content.task-edit-modal .form-group.tem-duck-card {
    /* 上面已精准覆盖，这里只是确保 nth-of-type 不再乱改 */
}

/* -- 5. 输入框/文本框：高度统一（输入 40px / 播报文本 textarea 140px） -- */
body .modal-content.task-edit-modal input[type="text"],
body .modal-content.task-edit-modal input[type="number"],
body .modal-content.task-edit-modal input[type="time"],
body .modal-content.task-edit-modal input[type="password"],
body .modal-content.task-edit-modal input[type="date"],
body .modal-content.task-edit-modal input:not([type]) {
    min-height: 40px !important;
    height: 40px !important;
    padding: 8px 14px !important;
    font-size: 13.5px !important;
    border: 1.5px solid #c7d2fe !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    color: #0f172a !important;
    box-shadow: 0 1px 2px rgba(49, 46, 129, 0.04) !important;
    transition: all .18s ease !important;
}
/* 播报文本 textarea：精准 140px，不依赖老浏览器不支持的 :contains/:has */
body .modal-content.task-edit-modal textarea.tem-broadcast-text,
body #app .modal-content.task-edit-modal textarea.tem-broadcast-text {
    min-height: 140px !important;
    height: 140px !important;
    padding: 12px 14px !important;
    line-height: 1.65 !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    border: 1.5px solid #c7d2fe !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    resize: vertical !important;
    box-shadow: 0 1px 2px rgba(49, 46, 129, 0.04) !important;
}
body .modal-content.task-edit-modal textarea,
body #app .modal-content.task-edit-modal textarea {
    border: 1.5px solid #c7d2fe !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    color: #0f172a !important;
    padding: 12px 14px !important;
    line-height: 1.6 !important;
    box-shadow: 0 1px 2px rgba(49, 46, 129, 0.04) !important;
}
/* focus：统一蓝紫光晕 */
body .modal-content.task-edit-modal input:focus,
body .modal-content.task-edit-modal textarea:focus,
body .modal-content.task-edit-modal select:focus {
    border-color: #6366f1 !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(99, 102, 241, 0.14),
        0 0 0 1px rgba(99, 102, 241, 0.45) inset,
        0 2px 6px rgba(79, 124, 255, 0.08) !important;
    outline: none !important;
}

/* -- 6. 下拉框：清楚、蓝紫箭头、40px、optgroup 色区分 -- */
body .modal-content.task-edit-modal select,
body #app .modal-content.task-edit-modal select {
    width: 100% !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 8px 44px 8px 14px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #0f172a !important;
    background-color: #ffffff !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path d='M2.5 4.8 L7 10.5 L11.5 4.8 Z' fill='%237b5cff' stroke='%234f7cff' stroke-width='0.6' stroke-linejoin='round'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px 14px !important;
    border: 1.5px solid #c7d2fe !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(49, 46, 129, 0.04) !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    -moz-appearance: none !important;
    line-height: 1.2 !important;
    transition: all .18s ease !important;
    flex: initial !important;
    min-width: 0 !important;
}
/* 提示音下拉框 tem-prompt-select：flex:1，占满 */
body .modal-content.task-edit-modal select.tem-prompt-select,
body #app .modal-content.task-edit-modal select.tem-prompt-select {
    flex: 1 !important;
    min-width: 200px !important;
}
/* select:active 蓝紫光晕更明显 */
body .modal-content.task-edit-modal select:active,
body .modal-content.task-edit-modal select:focus-visible {
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 5px rgba(99, 102, 241, 0.16),
        0 0 0 1px rgba(99, 102, 241, 0.5) inset !important;
}
/* 展开菜单 option：高对比白底 + 蓝紫选中条 */
body .modal-content.task-edit-modal select option,
body #app .modal-content.task-edit-modal select option {
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 13.5px !important;
    padding: 8px 10px !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
}
body .modal-content.task-edit-modal select option:checked,
body .modal-content.task-edit-modal select option[selected] {
    background: linear-gradient(135deg, rgba(79, 124, 255, 0.18), rgba(123, 92, 255, 0.18)) !important;
    color: #312e81 !important;
    font-weight: 700 !important;
}
body .modal-content.task-edit-modal select optgroup {
    color: #6d28d9 !important;
    font-weight: 800 !important;
    background: #f5f3ff !important;
    padding: 6px 10px !important;
    border-top: 1px solid #e9d5ff !important;
}
body .modal-content.task-edit-modal select optgroup option {
    background: #ffffff !important;
    color: #0f172a !important;
    padding-left: 22px !important;
    border: none !important;
    font-weight: 500 !important;
}

/* -- 7. 按钮：渐变 + 圆角 + 光泽扫动（覆盖 L4248-L4267 简洁白版） -- */
/* 通用：40px 高、12px 圆角、700 字重、hover 抬升 */
body .modal-content.task-edit-modal .btn,
body #app .modal-content.task-edit-modal .btn {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    line-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all .22s ease !important;
    white-space: nowrap !important;
    border: 1.5px solid transparent !important;
    vertical-align: middle !important;
    letter-spacing: .2px !important;
    background-image: none !important;
}
/* 光泽扫动 */
body .modal-content.task-edit-modal .btn::after,
body #app .modal-content.task-edit-modal .btn::after {
    content: "" !important;
    position: absolute !important;
    top: 0; left: -140% !important;
    width: 60% !important; height: 100% !important;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.42), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left .75s ease !important;
    pointer-events: none !important;
}
body .modal-content.task-edit-modal .btn:hover::after,
body #app .modal-content.task-edit-modal .btn:hover::after { left: 140% !important; }

/* 取消按钮：白底蓝边 + hover 淡紫底 + 深蓝紫字 */
body .modal-content.task-edit-modal .btn.btn-outline,
body .modal-content.task-edit-modal .btn.btn-outline-dark,
body .modal-content.task-edit-modal .btn.tem-btn-cancel,
body .modal-content.task-edit-modal .btn.cancel-btn,
body #app .modal-content.task-edit-modal .btn.btn-outline,
body #app .modal-content.task-edit-modal .btn.btn-outline-dark,
body #app .modal-content.task-edit-modal .btn.tem-btn-cancel,
body #app .modal-content.task-edit-modal .btn.cancel-btn {
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.5px solid #a5b4fc !important;
    color: #3730a3 !important;
    -webkit-text-fill-color: #3730a3 !important;
    box-shadow: 0 1px 2px rgba(49, 46, 129, 0.05) !important;
}
body .modal-content.task-edit-modal .btn.btn-outline:hover,
body .modal-content.task-edit-modal .btn.tem-btn-cancel:hover,
body .modal-content.task-edit-modal .btn.cancel-btn:hover {
    transform: translateY(-1.5px) !important;
    background: linear-gradient(180deg, #ffffff, #eef2ff) !important;
    border-color: #6366f1 !important;
    color: #4338ca !important;
    -webkit-text-fill-color: #4338ca !important;
    box-shadow:
        0 0 0 4px rgba(99, 102, 241, 0.12),
        0 10px 22px -10px rgba(79, 124, 255, 0.28) !important;
}

/* 主按钮：蓝紫渐变 + 三层发光阴影 + 高对比白字 */
body .modal-content.task-edit-modal .btn.btn-primary,
body .modal-content.task-edit-modal .btn.tem-btn-save,
body .modal-content.task-edit-modal .btn.engine-action-btn,
body #app .modal-content.task-edit-modal .btn.btn-primary,
body #app .modal-content.task-edit-modal .btn.tem-btn-save,
body #app .modal-content.task-edit-modal .btn.engine-action-btn {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1.5px solid transparent !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.25) inset,
        0 0 0 1px rgba(123, 92, 255, 0.45),
        0 10px 26px -8px rgba(123, 92, 255, 0.50),
        0 4px 10px -2px rgba(79, 124, 255, 0.28) !important;
    text-shadow: 0 1px 0 rgba(15, 23, 42, 0.18) !important;
}
body .modal-content.task-edit-modal .btn.btn-primary:hover,
body .modal-content.task-edit-modal .btn.tem-btn-save:hover,
body .modal-content.task-edit-modal .btn.engine-action-btn:hover {
    filter: brightness(1.07) saturate(1.08) !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.25) inset,
        0 0 0 1px rgba(155, 123, 255, 0.55),
        0 16px 34px -8px rgba(155, 123, 255, 0.55),
        0 6px 14px -2px rgba(79, 124, 255, 0.34) !important;
}
body .modal-content.task-edit-modal .btn:active,
body #app .modal-content.task-edit-modal .btn:active {
    transform: translateY(0) scale(0.985) !important;
    filter: brightness(0.98) !important;
}
/* 小按钮 32px */
body .modal-content.task-edit-modal .btn.btn-sm,
body #app .modal-content.task-edit-modal .btn.btn-sm {
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 12px !important;
    line-height: 32px !important;
    font-size: 12.5px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
}

/* -- 8. 播报类型 / 引擎 胶囊：白底蓝紫边 + active=蓝紫渐变填充+白字 -- */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    background: linear-gradient(180deg, #ffffff, #fbfaff) !important;
    border: 1.5px solid #e0e7ff !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    min-height: 64px !important;
    box-shadow: 0 2px 6px rgba(49, 46, 129, 0.06) !important;
    transition: all .22s ease !important;
    text-align: left !important;
    position: relative !important;
    overflow: hidden !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before {
    content: "" !important;
    position: absolute !important;
    left: 0; top: 0; bottom: 0;
    width: 4px !important;
    background: linear-gradient(180deg, #c7d2fe, #a5b4fc) !important;
    transition: all .22s ease !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #312e81 !important;
    letter-spacing: .15px !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child {
    font-size: 11.5px !important;
    color: #6366f1 !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    margin-top: 4px !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover {
    border-color: #818cf8 !important;
    transform: translateY(-1.5px) !important;
    box-shadow:
        0 0 0 4px rgba(123, 92, 255, 0.10),
        0 14px 28px -12px rgba(123, 92, 255, 0.28) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 60%, #9b7bff 100%) !important;
    border-color: #6366f1 !important;
    box-shadow:
        0 0 0 1px rgba(99, 102, 241, 0.55),
        0 0 0 5px rgba(99, 102, 241, 0.12),
        0 14px 28px -12px rgba(123, 92, 255, 0.32) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::before {
    background: #ffffff !important;
    width: 5px !important;
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.55) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* -- 9. 底部：保存任务 / 取消 按钮 100% 可见（sticky + 92px 预留 + 置顶阴影 + z-index 高）-- */
body .modal-content.task-edit-modal .modal-footer.tem-footer,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer {
    position: sticky !important;
    left: -28px;
    right: -28px;
    bottom: -22px;  /* 紧贴 modal-content 下内边距（= padding-bottom 92 中的 22 + 70 footer） */
    width: calc(100% + 56px) !important;
    margin: 22px -28px -92px -28px !important;   /* 把 92px 预留 吃掉 */
    padding: 14px 28px 18px 28px !important;
    min-height: 72px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.985) 40%, rgba(255,255,255,1) 100%) !important;
    border-top: 1px solid rgba(123, 92, 255, 0.18) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    box-shadow:
        0 -10px 24px -12px rgba(49, 46, 129, 0.14),
        0 -1px 0 rgba(123, 92, 255, 0.08) inset !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    z-index: 50 !important;   /* 绝对高于任何内部元素 */
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
}
/* 保存/取消按钮：44px + 更大 + 更显眼（★ 6 层锚定 + 双 id 前缀，确保压过通用 L5577 的 40px .btn） */
/*   A. 保存按钮 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary {
    min-width: 160px !important;
    min-height: 44px !important;
    height: 44px !important;
    max-height: 44px !important;
    padding: 0 22px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    border-radius: 14px !important;
    line-height: 44px !important;
    letter-spacing: .3px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1.5px solid transparent !important;
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    background-color: #6366f1 !important;
    background-image: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.25) inset,
        0 0 0 1px rgba(123,92,255,0.50),
        0 14px 30px -10px rgba(123,92,255,0.55),
        0 6px 14px -3px rgba(79,124,255,0.34) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover {
    filter: brightness(1.08) saturate(1.08) !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.25) inset,
        0 0 0 1px rgba(155,123,255,0.60),
        0 20px 38px -10px rgba(155,123,255,0.62),
        0 8px 18px -3px rgba(79,124,255,0.40) !important;
}

/*   B. 取消按钮（白底蓝边 —— 先锚定 btn-outline-dark/cancel-btn/tem-btn-cancel，再兜底所有 outline 类） */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark {
    min-width: 128px !important;
    min-height: 44px !important;
    height: 44px !important;
    max-height: 44px !important;
    padding: 0 20px !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    border-radius: 14px !important;
    line-height: 44px !important;
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.5px solid #a5b4fc !important;
    color: #3730a3 !important;
    -webkit-text-fill-color: #3730a3 !important;
    box-shadow:
        0 1px 2px rgba(49,46,129,0.05),
        0 0 0 1px rgba(255,255,255,0.9) inset !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark:hover {
    transform: translateY(-1.5px) !important;
    background: linear-gradient(180deg, #ffffff, #eef2ff) !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(180deg, #ffffff, #eef2ff) !important;
    border-color: #6366f1 !important;
    color: #4338ca !important;
    -webkit-text-fill-color: #4338ca !important;
    box-shadow:
        0 0 0 4px rgba(99,102,241,0.14),
        0 14px 28px -12px rgba(79,124,255,0.32) !important;
}
/* 顺序：取消左 / 保存右 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary { order: 2 !important; }
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark { order: 1 !important; }

/* -- 10. 滚动条：主题蓝紫渐变 -- */
body .modal-content.task-edit-modal::-webkit-scrollbar { width: 10px !important; }
body .modal-content.task-edit-modal::-webkit-scrollbar-track {
    background: rgba(123, 92, 255, 0.05) !important;
    border-radius: 999px !important;
}
body .modal-content.task-edit-modal::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4f7cff, #7b5cff, #9b7bff) !important;
    border-radius: 999px !important;
    border: 2px solid rgba(255, 255, 255, 0.7) !important;
}

/* -- 11. 标签字体：主题蓝紫（L4914 的标签覆盖回正确颜色）-- */
body .modal-content.task-edit-modal .form-label,
body #app .modal-content.task-edit-modal .form-label {
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: .15px !important;
    color: #312e81 !important;
}
body .modal-content.task-edit-modal .form-label > span:last-child {
    color: #64748b !important;
    font-weight: 400 !important;
}

/* ============================================================================
 * 2026-08-28 ★ 用户明确：【保存任务 / 取消】按钮 不要吸顶，改为随内容滚动到底才出现
 *   —— 覆盖 L5752-L5877 的 sticky footer + 92px padding-bottom 预留
 * ============================================================================ */
body .modal-content.task-edit-modal,
body #app .modal-content.task-edit-modal {
    padding: 22px 28px 28px 28px !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer {
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    margin: 18px -28px -28px -28px !important;
    padding: 16px 28px 20px 28px !important;
    min-height: 76px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, #fdfcff 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-top: 1.5px solid rgba(123, 92, 255, 0.22) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-bottom-left-radius: 19px !important;
    border-bottom-right-radius: 19px !important;
    box-shadow: 0 -6px 18px -12px rgba(49, 46, 129, 0.12) !important;
    z-index: 1 !important;
}

/* ============================================================================
 * 2026-08-28 ★ 用户要求：
 *   A. 任务编辑对话框 高度再调高一点（减少 56 → 32 的上下留白；max-height 放宽）
 *   B. 任务弹窗内所有滑块 → 改成与【参考图】一致：
 *        · 细轨道 4px（之前 6px 偏粗）
 *        · 填充段：浅橙 → 中橙 → 深橙 渐变（#fdba74 → #fb923c → #ea580c）
 *        · 未填充：#efe0d0（暖米灰，不再冷灰蓝）
 *        · Thumb：外层橙圈 2.5px (#ea580c) + 纯白心 + 柔橙光晕；不再蓝紫光环
 * ============================================================================ */

/* ---- A. 对话框高度：更贴近屏幕，上下留白从 calc(100vh - 56px) → calc(100vh - 32px)，max-height 920→1000 ---- */
body .modal-content.task-edit-modal,
body #app .modal-content.task-edit-modal {
    max-height: min(1000px, calc(100vh - 32px)) !important;
    min-height: 0 !important;
    height: auto !important;
}

/* ---- B1. 滑块本体：轨道 4px + 「橙渐变填充 / 暖米灰未填充」 ---- */
/* 注意：特异性 = body #app + 类，必须压过 L4502 那套蓝紫主规则 */
body .modal-content.task-edit-modal input[type="range"],
body .modal-dialog .modal-content.task-edit-modal input[type="range"],
body #app .modal-content.task-edit-modal input[type="range"],
body #app .modal-dialog .modal-content.task-edit-modal input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    width: 100% !important;
    line-height: 20px !important;
    display: block !important;
    margin: 4px 0 10px 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 1 !important;
    background-color: transparent !important;
    /* 参考图：4px 细轨道；填充=橙渐变(#fdba74 → #fb923c → #ea580c)；未填充=暖米灰 #efe0d0 */
    background-image: linear-gradient(
        90deg,
        #ffd1a6 0%,
        #fdba74 18%,
        #fb923c 45%,
        #f97316 70%,
        #ea580c var(--range-pct-num, 50%),
        #efe0d0 var(--range-pct-num, 50%),
        #fbe7d0 100%
    ) !important;
    background-size: 100% 4px !important;
    background-position: 50% 50% !important;
    background-repeat: no-repeat !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
    -webkit-user-drag: none !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
}

/* B2. 语义色类的滑块（range-theme-green/orange/blue）在统一主题下，微调其橙渐变强度（用户参考图本身就是橙色系），
 *    为避免太花，绿/蓝语义类 → 覆盖到 橙→深橙 的渐变强度稍低的"暖橙同系"版本（柔和不冲突） */
body .modal-content.task-edit-modal input[type="range"].range-theme-green,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-green,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-green {
    background-image: linear-gradient(90deg,#ffd9b3 0%,#fcc28a 25%,#fb923c 55%,#ea580c var(--range-pct-num,50%),#efe0d0 var(--range-pct-num,50%),#fbe7d0 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange {
    /* 语义橙 = 参考图最深版本 */
    background-image: linear-gradient(90deg,#ffc58a 0%,#fda04c 18%,#f97316 45%,#dc2626 var(--range-pct-num,50%),#efe0d0 var(--range-pct-num,50%),#fbe7d0 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-blue,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-blue,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-blue {
    background-image: linear-gradient(90deg,#ffd1a6 0%,#fdba74 22%,#fb923c 55%,#ea580c var(--range-pct-num,50%),#efe0d0 var(--range-pct-num,50%),#fbe7d0 100%) !important;
}

/* B3. 伪元素 track 彻底透明（不再抢轨道） */
body .modal-content.task-edit-modal input[type="range"]::-webkit-slider-runnable-track,
body .modal-content.task-edit-modal input[type="range"]::-webkit-media-slider-container {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 4px !important;
    min-height: 4px !important;
    max-height: 4px !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    outline: none !important;
    color: transparent !important;
}

/* B4. ★ Thumb：20px 总宽（外橙圈 2.5px + 纯白实心 15px）+ 柔橙光晕
 *     参考图视觉：外一圈橙（#ea580c）、内一颗白圆；尺寸比蓝紫版略大，更有"橙圈白心"的 iOS 感 */
body .modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    border-radius: 50% !important;
    /* 两层做法：白实心 + 2.5px 橙边框（与参考图完全一致：橙圈白心） */
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 2.5px solid #ea580c !important;
    outline: none !important;
    /* 柔橙光晕（与参考图右侧那圈柔光一致）：白内边 + 橙边 + 淡橙外发光 + 阴影 */
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 4px rgba(249, 115, 22, 0.18),
        0 6px 18px -4px rgba(249, 115, 22, 0.45) !important;
    margin-top: -8px !important; /* 本体 20px，轨道 4px 居中在 y=8，thumb 20/2=10 → - (10-2) ≈ -8 精准对位 */
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    position: relative !important;
    z-index: 10 !important;
    cursor: pointer !important;
    -webkit-user-drag: none !important;
    transition: box-shadow .12s ease, transform .08s ease !important;
}
body .modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"]:hover::-webkit-slider-thumb {
    transform: scale(1.12) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 6px rgba(249, 115, 22, 0.24),
        0 10px 22px -5px rgba(234, 88, 12, 0.55) !important;
}
body .modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"]:active::-webkit-slider-thumb {
    transform: scale(0.95) !important;
}
body .modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"]:focus::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234, 88, 12, 0.95),
        0 0 0 7px rgba(249, 115, 22, 0.26),
        0 10px 22px -5px rgba(234, 88, 12, 0.55) !important;
}

/* B5. 语义类 thumb 跟随统一橙白风格，只在光晕上做细微差别（不再蓝/绿/紫） */
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb {
    border-color: #dc2626 !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-green::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 4px rgba(249, 115, 22, 0.18),
        0 6px 18px -4px rgba(234, 88, 12, 0.42) !important;
}

/* B6. Firefox 镜像（参考图） */
body .modal-content.task-edit-modal input[type="range"]::-moz-range-track {
    width: 100% !important;
    height: 4px !important;
    border: none !important;
    background: #efe0d0 !important;
    border-radius: 999px !important;
    outline: none !important;
    box-shadow: none !important;
}
body .modal-content.task-edit-modal input[type="range"]::-moz-range-progress {
    height: 4px !important;
    border: none !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg,#ffd1a6 0%,#fdba74 22%,#fb923c 55%,#ea580c 100%) !important;
    outline: none !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-progress {
    background: linear-gradient(90deg,#ffc58a 0%,#fda04c 30%,#dc2626 100%) !important;
}
body .modal-content.task-edit-modal input[type="range"]::-moz-range-thumb {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 2.5px solid #ea580c !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 4px rgba(249, 115, 22, 0.18),
        0 6px 18px -4px rgba(249, 115, 22, 0.45) !important;
    cursor: pointer !important;
    transition: box-shadow .12s ease, transform .08s ease !important;
}
body .modal-content.task-edit-modal input[type="range"]:hover::-moz-range-thumb {
    transform: scale(1.12) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 6px rgba(249, 115, 22, 0.24),
        0 10px 22px -5px rgba(234, 88, 12, 0.55) !important;
}

/* C. 混响卡滑块：跟随参考图的细线风格（把原 3px → 4px 橙渐变；thumb 橙圈白心） */
body .rv-glass-card.rv-card-task input[type="range"],
body .modal-content.task-edit-modal .rv-glass-card input[type="range"],
body #app .modal-content.task-edit-modal .rv-glass-card input[type="range"] {
    background-image: linear-gradient(
        90deg,
        #ffd1a6 0%,
        #fdba74 20%,
        #fb923c 50%,
        #ea580c var(--range-pct-num, 50%),
        #efe0d0 var(--range-pct-num, 50%),
        #fbe7d0 100%
    ) !important;
    background-size: 100% 4px !important;
}
body .rv-glass-card.rv-card-task input[type="range"]::-webkit-slider-thumb,
body .modal-content.task-edit-modal .rv-glass-card input[type="range"]::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal .rv-glass-card input[type="range"]::-webkit-slider-thumb {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 2.5px solid #ea580c !important;
    margin-top: -8px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 4px rgba(249, 115, 22, 0.18),
        0 6px 18px -4px rgba(249, 115, 22, 0.45) !important;
    cursor: pointer !important;
}

/* ============================================================================
 * 2026-08-28 ★ 用户要求：任务编辑框里面这些按钮，要跟主题一样颜色（蓝紫 #4f7cff / #7b5cff / #9b7bff）
 *          参考【第三张图·语音播报「🔊 开始播报」按钮样式】+【首页语音播报按钮】
 *          hover 必须有特效：光晕放大 + 光泽扫动 + 上浮 + 背景加深
 *   目标按钮（全部归拢，用 body #app + 2 个前缀 压 FINAL TAKEOVER L5689-L5749 旧引擎卡白底）：
 *     1) 引擎 3 胶囊：腾讯TTS / 百度TTS / 讯飞智作（.engine-pill-btn）
 *     2) 播报类型 2 卡：📝 文本TTS播报 / 🎵 自定义音频文件（.tem-type-grid > .engine-pill-btn）
 *     3) 音频来源 2 卡：☁️ 上传服务器 / 💻 本地电脑（非 tem-type-grid 的 engine-pill-btn）
 *     4) 底部保存 / 取消：.tem-btn-save / .cancel-btn
 *     5) 其它 .btn：试听 / 上传 / 清空 / 刷新 / 移除 等 已在 L5643-L5710 覆盖为主题色
 *   结果：这些卡片/按钮 → 未选中是「主题浅蓝紫 渐变白心 + 蓝紫光圈」
 *                         hover 是「蓝紫渐变 加深 + 光晕 + 光泽 130% 扫过 + 上浮」
 *                         active/选中是「蓝紫满渐变 + 白字 + 外发光 ring」
 * ============================================================================ */

/* --- 1. 引擎 / 播报类型 / 音频来源：engine-pill-btn —— 默认就用主题色，不再白底 --- */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn,
body .modal-dialog .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn,
body #app .modal-dialog .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn {
    background: linear-gradient(135deg, rgba(79, 124, 255, 0.12) 0%, rgba(123, 92, 255, 0.09) 60%, rgba(155, 123, 255, 0.10) 100%),
                linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
    border: 1.6px solid rgba(123, 92, 255, 0.45) !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    min-height: 64px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9) inset,
        0 6px 16px -6px rgba(79, 124, 255, 0.18),
        0 2px 4px rgba(49, 46, 129, 0.05) !important;
    transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease, filter .22s ease !important;
    text-align: left !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::before {
    /* 左边装饰条 → 蓝紫渐变 */
    content: "" !important;
    position: absolute !important;
    left: 0; top: 0; bottom: 0;
    width: 4px !important;
    background: linear-gradient(180deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    box-shadow: 0 0 10px rgba(123, 92, 255, 0.35) !important;
    transition: all .22s ease !important;
}
/* 光泽扫动（与首页 🔊 开始播报 按钮一致） */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::after,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn::after {
    content: "" !important;
    position: absolute !important;
    top: 0; left: -140% !important;
    width: 62% !important; height: 100% !important;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left .8s ease !important;
    pointer-events: none !important;
}
/* 标题字 / 描述字 → 默认蓝紫 600 / 蓝紫-2 500 */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:first-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn .tem-card-title,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn .tem-card-title {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #312e81 !important;
    -webkit-text-fill-color: #312e81 !important;
    letter-spacing: .15px !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn > span:last-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn .tem-card-desc,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn .tem-card-desc {
    font-size: 11.5px !important;
    color: #4338ca !important;
    -webkit-text-fill-color: #4338ca !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    margin-top: 4px !important;
    opacity: .9 !important;
}

/* --- 1.1 hover：蓝紫渐变加深 + 上浮 + 光晕 + 光泽扫过 --- */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover,
body .modal-dialog .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover {
    border-color: #6366f1 !important;
    transform: translateY(-2px) scale(1.005) !important;
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    filter: brightness(1.06) saturate(1.08) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.22) inset,
        0 0 0 1px rgba(123, 92, 255, 0.60),
        0 0 0 5px rgba(99, 102, 241, 0.14),
        0 18px 36px -10px rgba(123, 92, 255, 0.55),
        0 6px 14px -3px rgba(79, 124, 255, 0.32) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover::after,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover::after { left: 140% !important; }
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover::before,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover::before {
    width: 6px !important;
    background: #ffffff !important;
    box-shadow: 0 0 14px rgba(255,255,255,0.65) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span:first-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span:first-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover .tem-card-title,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover .tem-card-title,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span:last-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span:last-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover .tem-card-desc,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover .tem-card-desc {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* --- 1.2 active（已选中）：比 hover 再加一层发光 + 深紫 ring 5px --- */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active,
body .modal-dialog .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active {
    background: linear-gradient(135deg, #2f5cff 0%, #4f7cff 20%, #7b5cff 60%, #9b7bff 100%) !important;
    border-color: #4f46e5 !important;
    filter: brightness(1.02) saturate(1.05) !important;
    transform: translateY(0) scale(1.000) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.25) inset,
        0 0 0 1px rgba(79, 70, 229, 0.8),
        0 0 0 6px rgba(99, 102, 241, 0.16),
        0 20px 40px -10px rgba(123, 92, 255, 0.62),
        0 8px 18px -3px rgba(79, 124, 255, 0.40) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::before,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::before {
    width: 6px !important;
    background: #ffffff !important;
    box-shadow: 0 0 14px rgba(255,255,255,0.65) !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::after,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active::after {
    /* 选中态常驻一层内光泽，不做扫动 */
    left: -30% !important;
    opacity: .55 !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:first-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active .tem-card-title,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active .tem-card-title,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:last-child,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active > span:last-child,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active .tem-card-desc,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active .tem-card-desc,
/* ★ 2026-08-28 图二修复：引擎胶囊内子容器 span / 嵌套多层 span 时，统一白字兜底（含任意 span 后代） */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active span,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active span,
body .modal-dialog .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active span,
/* 含 strong / small / div 内文字（防止个别引擎把标题塞到 strong 里） */
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active strong,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active small,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active div,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active strong,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active small,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn.active div {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
}
/* ★★ 2026-08-28 用户补提：3 颗引擎胶囊（腾讯TTS / 百度TTS / 讯飞智作）选中后字体必须白色
 *   说明：这 3 颗 DOM 是 <div class="engine-pill-btn">🎙️ 腾讯TTS（…音色）</div>，文本为「直接文本节点」，
 *        之前只抓 span 永远命中不到 → 直接写 engine-pill-btn.active 自身的 color/文本填充属性！
 *        特异性：body #app + 4 段，位置在文件末尾，压制 FINAL TAKEOVER 的 #312e81 蓝字。 */
body .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active,
body #app .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active,
body .modal-dialog .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active,
body .modal-content.task-edit-modal .play-mode-group > .play-mode-btn.engine-pill-btn.active,
body #app .modal-content.task-edit-modal .play-mode-group > .play-mode-btn.engine-pill-btn.active,
body .modal-dialog .modal-content.task-edit-modal .play-mode-group > .play-mode-btn.engine-pill-btn.active,
body .modal-content.task-edit-modal .form-group .play-mode-btn.engine-pill-btn.active,
body #app .modal-content.task-edit-modal .form-group .play-mode-btn.engine-pill-btn.active,
body .modal-dialog .modal-content.task-edit-modal .form-group .play-mode-btn.engine-pill-btn.active {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    fill: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
    font-weight: 800 !important;
    /* 顺带保证图标 emoji 颜色虽系统渲染，但文字白字足够 */
}
body .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active::selection,
body #app .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn.active::selection {
    background: rgba(155, 123, 255, 0.35) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
/* hover 时同样强制白字，避免部分内核 hover 态依旧残留旧蓝字 */
body .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn:hover,
body #app .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn:hover,
body .modal-dialog .modal-content.task-edit-modal .play-mode-group .play-mode-btn.engine-pill-btn:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover span,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover strong,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover small,
body .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover div,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover > span,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover span,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover strong,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover small,
body #app .modal-content.task-edit-modal .play-mode-btn.engine-pill-btn:hover div {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
}

/* --- 2. 底部保存 / 取消 再强化：贴近首页 🔊 开始播报 的「蓝紫满渐变 + 白边亮心 + 三层发光 + hover 上浮 + 光泽扫动 + 光晕放大」 --- */
/* 2.1 保存：主按钮 · 蓝紫满渐变 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary,
body .modal-dialog .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save,
body .modal-dialog .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary {
    position: relative !important;
    overflow: hidden !important;
    min-width: 180px !important;
    min-height: 46px !important;
    height: 46px !important;
    max-height: 46px !important;
    padding: 0 26px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    border-radius: 999px !important;   /* 第三张图是胶囊 */
    line-height: 46px !important;
    letter-spacing: .35px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1.5px solid transparent !important;
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    background-image: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.32) inset,
        0 0 0 1px rgba(123,92,255,0.55),
        0 16px 36px -10px rgba(123,92,255,0.60),
        0 7px 16px -3px rgba(79,124,255,0.38) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.20) !important;
    transition: all .22s cubic-bezier(.2,.7,.2,1) !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save::after,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary::after {
    content: "" !important;
    position: absolute !important;
    top: 0; left: -150% !important;
    width: 65% !important; height: 100% !important;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.55), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left .85s cubic-bezier(.2,.7,.2,1) !important;
    pointer-events: none !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover {
    filter: brightness(1.10) saturate(1.12) !important;
    transform: translateY(-2.5px) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.32) inset,
        0 0 0 1px rgba(155,123,255,0.70),
        0 0 0 6px rgba(99, 102, 241, 0.18),
        0 24px 50px -10px rgba(155,123,255,0.68),
        0 10px 22px -3px rgba(79,124,255,0.44) !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover::after,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-save:hover::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-primary:hover::after { left: 150% !important; }

/* 2.2 取消：胶囊白底 · 蓝紫光圈 · hover 翻转蓝紫满渐变 */
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline,
body .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .btn-outline-dark,
body .modal-dialog .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel,
body .modal-dialog .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn {
    position: relative !important;
    overflow: hidden !important;
    min-width: 140px !important;
    min-height: 46px !important;
    height: 46px !important;
    max-height: 46px !important;
    padding: 0 22px !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    border-radius: 999px !important;
    line-height: 46px !important;
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    background-image: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.6px solid #a5b4fc !important;
    color: #3730a3 !important;
    -webkit-text-fill-color: #3730a3 !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9) inset,
        0 4px 12px -4px rgba(79,124,255,0.16),
        0 2px 4px rgba(49,46,129,0.05) !important;
    transition: all .22s cubic-bezier(.2,.7,.2,1) !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel::after,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn::after {
    content: "" !important;
    position: absolute !important;
    top: 0; left: -150% !important;
    width: 65% !important; height: 100% !important;
    background: linear-gradient(120deg, transparent, rgba(79,124,255,0.18), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left .85s cubic-bezier(.2,.7,.2,1) !important;
    pointer-events: none !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover {
    transform: translateY(-2px) !important;
    /* hover 翻到蓝紫满渐变（与「开始播报」按钮一致的蓝紫白字） */
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    background-image: linear-gradient(135deg, #4f7cff 0%, #7b5cff 52%, #9b7bff 100%) !important;
    border-color: #6366f1 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.20) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(123,92,255,0.55),
        0 0 0 5px rgba(99,102,241,0.16),
        0 20px 44px -10px rgba(123,92,255,0.58),
        0 9px 20px -3px rgba(79,124,255,0.40) !important;
}
body .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover::after,
body .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .tem-btn-cancel:hover::after,
body #app .modal-content.task-edit-modal .modal-footer.tem-footer .cancel-btn:hover::after { left: 150% !important; }

/* --- 3. 小按钮再强化（试听 / 上传 / 清空 / 刷新 / 移除）：胶囊 + 蓝紫满渐变 + hover 光晕放大 --- */
body .modal-content.task-edit-modal .btn.btn-sm,
body #app .modal-content.task-edit-modal .btn.btn-sm,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm {
    border-radius: 999px !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 14px !important;
    line-height: 34px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: .15px !important;
}
/* 试听 / 上传：engine-action-btn → 主色蓝紫满渐变 + 三层发光 */
body .modal-content.task-edit-modal .btn.btn-sm.engine-action-btn,
body .modal-content.task-edit-modal .btn.btn-outline.btn-sm.engine-action-btn,
body #app .modal-content.task-edit-modal .btn.btn-sm.engine-action-btn,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.engine-action-btn {
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    background-image: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1.4px solid transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(123,92,255,0.50),
        0 12px 26px -8px rgba(123,92,255,0.52),
        0 5px 12px -2px rgba(79,124,255,0.30) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
}
body .modal-content.task-edit-modal .btn.btn-sm.engine-action-btn:hover,
body #app .modal-content.task-edit-modal .btn.btn-sm.engine-action-btn:hover {
    transform: translateY(-2px) !important;
    filter: brightness(1.08) saturate(1.10) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(155,123,255,0.65),
        0 0 0 5px rgba(99,102,241,0.15),
        0 18px 36px -8px rgba(155,123,255,0.60),
        0 8px 18px -2px rgba(79,124,255,0.38) !important;
}
/* 清空 / 刷新：默认蓝紫胶囊白底 · hover 翻转蓝紫满渐变白字 */
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline,
body .modal-content.task-edit-modal .btn.btn-outline.btn-sm,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-outline,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.btn-outline {
    background: linear-gradient(180deg, #ffffff, #f8faff) !important;
    background-image: linear-gradient(180deg, #ffffff, #f8faff) !important;
    border: 1.4px solid #a5b4fc !important;
    color: #3730a3 !important;
    -webkit-text-fill-color: #3730a3 !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9) inset,
        0 3px 10px -2px rgba(79,124,255,0.14) !important;
}
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline:hover,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-outline:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    background-image: linear-gradient(135deg, #4f7cff 0%, #7b5cff 55%, #9b7bff 100%) !important;
    border-color: #6366f1 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(123,92,255,0.52),
        0 0 0 5px rgba(99,102,241,0.14),
        0 16px 32px -8px rgba(123,92,255,0.55),
        0 7px 16px -2px rgba(79,124,255,0.36) !important;
}
/* 移除按钮（红）：保持语义警告，但做成「红渐变胶囊 + hover 光晕放大」 */
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline[style*="color:#dc2626"],
body .modal-content.task-edit-modal .btn.btn-sm[style*="color:#dc2626"],
body .modal-content.task-edit-modal .btn.btn-sm.btn-danger,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-danger,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.btn-danger {
    background: linear-gradient(180deg, #ffffff, #fff5f5) !important;
    border: 1.4px solid #fca5a5 !important;
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9) inset,
        0 3px 10px -2px rgba(239,68,68,0.14) !important;
}
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline[style*="color:#dc2626"]:hover,
body .modal-content.task-edit-modal .btn.btn-sm[style*="color:#dc2626"]:hover,
body .modal-content.task-edit-modal .btn.btn-sm.btn-danger:hover,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-danger:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg, #ef4444 0%, #f43f5e 55%, #ec4899 100%) !important;
    border-color: #dc2626 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(239,68,68,0.55),
        0 0 0 5px rgba(239,68,68,0.15),
        0 16px 32px -8px rgba(239,68,68,0.55),
        0 7px 16px -2px rgba(239,68,68,0.34) !important;
}

/* --- 4. 顶部装饰条：与按钮同步加发光（整体更有"开始播报"的仪式感） --- */
body .modal-content.task-edit-modal::before,
body #app .modal-content.task-edit-modal::before {
    box-shadow: 0 0 26px rgba(123, 92, 255, 0.55), 0 0 10px rgba(79, 124, 255, 0.55) !important;
}

/* ============================================================================
 * 2026-08-28 图三修复：音频来源「选择文件并上传 / 移除当前上传文件」按钮文字被卡挡 → 宽度/换行/间距补全
 *   痛点：
 *     - 按钮高 34px + padding 14px 被强制，长中文（10+ 字）在 999px 胶囊圆角下 → 两侧白芒压到字
 *     - 同行两个按钮 gap=10 偏紧，窗口宽度不足时 flex-wrap=wrap 但旧 .btn-sm height=auto 时仍会两行
 *   最小必要补丁（按 Experience 603641 最小范围调整，不动全局引擎卡布局）：
 *     1) 行容器 tem-audio-upload-row：gap 10→14、justify-content=flex-start、row-gap 10
 *     2) 两个按钮：min-width 按内容保底（上传 204px / 移除 194px），胶囊两头留 22px 空白不切字，
 *        flex-shrink=0 防止父容器窄时被压扁；高度 36px / lineH 34px 防两行溢出
 * ============================================================================ */
/* 4.1 容器：宽一点、自动换行不卡（不通过 [style*=…] 脆弱匹配，直接按 class） */
body .modal-content.task-edit-modal .tem-audio-upload-row,
body #app .modal-content.task-edit-modal .tem-audio-upload-row,
body .modal-dialog .modal-content.task-edit-modal .tem-audio-upload-row,
body .modal-content.task-edit-modal .form-group > div[style*="display:flex"],
body #app .modal-content.task-edit-modal .form-group > div[style*="display:flex"],
body .modal-dialog .modal-content.task-edit-modal .form-group > div[style*="display:flex"] {
    width: 100% !important;
    gap: 16px 16px !important;
    row-gap: 12px !important;
    column-gap: 16px !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}
/* ============================================================================
 * 2026-08-28 滑块圆球调小（引擎3滑块 + 闪避降低音量滑块 统一 14px 小白圆）
 *   要求：滑轨上圆球调小，语音引擎调试滑块与闪避降低音量滑块 样式一模一样
 *   两边都带了 range-theme-orange class → 直接对「任务弹窗内 range-theme-orange 的 thumb」
 *   强制覆盖 width/height = 14px，margin-top 重新居中
 *   Firefox 同理（::-moz-range-thumb 同样缩到 14px）
 * ============================================================================ */
/* A. WebKit：任务弹窗内 range-theme-orange 的 thumb → 14px 小圈 + 橙光环同步缩小 */
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange::-webkit-slider-thumb {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    /* 居中公式：20px本体 / 2 = 10px 中线 - 14pxthumb / 2 = 7px → 3px
       实测老 Blink 需要再上提 1px → margin-top = -4px（与 6px 轨道精准重合） */
    margin-top: -4px !important;
    /* 橙红三层光环 整体 缩小：外发光 5→4、阴影 6px→5px */
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,0.95),
        0 0 0 4px rgba(249,115,22,0.20),
        0 5px 14px -4px rgba(234,88,12,0.48) !important;
}
/* hover 缩放 + 光环扩大（与之前比例一致：缩小 0.8 倍左右） */
body .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-webkit-slider-thumb,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-webkit-slider-thumb {
    transform: scale(1.1) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,1),
        0 0 0 6px rgba(249,115,22,0.26),
        0 8px 18px -4px rgba(234,88,12,0.56) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange:active::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange:active::-webkit-slider-thumb {
    transform: scale(0.95) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange:focus::-webkit-slider-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange:focus::-webkit-slider-thumb,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange:focus::-webkit-slider-thumb {
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,1),
        0 0 0 7px rgba(249,115,22,0.30),
        0 8px 18px -4px rgba(234,88,12,0.60) !important;
}
/* B. Firefox：thumb 14px + 橙红三层光环（镜像 WebKit） */
body .modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-thumb,
body .modal-dialog .modal-content.task-edit-modal input[type="range"].range-theme-orange::-moz-range-thumb {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,0.95),
        0 0 0 4px rgba(249,115,22,0.20),
        0 5px 14px -4px rgba(234,88,12,0.48) !important;
}
body .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-moz-range-thumb,
body #app .modal-content.task-edit-modal input[type="range"].range-theme-orange:hover::-moz-range-thumb {
    transform: scale(1.1) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,1),
        0 0 0 2px rgba(234,88,12,1),
        0 0 0 6px rgba(249,115,22,0.26),
        0 8px 18px -4px rgba(234,88,12,0.56) !important;
}

/* 4.2 上传按钮：📤 选择文件并上传（7汉字 + 📤 + 并 = 字面 154px；胶囊左右各 25px 留白 ≈ 204px） */
body .modal-content.task-edit-modal .tem-audio-upload-btn,
body .modal-content.task-edit-modal label.btn.btn-sm.engine-action-btn,
body .modal-content.task-edit-modal label.btn.btn-outline.btn-sm.engine-action-btn,
body #app .modal-content.task-edit-modal .tem-audio-upload-btn,
body #app .modal-content.task-edit-modal label.btn.btn-sm.engine-action-btn,
body .modal-dialog .modal-content.task-edit-modal .tem-audio-upload-btn,
body .modal-dialog .modal-content.task-edit-modal label.btn.btn-sm.engine-action-btn {
    min-width: 204px !important;
    width: auto !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    padding: 0 26px 0 24px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    line-height: 36px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
}
body .modal-content.task-edit-modal .tem-audio-upload-btn > span,
body #app .modal-content.task-edit-modal .tem-audio-upload-btn > span,
body .modal-content.task-edit-modal label.btn.btn-sm.engine-action-btn > span,
body #app .modal-content.task-edit-modal label.btn.btn-sm.engine-action-btn > span {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 36px !important;
    padding: 0 !important;
}
body .modal-content.task-edit-modal .tem-audio-upload-btn > input[type="file"],
body #app .modal-content.task-edit-modal .tem-audio-upload-btn > input[type="file"] {
    z-index: 1 !important;
    cursor: pointer !important;
}

/* 4.3 移除按钮：🗑 移除当前上传文件（8汉字 + 🗑 ≈ 字面 150px；胶囊两头 22px 留白 ≈ 194px）
 *     注意：之前用 [style*="color:#dc2626"] 匹配会因 360/QQ 拼 style 顺序/空格 差异失效，
 *           这里再补 class 版 tem-remove-audio-btn 作为强匹配主键（L5743 已加），
 *           [style*=…] 保留做低优先级兜底。 */
body .modal-content.task-edit-modal .tem-remove-audio-btn,
body .modal-dialog .modal-content.task-edit-modal .tem-remove-audio-btn,
body #app .modal-content.task-edit-modal .tem-remove-audio-btn,
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline[style*="color:#dc2626"],
body .modal-content.task-edit-modal .btn.btn-sm[style*="color:#dc2626"],
body .modal-content.task-edit-modal .btn.btn-sm.btn-danger,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-danger,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.btn-danger {
    min-width: 194px !important;
    width: auto !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    padding: 0 24px 0 22px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    line-height: 36px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
}

/* 4.3.1 兜底：移除按钮文字必须红色，防止前面 L6544「.btn.btn-sm.btn-outline」白底蓝紫主题覆盖
 *         规则特异性 4 段 ≥ 上游 4 段（body #app .modal-content .btn.btn-sm.btn-outline）
 *         另外，L6480 高度 34px 必须同步被 36px 覆盖：显式 btn.btn-sm.btn-outline 4 段 + 位置最后 */
body .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn,
body #app .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn,
body .modal-dialog .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn,
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn,
body .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn,
body #app .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn {
    /* === 颜色：白底红边红字 === */
    background: #ffffff !important;
    background-image: none !important;
    background-color: #ffffff !important;
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
    border: 1.5px solid #fca5a5 !important;
    border-width: 1.5px !important;
    border-color: #fca5a5 !important;
    /* === 尺寸：36px 高（不被 L6480 34px 压制） === */
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    line-height: 36px !important;
    min-width: 194px !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 24px 0 22px !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
    /* === 阴影：红色弱化 === */
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.9) inset,
        0 3px 10px -2px rgba(239,68,68,0.14) !important;
    text-shadow: none !important;
    filter: none !important;
    font-weight: 700 !important;
}
/* hover：翻红渐变胶囊白字 + 上浮 2px */
body .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body #app .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body .modal-dialog .modal-content.task-edit-modal button.btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body #app .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.btn-outline.tem-remove-audio-btn:hover,
body .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn:hover,
body #app .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn:hover,
body .modal-dialog .modal-content.task-edit-modal .btn.btn-sm.tem-remove-audio-btn:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg, #ef4444 0%, #f43f5e 55%, #ec4899 100%) !important;
    background-image: linear-gradient(135deg, #ef4444 0%, #f43f5e 55%, #ec4899 100%) !important;
    background-color: transparent !important;
    border-color: #dc2626 !important;
    border-width: 1.5px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.18) !important;
    filter: brightness(1.02) saturate(1.05) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(239,68,68,0.55),
        0 0 0 5px rgba(239,68,68,0.15),
        0 16px 32px -8px rgba(239,68,68,0.55),
        0 7px 16px -2px rgba(239,68,68,0.34) !important;
}

/* 4.4 已选中文件文字：独立一行，不和按钮叠（flex:1 占剩余空间 + 文字截断 + 颜色浅绿） */
/* ★ 说明：模板里改用 v-show 控制显示，不再用 :style 内联表达式（Vue 编译 :style="{display:...};" 尾部分号 → 崩溃） */
body .modal-content.task-edit-modal .tem-file-selected-text,
body #app .modal-content.task-edit-modal .tem-file-selected-text,
body .modal-dialog .modal-content.task-edit-modal .tem-file-selected-text,
body .modal-content.task-edit-modal .tem-audio-pick-row .tem-file-selected-text,
body #app .modal-content.task-edit-modal .tem-audio-pick-row .tem-file-selected-text {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    padding: 0 14px 0 14px !important;
    margin: 0 !important;
    flex: 1 1 260px !important;
    min-width: 260px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background: linear-gradient(180deg, #f0fdf4, #ecfdf5) !important;
    background-color: #ecfdf5 !important;
    background-image: linear-gradient(180deg, #f0fdf4, #ecfdf5) !important;
    border: 1px dashed #86efac !important;
    border-radius: 10px !important;
    color: #166534 !important;
    -webkit-text-fill-color: #166534 !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    letter-spacing: .15px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    z-index: 0 !important;
    position: relative !important;
}
/* v-show 走 display:none，这里再次强调当 v-show 撤销隐藏时，必须强制 inline-flex（避免 v-show 的 display:none 覆盖后默认不是 inline-flex） */
body .modal-content.task-edit-modal .tem-file-selected-text:not([style*="display: none"]),
body #app .modal-content.task-edit-modal .tem-file-selected-text:not([style*="display: none"]),
body .modal-dialog .modal-content.task-edit-modal .tem-file-selected-text:not([style*="display: none"]) {
    display: inline-flex !important;
}
body .modal-content.task-edit-modal .tem-file-selected-text > span,
body #app .modal-content.task-edit-modal .tem-file-selected-text > span,
body .modal-dialog .modal-content.task-edit-modal .tem-file-selected-text > span {
    display: inline-block !important;
    max-width: 100% !important;
    line-height: 32px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
}

/* 4.5 行容器：gap 从 10→18，选中文字有独立空间，不会和选择按钮 / 移除按钮互相挤压 */
body .modal-content.task-edit-modal .tem-audio-pick-row,
body #app .modal-content.task-edit-modal .tem-audio-pick-row,
body .modal-dialog .modal-content.task-edit-modal .tem-audio-pick-row {
    gap: 18px 16px !important;
    row-gap: 14px !important;
    column-gap: 18px !important;
    align-items: center !important;
}

/* 4.6 小屏（≤640px）：选择按钮 / 已选文字 / 移除按钮 各占 1 行 100% 宽，彻底杜绝重叠 */
@media (max-width: 640px) {
    body .modal-content.task-edit-modal .tem-audio-upload-btn,
    body #app .modal-content.task-edit-modal .tem-audio-upload-btn,
    body .modal-dialog .modal-content.task-edit-modal .tem-audio-upload-btn {
        min-width: 0 !important;
        width: 100% !important;
    }
    body .modal-content.task-edit-modal .tem-remove-audio-btn,
    body #app .modal-content.task-edit-modal .tem-remove-audio-btn,
    body .modal-dialog .modal-content.task-edit-modal .tem-remove-audio-btn {
        min-width: 0 !important;
        width: 100% !important;
    }
    body .modal-content.task-edit-modal .tem-file-selected-text,
    body #app .modal-content.task-edit-modal .tem-file-selected-text,
    body .modal-dialog .modal-content.task-edit-modal .tem-file-selected-text {
        min-width: 0 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* ============================================================
 * 5. 立即播报区按钮样式修复（2026-08-29）
 *    参考图片：主按钮蓝紫渐变白字、停止深灰白字、导出橙渐变白字
 *    统一：高圆角(50px)、大高度(52px)、白字粗体、发光阴影
 * ============================================================ */

/* 5.1 容器：三按钮 gap 拉开，小屏自动换行 */
body #app .immediate-actions-bar,
body .immediate-actions-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin-top: 8px !important;
}

/* 5.2 通用：三按钮统一高度/圆角/字重/白字，禁止缩放 */
body #app .immediate-actions-bar .btn,
body .immediate-actions-bar .btn {
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    line-height: 52px !important;
    padding: 0 28px !important;
    border-radius: 50px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.22) !important;
    border: none !important;
    outline: none !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease !important;
    filter: none !important;
    opacity: 1 !important;
}

/* 5.3 开始播报：蓝紫渐变胶囊 + 蓝紫光晕（参考图片主按钮色） */
body #app .immediate-actions-bar .immediate-btn-start,
body .immediate-actions-bar .immediate-btn-start {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%) !important;
    background-image: linear-gradient(135deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(139,92,246,0.55),
        0 0 0 5px rgba(139,92,246,0.13),
        0 14px 28px -8px rgba(139,92,246,0.52),
        0 6px 14px -2px rgba(99,102,241,0.34) !important;
}
body #app .immediate-actions-bar .immediate-btn-start:hover:not(:disabled),
body .immediate-actions-bar .immediate-btn-start:hover:not(:disabled) {
    transform: translateY(-2px) !important;
    filter: brightness(1.06) saturate(1.08) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(139,92,246,0.62),
        0 0 0 6px rgba(139,92,246,0.17),
        0 20px 36px -8px rgba(139,92,246,0.62),
        0 8px 18px -2px rgba(99,102,241,0.40) !important;
}
body #app .immediate-actions-bar .immediate-btn-start:active:not(:disabled),
body .immediate-actions-bar .immediate-btn-start:active:not(:disabled) {
    transform: translateY(0px) !important;
}
/* 禁用态：柔和灰紫渐变 + 去光晕 + 低饱和，不使用生硬灰色 */
body #app .immediate-actions-bar .immediate-btn-start:disabled,
body .immediate-actions-bar .immediate-btn-start:disabled {
    background: linear-gradient(135deg, #c7d2fe 0%, #ddd6fe 55%, #e9d5ff 100%) !important;
    background-image: linear-gradient(135deg, #c7d2fe 0%, #ddd6fe 55%, #e9d5ff 100%) !important;
    background-color: transparent !important;
    color: rgba(255,255,255,0.96) !important;
    -webkit-text-fill-color: rgba(255,255,255,0.96) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.08) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.35) inset,
        0 0 0 1px rgba(165,180,252,0.45),
        0 3px 10px -2px rgba(165,180,252,0.22) !important;
    cursor: not-allowed !important;
    filter: saturate(0.78) !important;
    transform: none !important;
}

/* 5.4 停止播报：深灰渐变胶囊白字 */
body #app .immediate-actions-bar .immediate-btn-stop,
body .immediate-actions-bar .immediate-btn-stop {
    background: linear-gradient(135deg, #475569 0%, #334155 55%, #1e293b 100%) !important;
    background-image: linear-gradient(135deg, #475569 0%, #334155 55%, #1e293b 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.16) inset,
        0 0 0 1px rgba(71,85,105,0.55),
        0 0 0 5px rgba(71,85,105,0.10),
        0 14px 28px -8px rgba(30,41,59,0.42),
        0 6px 14px -2px rgba(51,65,85,0.30) !important;
}
body #app .immediate-actions-bar .immediate-btn-stop:hover:not(:disabled),
body .immediate-actions-bar .immediate-btn-stop:hover:not(:disabled) {
    transform: translateY(-2px) !important;
    filter: brightness(1.1) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.20) inset,
        0 0 0 1px rgba(71,85,105,0.62),
        0 0 0 6px rgba(71,85,105,0.14),
        0 20px 36px -8px rgba(30,41,59,0.52),
        0 8px 18px -2px rgba(51,65,85,0.38) !important;
}
body #app .immediate-actions-bar .immediate-btn-stop:active:not(:disabled),
body .immediate-actions-bar .immediate-btn-stop:active:not(:disabled) {
    transform: translateY(0px) !important;
}
/* 禁用态：柔和浅灰 */
body #app .immediate-actions-bar .immediate-btn-stop:disabled,
body .immediate-actions-bar .immediate-btn-stop:disabled {
    background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 55%, #94a3b8 100%) !important;
    background-image: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 55%, #94a3b8 100%) !important;
    background-color: transparent !important;
    color: rgba(255,255,255,0.94) !important;
    -webkit-text-fill-color: rgba(255,255,255,0.94) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.06) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.35) inset,
        0 0 0 1px rgba(203,213,225,0.48),
        0 3px 10px -2px rgba(148,163,184,0.18) !important;
    cursor: not-allowed !important;
    filter: saturate(0.7) !important;
    transform: none !important;
}

/* 5.5 导出为MP3：橙渐变胶囊白字 */
body #app .immediate-actions-bar .immediate-btn-export,
body .immediate-actions-bar .immediate-btn-export {
    background: linear-gradient(135deg, #fb923c 0%, #f97316 55%, #ea580c 100%) !important;
    background-image: linear-gradient(135deg, #fb923c 0%, #f97316 55%, #ea580c 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(249,115,22,0.55),
        0 0 0 5px rgba(249,115,22,0.13),
        0 14px 28px -8px rgba(234,88,12,0.50),
        0 6px 14px -2px rgba(249,115,22,0.32) !important;
}
body #app .immediate-actions-bar .immediate-btn-export:hover:not(:disabled),
body .immediate-actions-bar .immediate-btn-export:hover:not(:disabled) {
    transform: translateY(-2px) !important;
    filter: brightness(1.06) saturate(1.08) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(249,115,22,0.62),
        0 0 0 6px rgba(249,115,22,0.18),
        0 20px 36px -8px rgba(234,88,12,0.60),
        0 8px 18px -2px rgba(249,115,22,0.40) !important;
}
body #app .immediate-actions-bar .immediate-btn-export:active:not(:disabled),
body .immediate-actions-bar .immediate-btn-export:active:not(:disabled) {
    transform: translateY(0px) !important;
}
/* 禁用态：柔和浅橙 */
body #app .immediate-actions-bar .immediate-btn-export:disabled,
body .immediate-actions-bar .immediate-btn-export:disabled {
    background: linear-gradient(135deg, #fed7aa 0%, #fdba74 55%, #fb923c 100%) !important;
    background-image: linear-gradient(135deg, #fed7aa 0%, #fdba74 55%, #fb923c 100%) !important;
    background-color: transparent !important;
    color: rgba(255,255,255,0.96) !important;
    -webkit-text-fill-color: rgba(255,255,255,0.96) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.08) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.35) inset,
        0 0 0 1px rgba(253,186,116,0.48),
        0 3px 10px -2px rgba(251,146,60,0.22) !important;
    cursor: not-allowed !important;
    filter: saturate(0.78) !important;
    transform: none !important;
}

/* 5.6 小屏(≤640px)：按钮各占一行 100% 宽，不换行挤压 */
@media (max-width: 640px) {
    body #app .immediate-actions-bar,
    body .immediate-actions-bar {
        flex-direction: column !important;
        gap: 12px !important;
    }
    body #app .immediate-actions-bar .btn,
    body .immediate-actions-bar .btn {
        width: 100% !important;
        flex: 1 1 100% !important;
        min-width: 0 !important;
    }
}

/* ============================================================
 * 6. 任务卡底部4个小按钮（2026-08-29）
 *    缩小版胶囊：32px高 / 50px圆角 / 白字粗体 / 对应颜色渐变+微发光
 *    参考立即播报区配色：
 *      · 🔊 试听 task-btn-preview  → 蓝紫渐变（对应"开始播报"主按钮）
 *      · ⏹ 停试听 task-btn-stop    → 橙渐变（警告态，未播放时为 outline 深蓝灰）
 *      · ✏️ 编辑 task-btn-edit     → 蓝青渐变
 *      · 🗑 删除 task-btn-delete   → 红渐变（危险态）
 * ============================================================ */

/* 6.1 四按钮通用：小胶囊基础尺寸/圆角/白字/禁止缩放 */
body #app .task-actions-v2 .task-btn-preview,
body #app .task-actions-v2 .task-btn-stop,
body #app .task-actions-v2 .task-btn-edit,
body #app .task-actions-v2 .task-btn-delete,
body .task-actions-v2 .task-btn-preview,
body .task-actions-v2 .task-btn-stop,
body .task-actions-v2 .task-btn-edit,
body .task-actions-v2 .task-btn-delete {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    padding: 0 14px !important;
    border-radius: 50px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.20) !important;
    border: none !important;
    outline: none !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    transition: transform 0.20s ease, box-shadow 0.20s ease, filter 0.20s ease !important;
    filter: none !important;
    opacity: 1 !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.22) inset,
        0 0 0 1px rgba(15,23,42,0.08),
        0 6px 14px -6px rgba(15,23,42,0.22) !important;
}
/* hover: 轻微上浮 + 饱和度 + 更强阴影 */
body #app .task-actions-v2 .task-btn-preview:hover:not(:disabled),
body #app .task-actions-v2 .task-btn-stop:hover:not(:disabled),
body #app .task-actions-v2 .task-btn-edit:hover:not(:disabled),
body #app .task-actions-v2 .task-btn-delete:hover:not(:disabled),
body .task-actions-v2 .task-btn-preview:hover:not(:disabled),
body .task-actions-v2 .task-btn-stop:hover:not(:disabled),
body .task-actions-v2 .task-btn-edit:hover:not(:disabled),
body .task-actions-v2 .task-btn-delete:hover:not(:disabled) {
    transform: translateY(-1.5px) !important;
    filter: brightness(1.05) saturate(1.08) !important;
}
/* active: 回落 */
body #app .task-actions-v2 .task-btn-preview:active:not(:disabled),
body #app .task-actions-v2 .task-btn-stop:active:not(:disabled),
body #app .task-actions-v2 .task-btn-edit:active:not(:disabled),
body #app .task-actions-v2 .task-btn-delete:active:not(:disabled),
body .task-actions-v2 .task-btn-preview:active:not(:disabled),
body .task-actions-v2 .task-btn-stop:active:not(:disabled),
body .task-actions-v2 .task-btn-edit:active:not(:disabled),
body .task-actions-v2 .task-btn-delete:active:not(:disabled) {
    transform: translateY(0) !important;
}
/* disabled: 柔和灰禁用态（不使用生硬黑灰） */
body #app .task-actions-v2 .task-btn-preview:disabled,
body #app .task-actions-v2 .task-btn-stop:disabled,
body #app .task-actions-v2 .task-btn-edit:disabled,
body #app .task-actions-v2 .task-btn-delete:disabled,
body .task-actions-v2 .task-btn-preview:disabled,
body .task-actions-v2 .task-btn-stop:disabled,
body .task-actions-v2 .task-btn-edit:disabled,
body .task-actions-v2 .task-btn-delete:disabled {
    background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 55%, #94a3b8 100%) !important;
    background-image: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 55%, #94a3b8 100%) !important;
    background-color: transparent !important;
    color: rgba(255,255,255,0.94) !important;
    -webkit-text-fill-color: rgba(255,255,255,0.94) !important;
    text-shadow: 0 1px 0 rgba(15,23,42,0.06) !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(203,213,225,0.40),
        0 2px 6px -2px rgba(148,163,184,0.18) !important;
    cursor: not-allowed !important;
    filter: saturate(0.72) !important;
    transform: none !important;
}

/* 6.2 🔊 试听（蓝紫渐变 — 对应立即播报区"开始播报"） */
body #app .task-actions-v2 .task-btn-preview,
body .task-actions-v2 .task-btn-preview {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%) !important;
    background-image: linear-gradient(135deg, #6366f1 0%, #8b5cf6 55%, #a855f7 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.26) inset,
        0 0 0 1px rgba(139,92,246,0.50),
        0 0 0 3px rgba(139,92,246,0.10),
        0 10px 20px -8px rgba(139,92,246,0.46),
        0 4px 10px -2px rgba(99,102,241,0.28) !important;
}
body #app .task-actions-v2 .task-btn-preview:hover:not(:disabled),
body .task-actions-v2 .task-btn-preview:hover:not(:disabled) {
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(139,92,246,0.60),
        0 0 0 4px rgba(139,92,246,0.14),
        0 14px 26px -8px rgba(139,92,246,0.56),
        0 6px 14px -2px rgba(99,102,241,0.34) !important;
}

/* 6.3 ⏹ 停止（两态：播放中=btn-warning橙渐变；未播放=btn-outline深蓝灰描边白字） */
body #app .task-actions-v2 .task-btn-stop.btn-warning,
body .task-actions-v2 .task-btn-stop.btn-warning {
    background: linear-gradient(135deg, #fb923c 0%, #f97316 55%, #ea580c 100%) !important;
    background-image: linear-gradient(135deg, #fb923c 0%, #f97316 55%, #ea580c 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.26) inset,
        0 0 0 1px rgba(249,115,22,0.50),
        0 0 0 3px rgba(249,115,22,0.10),
        0 10px 20px -8px rgba(234,88,12,0.46),
        0 4px 10px -2px rgba(249,115,22,0.28) !important;
}
body #app .task-actions-v2 .task-btn-stop.btn-warning:hover:not(:disabled),
body .task-actions-v2 .task-btn-stop.btn-warning:hover:not(:disabled) {
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(249,115,22,0.60),
        0 0 0 4px rgba(249,115,22,0.14),
        0 14px 26px -8px rgba(234,88,12,0.56),
        0 6px 14px -2px rgba(249,115,22,0.34) !important;
}
/* 未播放态：深蓝灰描边 + 深色字体（可读） */
body #app .task-actions-v2 .task-btn-stop.btn-outline,
body .task-actions-v2 .task-btn-stop.btn-outline {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
    text-shadow: none !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,1) inset,
        0 0 0 1px rgba(148,163,184,0.25),
        0 3px 8px -3px rgba(15,23,42,0.10) !important;
}
body #app .task-actions-v2 .task-btn-stop.btn-outline:hover:not(:disabled),
body .task-actions-v2 .task-btn-stop.btn-outline:hover:not(:disabled) {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,1) inset,
        0 0 0 1px rgba(100,116,139,0.35),
        0 6px 14px -4px rgba(15,23,42,0.16) !important;
}

/* 6.4 ✏️ 编辑（蓝青渐变胶囊白字） */
body #app .task-actions-v2 .task-btn-edit,
body .task-actions-v2 .task-btn-edit {
    background: linear-gradient(135deg, #0ea5e9 0%, #06b6d4 55%, #14b8a6 100%) !important;
    background-image: linear-gradient(135deg, #0ea5e9 0%, #06b6d4 55%, #14b8a6 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.26) inset,
        0 0 0 1px rgba(6,182,212,0.46),
        0 0 0 3px rgba(6,182,212,0.10),
        0 10px 20px -8px rgba(6,182,212,0.40),
        0 4px 10px -2px rgba(14,165,233,0.26) !important;
}
body #app .task-actions-v2 .task-btn-edit:hover:not(:disabled),
body .task-actions-v2 .task-btn-edit:hover:not(:disabled) {
    box-shadow:
        0 1px 0 rgba(255,255,255,0.30) inset,
        0 0 0 1px rgba(6,182,212,0.58),
        0 0 0 4px rgba(6,182,212,0.14),
        0 14px 26px -8px rgba(6,182,212,0.50),
        0 6px 14px -2px rgba(14,165,233,0.32) !important;
}

/* 6.5 🗑 删除（红渐变胶囊白字 — 危险态） */
body #app .task-actions-v2 .task-btn-delete,
body .task-actions-v2 .task-btn-delete {
    background: linear-gradient(135deg, #f87171 0%, #ef4444 55%, #dc2626 100%) !important;
    background-image: linear-gradient(135deg, #f87171 0%, #ef4444 55%, #dc2626 100%) !important;
    background-color: transparent !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.24) inset,
        0 0 0 1px rgba(239,68,68,0.46),
        0 0 0 3px rgba(239,68,68,0.10),
        0 10px 20px -8px rgba(220,38,38,0.42),
        0 4px 10px -2px rgba(239,68,68,0.26) !important;
}
body #app .task-actions-v2 .task-btn-delete:hover:not(:disabled),
body .task-actions-v2 .task-btn-delete:hover:not(:disabled) {
    box-shadow:
        0 1px 0 rgba(255,255,255,0.28) inset,
        0 0 0 1px rgba(239,68,68,0.58),
        0 0 0 4px rgba(239,68,68,0.14),
        0 14px 26px -8px rgba(220,38,38,0.52),
        0 6px 14px -2px rgba(239,68,68,0.32) !important;
}

/* 6.6 小屏(≤640px)：按钮自动换行，gap 收紧，宽度均分或自适 */
@media (max-width: 640px) {
    body #app .task-actions-v2,
    body .task-actions-v2 {
        gap: 6px !important;
    }
    body #app .task-actions-v2 .task-btn-preview,
    body #app .task-actions-v2 .task-btn-stop,
    body #app .task-actions-v2 .task-btn-edit,
    body #app .task-actions-v2 .task-btn-delete,
    body .task-actions-v2 .task-btn-preview,
    body .task-actions-v2 .task-btn-stop,
    body .task-actions-v2 .task-btn-edit,
    body .task-actions-v2 .task-btn-delete {
        padding: 0 10px !important;
        font-size: 11.5px !important;
        flex: 1 1 45% !important;
        min-width: 0 !important;
    }
}