/* ============================================================
   css/chat/chat-countdown.css — 独立全屏倒计时（专注/锁机）
   与 chat-tasks.css 的 #countdown-float 无冲突（那是旧任务浮窗，不复用）。
   全部挂 #app 内（absolute），不撑满桌面宽屏；竖屏 #app{max-width:480px}。
   ============================================================ */

/* ============================ 全屏倒计时层 ============================ */
#countdown-overlay {
    position: absolute;
    inset: 0;
    z-index: 5000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    /* ★ 修复：--gradient-light-pool 本身就是一段 radial-gradient，之前被当成另一个
       渐变的颜色停靠点嵌套进去（radial-gradient(..., var(--gradient-light-pool), ...)），
       这在 CSS 里非法，导致整条 background 声明失效回退成 transparent——这就是倒计时
       「完全没有背景、直接透出后面消息」的根因。改为把光晕渐变作为独立层叠在底色上。 */
    background:
        var(--gradient-light-pool),
        var(--bg-chat);
    color: var(--text-primary);
    border-radius: inherit;   /* 桌面端跟随 #app 圆角 */
    -webkit-tap-highlight-color: transparent;
    font-family: var(--font-body);
}
[data-theme-mode="dark"] #countdown-overlay {
    background:
        radial-gradient(120% 80% at 50% 0%, rgba(212,184,184,0.06), transparent 60%),
        var(--bg-chat);
}

/* 微弱光晕，营造压迫感但不刺眼 */
#countdown-overlay .cd-ov-halo {
    position: absolute;
    left: 50%;
    top: 42%;
    width: 70%;
    max-width: 340px;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, var(--rose-light), transparent 66%);
    pointer-events: none;
    opacity: 0.9;
    filter: blur(6px);
}

/* 入场动画（一次性 class，animationend 后由 JS 移除，避免闪烁） */
#countdown-overlay.cd-ov--in {
    animation: cdOvIn 0.42s cubic-bezier(0.22, 0.61, 0.36, 1);
}
@keyframes cdOvIn {
    from { opacity: 0; transform: scale(1.045); }
    to   { opacity: 1; transform: scale(1); }
}
#countdown-overlay.cd-ov--out {
    animation: cdOvOut 0.24s ease-in;
    pointer-events: none;
}
@keyframes cdOvOut {
    from { opacity: 1; transform: scale(1); }
    to   { opacity: 0; transform: scale(0.985); }
}

/* 锁机模式：整页只有命令 + 大数字 + 进度条，无返回键 */
#countdown-overlay.cd-ov--locked .cd-ov-content { padding-top: 0; }

/* ============================ 内容区（顶部：命令 + 大数字 + 进度条） ============================ */
#countdown-overlay .cd-ov-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: calc(var(--header-height) + 26px) 24px 10px;
    width: 100%;
    max-width: 420px;
    flex-shrink: 0;
}

/* ============================ 本轮实时消息区 ============================ */
#countdown-overlay .cd-ov-feed {
    flex: 1;
    width: 100%;
    max-width: 420px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 18px 26px;
    -webkit-overflow-scrolling: touch;
}
#countdown-overlay .cd-ov-feed .cd-feed-msg {
    padding: 9px 13px;
    border-radius: 15px;
    font-size: 13.5px;
    line-height: 1.55;
    max-width: 82%;
    white-space: normal;
    word-break: break-word;
    animation: cdFeedIn 0.24s ease-out;
}
#countdown-overlay .cd-ov-feed .cd-feed-ai {
    align-self: flex-start;
    background: var(--surface-solid);
    border: 0.5px solid var(--border-faint);
    color: var(--text-primary);
    border-top-left-radius: 5px;
}
#countdown-overlay .cd-ov-feed .cd-feed-user {
    align-self: flex-end;
    background: var(--rose-light);
    color: var(--rose-dark);
    border-top-right-radius: 5px;
}
@keyframes cdFeedIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 小英文装饰（不承载功能） */
#countdown-overlay .cd-ov-kicker {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 13px;
    letter-spacing: 0.42em;
    text-transform: lowercase;
    color: var(--gold);
    opacity: 0.85;
    margin-bottom: 18px;
}

