/* ============================================================
   上下文压缩器（默认插件）样式
   ------------------------------------------------------------
   入口按钮复用 .icon-btn，只加一点强调色；面板浮在聊天区右上。
   选择模式（body.cc-picking）下每条消息左侧出现勾选按钮。
   ============================================================ */

.icon-btn.ctx-compress-entry { color: #9fd3ff; }
.icon-btn.ctx-compress-entry.active { background: rgba(159, 211, 255, .18); box-shadow: 0 0 0 1px rgba(159, 211, 255, .4) inset; }

.cc-panel {
    position: absolute;
    top: 58px;
    right: 14px;
    z-index: 900;
    width: min(380px, calc(100% - 24px));
    max-height: calc(100% - 120px);
    overflow-y: auto;
    border: 1px solid #454a57;
    border-radius: 14px;
    background: linear-gradient(180deg, #2c2f38, #23262d);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .55);
    color: #dfe2ea;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.cc-panel.show { opacity: 1; visibility: visible; transform: none; transition: opacity .18s ease, transform .18s ease; }

.cc-head {
    position: sticky;
    top: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 13px;
    background: #2c2f38;
    border-bottom: 1px solid #3d424e;
    color: var(--accent-gold, #e6c78a);
    font-size: .95em;
    z-index: 2;
}
.cc-head b { flex: 1 1 auto; }
.cc-x {
    width: 24px; height: 24px;
    border: 0; border-radius: 6px;
    background: transparent; color: #9aa0b0;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.cc-x:hover { background: rgba(255, 255, 255, .1); color: #fff; }

.cc-body { padding: 12px 13px 14px; }
.cc-desc { margin: 0 0 8px; font-size: .78em; line-height: 1.7; color: #9aa0b0; }
.cc-desc b { color: var(--accent-gold, #e6c78a); }
.cc-count { margin: 0 0 12px; font-size: .78em; color: #8b90a0; }
.cc-count b { color: #9fd3ff; }

.cc-section {
    padding: 10px 0 12px;
    border-top: 1px dashed rgba(255, 255, 255, .1);
    margin-top: 4px;
}
.cc-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .84em;
    font-weight: 600;
    color: #cfd3de;
    margin-bottom: 8px;
}
.cc-toggle {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .86em;
    font-weight: 400;
    color: #9aa0b0;
    cursor: pointer;
}
.cc-field {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: .8em;
    color: #a7adbe;
    margin-bottom: 7px;
}
.cc-field input {
    width: 68px;
    padding: 5px 7px;
    border-radius: 6px;
    border: 1px solid #454a57;
    background: #32353f;
    color: #ececf1;
    font-size: .95em;
}
.cc-field input:focus { border-color: var(--accent-gold, #e6c78a); outline: none; }
.cc-field:last-of-type { margin-bottom: 8px; }
.cc-tip { margin: 0 0 8px; font-size: .74em; line-height: 1.65; color: #8b90a0; }
.cc-range-status {
    min-height: 1.5em;
    margin-bottom: 8px;
    padding: 6px 9px;
    border-radius: 7px;
    border: 1px dashed rgba(159, 211, 255, .35);
    background: rgba(159, 211, 255, .07);
    font-size: .76em;
    color: #a8d8ff;
}
.cc-panel .btn { margin-right: 6px; }
.cc-panel .btn:disabled { opacity: .45; cursor: not-allowed; }
.cc-adv { margin-top: 4px; border-top: 1px dashed rgba(255, 255, 255, .1); padding-top: 8px; }
.cc-adv > summary {
    cursor: pointer;
    list-style: none;
    font-size: .8em;
    color: #9aa0b0;
    display: flex; align-items: center; gap: 6px;
    user-select: none;
}
.cc-adv > summary::-webkit-details-marker { display: none; }
.cc-adv > summary:hover { color: var(--accent-gold, #e6c78a); }
.cc-prompt {
    width: 100%;
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid #454a57;
    background: #32353f;
    color: #ececf1;
    font-size: .78em;
    line-height: 1.7;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
}

/* ---------- 面板内消息清单（方式二） ---------- */
.cc-list {
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid #3d424e;
    border-radius: 9px;
    background: rgba(0, 0, 0, .22);
    padding: 4px;
    margin-bottom: 8px;
    scrollbar-width: thin;
}
.cc-list::-webkit-scrollbar { width: 7px; }
.cc-list::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .16); border-radius: 4px; }
.cc-row {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 4px 5px;
    border-radius: 6px;
    font-size: .76em;
    color: #b9becb;
    cursor: pointer;
}
.cc-row:hover { background: rgba(255, 255, 255, .06); }
.cc-row.is-picked { background: rgba(159, 211, 255, .13); color: #e2f0ff; }
.cc-row .cc-pick {
    flex: 0 0 auto;
    width: 22px; height: 22px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 6px;
    background: rgba(0, 0, 0, .25);
    color: #7d8496;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.05em;
}
.cc-row .cc-pick:hover { border-color: #9fd3ff; color: #9fd3ff; }
.cc-row.is-picked .cc-pick { border-color: #9fd3ff; background: rgba(159, 211, 255, .2); color: #9fd3ff; }
.cc-row .cc-idx { flex: 0 0 auto; width: 30px; text-align: right; color: #6d7385; font-variant-numeric: tabular-nums; }
.cc-row .cc-who { flex: 0 0 auto; width: 34px; font-weight: 600; }
.cc-row .cc-who.mine { color: #9fd3ff; }
.cc-row .cc-who.ai { color: var(--accent-gold, #e6c78a); }
.cc-row .cc-who.sys { color: #8b90a0; }
.cc-row .cc-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-empty { padding: 8px 6px; font-size: .78em; color: #8b90a0; text-align: center; margin: 0; }
.cc-mini-btn {
    margin-left: auto;
    height: 22px;
    padding: 0 8px;
    border-radius: 6px;
    border: 1px solid #454a57;
    background: transparent;
    color: #9aa0b0;
    font-size: .82em;
    cursor: pointer;
}
.cc-mini-btn:hover { color: var(--accent-gold, #e6c78a); border-color: var(--accent-gold, #e6c78a); }
/* 气泡压缩摘要：与普通系统消息区分开，一眼看出「这里被压过」 */
.bubble.ctx-summary-bubble {
    background: rgba(159, 211, 255, .09) !important;
    border: 1px dashed rgba(159, 211, 255, .45) !important;
    border-radius: 12px !important;
    width: 100%;
    max-width: 100% !important;
    box-sizing: border-box;
}
body.light-theme .bubble.ctx-summary-bubble { color: #2b3f57 !important; }
body.light-theme .cc-row .cc-pick { background: #fff; border-color: #d3c6b1; color: #8b8577; }
body.light-theme .cc-row.is-picked { background: rgba(60, 120, 200, .12); color: #22344a; }
body.light-theme .cc-list { background: rgba(0, 0, 0, .04); border-color: #e0d6c4; }
body.light-theme .cc-row { color: #4b5263; }
body.light-theme .cc-range-status { background: rgba(60, 120, 200, .08); border-color: rgba(60, 120, 200, .35); color: #2f6ea8; }
body.light-theme .ctx-summary-tag { color: #2f6ea8; }
body.light-theme .cc-mini-btn { color: #7a7266; border-color: #d3c6b1; }
body.light-theme .cc-list::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .18); }
body.light-theme .cc-prompt:focus { border-color: var(--accent-gold, #b8912f); }
.ctx-summary-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .82em;
    color: #9fd3ff;
    margin-bottom: 5px;
    letter-spacing: .03em;
}
.ctx-summary-meta { margin-top: 6px; font-size: .74em; color: #7f889c; }

/* 压缩摘要气泡（历史被折叠成一条） */
.message.is-ctx-summary { justify-content: center; }
.message.is-ctx-summary .message-content { max-width: 88%; align-items: center; }
.message.is-ctx-summary .nickname { display: none; }
.ctx-summary-tag {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: .74em;
    color: #9fd3ff;
    margin: 2px 0 4px;
    letter-spacing: .02em;
}

@media (max-width: 640px) {
    .cc-panel { top: 50px; right: 8px; left: 8px; width: auto; }
}

body.light-theme .cc-panel { background: linear-gradient(180deg, #fffdf9, #f6f1e7); border-color: #d3c6b1; color: #2b2f3a; }
body.light-theme .cc-head { background: #fffdf9; border-bottom-color: #e0d6c4; }
body.light-theme .cc-x { color: #7a7266; }
body.light-theme .cc-field input,
body.light-theme .cc-prompt { background: #fff; border-color: #d3c6b1; color: #2b2f3a; }
body.light-theme .cc-pick { background: rgba(255, 255, 255, .7); border-color: #cfc7b6; color: #8b8577; }