/* 任务命令 —— 醒目标题 */
#countdown-overlay .cd-ov-title {
    font-family: var(--font-reading);
    font-weight: 600;
    font-size: 30px;
    letter-spacing: 0.06em;
    line-height: 1.3;
    color: var(--text-primary);
    max-width: 88%;
}
#countdown-overlay .cd-ov-sub {
    font-size: 14px;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
    margin-top: 10px;
    margin-bottom: 26px;
}

/* ============================ 大数字 ============================ */
#countdown-overlay .cd-ov-timer {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(64px, 24vw, 128px);
    line-height: 0.94;
    letter-spacing: 0.01em;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    /* 底部一条极细横线，稳稳压住数字 */
    width: 100%;
    padding-bottom: 18px;
    min-height: 1em;
}
/* 小于 1 分钟：纯秒数并加大 */
#countdown-overlay .cd-ov-timer.cd-ov-timer--secs {
    font-size: clamp(96px, 40vw, 200px);
}
/* 每秒轻跳动画（一次性 class，animationend 后移除） */
#countdown-overlay .cd-ov-timer.cd-ov-timer--beat {
    animation: cdTimerBeat 0.26s ease-out;
}
@keyframes cdTimerBeat {
    0%   { transform: scale(1); }
    38%  { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* ============================ 底部进度条 ============================ */
#countdown-overlay .cd-ov-bar {
    position: relative;
    width: 100%;
    height: 3px;
    border-radius: var(--radius-full);
    background: var(--border-faint);
    overflow: hidden;
    margin-top: 6px;
}
#countdown-overlay .cd-ov-bar-fill {
    position: absolute;
    inset: 0;
    transform-origin: left center;
    transform: scaleX(0);
    border-radius: var(--radius-full);
    background: linear-gradient(90deg, var(--rose), var(--rose-dark));
    will-change: transform;
    transition: none;   /* 用 rAF 逐帧 update，不用 CSS 过渡 */
}
[data-theme-mode="dark"] #countdown-overlay .cd-ov-bar-fill {
    background: linear-gradient(90deg, var(--rose-light), var(--rose));
}

/* ============================ 放弃任务（不锁模式） ============================ */
#countdown-overlay .cd-ov-cancel {
    margin-top: 34px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 13px;
    letter-spacing: 0.12em;
    cursor: pointer;
    transition: color 0.16s ease;
    padding: 6px 10px;
}
@media (hover: hover) {
    #countdown-overlay .cd-ov-cancel:hover { color: var(--rose-hover); }
}

/* ============================ 结算面板（归零后强制选择） ============================ */
.cd-result-panel {
    width: 100%;
    max-width: 340px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    animation: cdResultIn 0.36s cubic-bezier(0.22, 0.61, 0.36, 1);
}
@keyframes cdResultIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}
.cd-result-kicker {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 13px;
    letter-spacing: 0.42em;
    color: var(--gold);
    opacity: 0.85;
    margin-bottom: 14px;
}
.cd-result-title {
    font-family: var(--font-reading);
    font-weight: 600;
    font-size: 24px;
    letter-spacing: 0.08em;
    color: var(--text-primary);
    margin-bottom: 6px;
}
.cd-result-command {
    font-size: 16px;
    color: var(--text-secondary);
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    max-width: 90%;
}
.cd-result-dur {
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.08em;
    margin-bottom: 26px;
}

/* 完成 / 未完成 两个按钮 */
.cd-result-btns {
    display: flex;
    gap: 12px;
    width: 100%;
}
.cd-result-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 18px 12px;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    font-size: 15px;
    letter-spacing: 0.08em;
    cursor: pointer;
    background: var(--surface-solid);
    box-shadow: var(--shadow-xs), var(--shadow-sm);
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, color 0.16s ease;
}
.cd-result-btn svg { width: 22px; height: 22px; }
.cd-result-btn:active { transform: scale(0.96); }

/* 完成 —— 鼠尾草/玫瑰，积极 */
.cd-result-btn--done {
    color: var(--rose-dark);
    background: var(--rose-light);
}
@media (hover: hover) {
    .cd-result-btn--done:hover { background: var(--bg-rose-warm); box-shadow: var(--shadow-sm), var(--shadow-glow); }
}
/* 未完成 —— 暖褐/低饱和 */
.cd-result-btn--undone {
    color: var(--text-secondary);
    background: var(--surface);
    border-color: var(--border-faint);
}
@media (hover: hover) {
    .cd-result-btn--undone:hover { color: var(--text-primary); box-shadow: var(--shadow-sm); }
}

/* 未完成时出现原因输入 */
.cd-result-note-wrap {
    width: 100%;
    margin-top: 20px;
    text-align: left;
}
.cd-result-note {
    width: 100%;
    box-sizing: border-box;
    min-height: 84px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--input-bg);
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-primary);
    resize: none;
    outline: none;
    transition: box-shadow 0.16s ease, border-color 0.16s ease;
}
.cd-result-note::placeholder { color: var(--text-muted); }
.cd-result-note:focus {
    border-color: var(--rose);
    box-shadow: var(--shadow-glow);
}

/* 提交我的说明 */
.cd-result-submit {
    width: 100%;
    margin-top: 14px;
    padding: 15px 20px;
    border: none;
    border-radius: var(--radius-md);
    background: var(--rose-dark);
    color: #FFF9F4;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.1em;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: var(--shadow-sm);
    transition: transform 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}
@media (hover: hover) {
    .cd-result-submit:hover { background: var(--rose-hover); box-shadow: var(--shadow-sm), var(--shadow-glow); }
}
.cd-result-submit:active { transform: scale(0.97); }

/* ============================ 不锁机：小浮窗（全局可见，可拖动） ============================ */
/* ★ 2028 甲方定：不管在哪个页面（设置/小窝/游戏/更多面板）都看得见，而且能拖着挪位置。
   所以用 position:fixed（挂 #app 内、不受切 tab 时 chat-view 被 display:none 影响），
   靠 left/right:0 + margin:auto + max-width 在手机上自然贴右边（14px）、桌面端不超出 480 手机框。
   拖动改的是 left/top（不碰 transform，免得和入场动画打架）。 */
#cd-float {
    position: fixed;
    top: calc(var(--safe-top, 0px) + var(--header-height) + 10px);
    right: 14px;
    z-index: 5001;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px 7px 12px;
    max-width: calc(100% - 28px);
    background: var(--surface);
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-full);
    box-shadow: var(--shadow-md);
    -webkit-tap-highlight-color: transparent;
    touch-action: none;          /* 拖动时不跟着滚页面 */
    cursor: grab;
}
#cd-float.cd-float--dragging { box-shadow: var(--shadow-lg); }
#cd-float.cd-float--in { animation: cdFloatIn 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); }
@keyframes cdFloatIn {
    from { opacity: 0; transform: translateY(-8px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
#cd-float .cd-float-body {
    display: flex;
    align-items: center;
    gap: 10px;
    border: none;
    background: transparent;
    padding: 2px 0;
    cursor: grab;
    min-width: 0;
}
#cd-float .cd-float-title {
    font-size: 13px;
    letter-spacing: 0.04em;
    color: var(--text-secondary);
    max-width: 130px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#cd-float .cd-float-num {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    min-width: 44px;
    text-align: right;
    line-height: 1;
}
#cd-float .cd-float-bar {
    width: 40px;
    height: 3px;
    border-radius: var(--radius-full);
    background: var(--border-faint);
    overflow: hidden;
}
#cd-float .cd-float-bar-fill {
    display: block;
    height: 100%;
    transform-origin: left center;
    transform: scaleX(0);
    background: linear-gradient(90deg, var(--rose), var(--rose-dark));
    will-change: transform;
}
#cd-float .cd-float-collapse {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: var(--accent-light);
    color: var(--accent);
    border-radius: var(--radius-full);
    cursor: pointer;
    transition: background 0.16s ease, color 0.16s ease;
    flex-shrink: 0;
}
#cd-float .cd-float-collapse svg { width: 14px; height: 14px; }
@media (hover: hover) {
    #cd-float:hover { box-shadow: var(--shadow-lg); }
    #cd-float .cd-float-collapse:hover { background: var(--accent-rose); color: #FFF9F4; }
}
/* 桌面/宽屏：贴住 480 手机框右边（#app 左右各留 (100%-480)/2） */
@media (min-width: 768px) {
    #cd-float { right: calc((100% - 480px) / 2 + 14px); }
}
/* 窄屏 <370px：内容收窄一点，别顶到边 */
@media (max-width: 369px) {
    #cd-float .cd-float-title { max-width: 88px; }
    #cd-float .cd-float-bar { width: 28px; }
}

/* ============================ 不锁机：聊天横幅（浮窗收起后） ============================ */
#cd-banner {
    position: absolute;
    top: calc(var(--header-height) + 8px);
    left: 14px;
    right: 14px;
    z-index: 5001;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    background: var(--surface);
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-xs), var(--shadow-sm);
    -webkit-tap-highlight-color: transparent;
}
#cd-banner.cd-banner--in { animation: cdBannerIn 0.26s cubic-bezier(0.22, 0.61, 0.36, 1); }
/* 只在聊天界面显示：切到别的 tab / 被「更多·游戏中心」全屏层盖住时收起（瞬时切换，不做动画防闪） */
#cd-banner.cd-banner--hide { display: none; }
@keyframes cdBannerIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
#cd-banner .cd-banner-body { display: flex; align-items: center; gap: 8px; cursor: pointer; min-width: 0; }
#cd-banner .cd-banner-label { font-size: 11px; letter-spacing: 0.08em; color: var(--gold); flex-shrink: 0; }
#cd-banner .cd-banner-title { font-size: 13px; color: var(--text-primary); max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cd-banner .cd-banner-num { font-family: var(--font-display); font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--rose-dark); flex-shrink: 0; }
#cd-banner .cd-banner-btn { width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border: none; background: var(--accent-light); color: var(--accent); border-radius: var(--radius-full); cursor: pointer; flex-shrink: 0; }
#cd-banner .cd-banner-btn svg { width: 14px; height: 14px; }
@media (hover: hover) { #cd-banner .cd-banner-btn:hover { background: var(--accent-rose); color: #FFF9F4; } }

/* 窄屏 <370px 适配：数字与间距微调 */
@media (max-width: 369px) {
    #countdown-overlay .cd-ov-title { font-size: 25px; }
    #countdown-overlay .cd-ov-timer { font-size: clamp(52px, 21vw, 96px); }
    #countdown-overlay .cd-ov-timer.cd-ov-timer--secs { font-size: clamp(74px, 36vw, 150px); }
    .cd-result-btn { padding: 15px 8px; }
    #countdown-overlay .cd-ov-feed { padding: 8px 14px 20px; }
    #countdown-overlay .cd-ov-feed .cd-feed-msg { max-width: 88%; }
}

/* 暗色模式：消息区气泡 */
[data-theme-mode="dark"] #countdown-overlay .cd-ov-feed .cd-feed-ai {
    background: rgba(255,255,255,0.06); border-color: rgba(120,110,100,0.18); color: var(--text-primary);
}
[data-theme-mode="dark"] #countdown-overlay .cd-ov-feed .cd-feed-user {
    background: var(--rose-light); color: var(--rose-dark);
}

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
    #countdown-overlay.cd-ov--in,
    #countdown-overlay.cd-ov--out,
    #countdown-overlay .cd-ov-timer.cd-ov-timer--beat,
    .cd-result-panel,
    #countdown-overlay .cd-ov-feed .cd-feed-msg,
    #cd-float { animation: none !important; }
}

/* ============================ 结算结果泡泡卡（renderCountdownResultCard 输出） ============================ */
.cdrc {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 340px;
    margin: 0 auto;
    padding: 16px 18px;
    background: linear-gradient(165deg, var(--surface-solid), var(--bg-chat));
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs), var(--shadow-sm);
    color: var(--text-primary);
}
.cdrc .cdrc-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.cdrc .cdrc-label {
    font-family: var(--font-reading);
    font-size: 13px;
    letter-spacing: 0.08em;
    color: var(--text-secondary);
}
.cdrc .cdrc-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 12px;
    letter-spacing: 0.06em;
    white-space: nowrap;
}
.cdrc .cdrc-badge svg { width: 13px; height: 13px; }
.cdrc .cdrc-badge--done { background: var(--sage-light); color: var(--sage); }
.cdrc .cdrc-badge--undone { background: var(--rose-light); color: var(--rose-hover); }
/* 到点没记录（她不在场，服务端自动收尾）：中性金，不带「没做到」的责备感 */
.cdrc .cdrc-badge--timeup { background: var(--accent-light); color: var(--gold); }
.cdrc .cdrc-command {
    font-family: var(--font-reading);
    font-weight: 600;
    font-size: 17px;
    letter-spacing: 0.05em;
    color: var(--text-primary);
}
.cdrc .cdrc-meta {
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.04em;
}
.cdrc .cdrc-note {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-secondary);
    border-top: 1px solid var(--border-faint);
    padding-top: 8px;
    margin-top: 2px;
}
.cdrc .cdrc-time {
    font-size: 11px;
    color: var(--text-muted);
    letter-spacing: 0.06em;
}
.cdrc.cdrc--undone .cdrc-command { color: var(--text-primary); }
.cdrc .cdrc-badge--abandon { background: var(--surface); color: var(--text-secondary); border: 1px solid var(--border-faint); }

/* ============================ 提前停止申请卡（renderCountdownEarlyStopCard 输出） ============================ */
/* 她端=卡片；他/系统视角=普通文字。窄屏 370px 也不溢出（长理由自动折行）。 */
.msg.countdown-earlystop-msg { justify-content: center; }
.msg.countdown-earlystop-msg .bubble.countdown-earlystop-bubble {
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
    width: 100%;
    max-width: 100%;
    align-self: center;
    cursor: default;
}
.msg.countdown-earlystop-msg .bubble.countdown-earlystop-bubble:hover { transform: none; box-shadow: none; }
[data-theme-mode="dark"] .msg.countdown-earlystop-msg .bubble.countdown-earlystop-bubble { background: none; border: none; }

.cdesc {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 340px;
    margin: 0 auto;
    min-width: 0;
    padding: 16px 18px;
    background: linear-gradient(165deg, var(--surface-solid), var(--bg-chat));
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs), var(--shadow-sm);
    color: var(--text-primary);
}
.cdesc .cdesc-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.cdesc .cdesc-label {
    font-family: var(--font-reading);
    font-size: 13px;
    letter-spacing: 0.08em;
    color: var(--text-secondary);
}
.cdesc .cdesc-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 12px;
    letter-spacing: 0.06em;
    white-space: nowrap;
}
.cdesc .cdesc-badge--wait { background: var(--rose-light); color: var(--rose-hover); }
.cdesc .cdesc-badge--done { background: var(--sage-light); color: var(--sage); }
.cdesc .cdesc-badge--abandon { background: var(--surface); color: var(--text-secondary); border: 1px solid var(--border-faint); }
.cdesc .cdesc-badge--reject { background: var(--rose-light); color: var(--rose-hover); }
.cdesc .cdesc-badge--none { background: var(--surface); color: var(--text-muted); border: 1px solid var(--border-faint); }
.cdesc .cdesc-command {
    font-family: var(--font-reading);
    font-weight: 600;
    font-size: 17px;
    letter-spacing: 0.05em;
    color: var(--text-primary);
    overflow-wrap: anywhere;
}
.cdesc .cdesc-reason {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-secondary);
    border-top: 1px solid var(--border-faint);
    padding-top: 8px;
    overflow-wrap: anywhere;
}
@media (max-width: 370px) {
    .cdesc { max-width: 100%; padding: 14px 14px; }
    .cdesc .cdesc-command { font-size: 16px; }
}

/* ============================ 不锁机：归零结算模态（非全屏） ============================ */
#cd-settle {
    position: absolute;
    inset: 0;
    z-index: 5100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0, 0, 0, 0.32);
    -webkit-tap-highlight-color: transparent;
}
#cd-settle.cd-settle--in { animation: cdSettleIn 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); }
@keyframes cdSettleIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}
#cd-settle .cd-settle-card {
    width: 100%;
    max-width: 340px;
    padding: 22px 20px;
    background: var(--surface-solid);
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md), var(--shadow-lg);
    text-align: center;
}

/* ============================ 提前停止申请（锁机/不锁机共用） ============================ */
#cd-earlystop {
    position: absolute;
    inset: 0;
    z-index: 5100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0, 0, 0, 0.32);
    -webkit-tap-highlight-color: transparent;
}
#cd-earlystop.cd-earlystop--in { animation: cdEsIn 0.24s ease-out; }
@keyframes cdEsIn { from { opacity: 0; } to { opacity: 1; } }
#cd-earlystop .cd-es-card {
    width: 100%;
    max-width: 340px;
    padding: 22px 20px;
    background: var(--surface-solid);
    border: 1px solid var(--border-faint);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md), var(--shadow-lg);
}
#cd-earlystop .cd-es-title { font-family: var(--font-reading); font-weight: 600; font-size: 19px; letter-spacing: 0.06em; color: var(--text-primary); margin-bottom: 10px; }
#cd-earlystop .cd-es-sub { font-size: 13px; line-height: 1.6; color: var(--text-secondary); margin-bottom: 14px; }
#cd-earlystop .cd-es-note {
    width: 100%;
    box-sizing: border-box;
    min-height: 84px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--input-bg);
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-primary);
    resize: none;
    outline: none;
    transition: box-shadow 0.16s ease, border-color 0.16s ease;
}
#cd-earlystop .cd-es-note::placeholder { color: var(--text-muted); }
#cd-earlystop .cd-es-note:focus { border-color: var(--rose); box-shadow: var(--shadow-glow); }
#cd-earlystop .cd-es-actions { display: flex; gap: 12px; margin-top: 16px; }
#cd-earlystop .cd-es-btn { flex: 1; padding: 14px 0; border: none; border-radius: var(--radius-md); font-size: 15px; letter-spacing: 0.1em; cursor: pointer; font-weight: 600; transition: transform 0.16s ease, background 0.16s ease; }
#cd-earlystop .cd-es-btn:active { transform: scale(0.97); }
#cd-earlystop .cd-es-cancel { background: var(--surface); color: var(--text-secondary); border: 1px solid var(--border-faint); }
#cd-earlystop .cd-es-submit { background: var(--rose-dark); color: #FFF9F4; box-shadow: var(--shadow-sm); }
@media (hover: hover) { #cd-earlystop .cd-es-submit:hover { background: var(--rose-hover); } }

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
    #cd-float.cd-float--in,
    #cd-banner.cd-banner--in,
    #cd-settle.cd-settle--in,
    #cd-earlystop.cd-earlystop--in { animation: none !important; }
}