/* ========================================
   LL织界 - 浅粉色/白色统一风格（高对比度版）
   仅修改：主屏幕、角色设置、设置弹窗、世界书弹窗、记忆弹窗
   禁止修改：主剧情界面及心声相关样式
   ======================================== */

/* ---------- 全局背景：浅粉白渐变，去除浅蓝色 ---------- */
.rp-home-page,
.rp-char-page,
.rp-cfg-ov,
.rp-worldbook-ov,
.rp-memory-ov {
  background-color: #fff5f8 !important;
}

/* ---------- 1. 主屏幕 ---------- */
.rp-home-icon {
  transition: all 0.2s cubic-bezier(0.2, 0.9, 0.4, 1.1) !important;
}
.rp-home-icon:hover {
  transform: translateY(-4px) !important;
}
.rp-home-icon-name {
  color: #ffffff !important;
  font-weight: 600 !important;
}
.rp-home-icon-desc {
  color: #a07080 !important;
}

/* ---------- 2. 角色设置页面 ---------- */
.rp-char-card {
  background: #ffffff !important;
  border: 1px solid #ffe0ec !important;
  box-shadow: 0 4px 12px rgba(255, 150, 180, 0.06) !important;
}
.rp-char-card-title {
  color: #b05070 !important;
}
.rp-char-mem-btn {
  background: #fff0f5 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
  transition: all 0.2s ease !important;
}
.rp-char-mem-btn:hover {
  transform: translateY(-2px) !important;
  background: #ffe8f0 !important;
  box-shadow: 0 8px 18px rgba(255, 150, 180, 0.12) !important;
}

/* 输入框 */
.rp-char-page .rp-fi input,
.rp-char-page .rp-fi textarea,
.rp-cfg-ov .rp-fi input,
.rp-cfg-ov .rp-fi textarea {
  background: #ffffff !important;
  border: 1px solid #ffd8e8 !important;
  color: #5a4a60 !important;
}
.rp-char-page .rp-fi input:focus,
.rp-char-page .rp-fi textarea:focus,
.rp-cfg-ov .rp-fi input:focus,
.rp-cfg-ov .rp-fi textarea:focus {
  border-color: #ffb0c8 !important;
  box-shadow: 0 0 0 3px rgba(255, 176, 200, 0.2) !important;
}

/* 主要按钮（浅粉渐变） */
.rp-add-btn,
.rp-save-user-btn,
.rp-ci-save-btn,
.rp-save-char-btn,
.rp-cfg-save,
.rp-cfg-btns button,
.rp-worldbook-actions button,
.rp-savepoint-load-btn,
.rp-next-btn,
.rp-worldbook-add {
  background: linear-gradient(135deg, #ffe8f0, #ffd8e8) !important;
  border: none !important;
  color: #b05070 !important;
  box-shadow: 0 4px 10px rgba(255, 150, 180, 0.12) !important;
  transition: all 0.2s ease !important;
}
.rp-add-btn:hover,
.rp-save-user-btn:hover,
.rp-ci-save-btn:hover,
.rp-save-char-btn:hover,
.rp-cfg-save:hover,
.rp-cfg-btns button:hover,
.rp-worldbook-actions button:hover,
.rp-savepoint-load-btn:hover,
.rp-next-btn:hover,
.rp-worldbook-add:hover {
  transform: translateY(-2px) !important;
  background: linear-gradient(135deg, #ffd8e8, #ffc8d8) !important;
  box-shadow: 0 10px 22px rgba(255, 150, 180, 0.2) !important;
}
.rp-add-btn:active,
.rp-save-user-btn:active,
.rp-ci-save-btn:active,
.rp-save-char-btn:active,
.rp-cfg-save:active,
.rp-cfg-btns button:active,
.rp-worldbook-actions button:active,
.rp-savepoint-load-btn:active,
.rp-next-btn:active,
.rp-worldbook-add:active {
  transform: translateY(0) scale(0.98) !important;
}

/* 删除/次要按钮 */
.rp-del-preset-btn,
.rp-savepoint-del-btn {
  background: #fff5f8 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b07080 !important;
}
.rp-del-preset-btn:hover,
.rp-savepoint-del-btn:hover {
  transform: translateY(-2px) !important;
  background: #ffe8f0 !important;
  box-shadow: 0 6px 14px rgba(255, 150, 180, 0.1) !important;
}

/* 预设卡片 */
.rp-preset-card {
  background: #fff5f8 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
}
.rp-preset-card:hover {
  background: #ffe8f0 !important;
  transform: translateY(-1px) !important;
}

/* 折叠条 */
.rp-cfg-fold-header {
  background: #fff5f8 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
}
.rp-cfg-fold-header:hover {
  background: #ffe8f0 !important;
  transform: translateY(-1px) !important;
}

/* 设置弹窗内部 */
.rp-cfg-ov .rp-cfg-s {
  background: #ffffff !important;
  border: 1px solid #ffd8e8 !important;
}
.rp-cfg-ov .rp-cfg-st {
  color: #b05070 !important;
}
.rp-cfg-ov label {
  color: #b07080 !important;
}
.rp-cfg-tip {
  color: #a07080 !important;
}

/* 3. 世界书弹窗 */
.rp-worldbook-folder-header {
  background: #fff5f8 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
}
.rp-worldbook-item {
  background: #ffffff !important;
  border: 1px solid #ffd8e8 !important;
}
.rp-worldbook-item-title {
  color: #b05070 !important;
}
.rp-worldbook-tag {
  background: #fff0f5 !important;
  color: #b05070 !important;
}

/* ========== 4. 剧场记忆弹窗（重点优化） ========== */
/* 标签页 */
.rp-mem-tab {
  color: #b07080 !important;
}
.rp-mem-tab.active {
  background: linear-gradient(135deg, #ffd8e8, #ffc8d8) !important;
  color: #a03060 !important; /* 深色文字，高对比 */
  border-bottom: 2px solid #ff90b0 !important;
}
/* 剧场卡片 */
.rp-memory-item {
  background: #ffffff !important;
  border: 1px solid #ffe0ec !important;
}
.rp-memory-item-title {
  color: #b05070 !important;
  font-weight: 600 !important;
}
.rp-memory-item-event {
  color: #a07080 !important;
}
.rp-memory-info {
  color: #a07080 !important;
}

/* 统一“进入”和“更多”按钮样式 */
.rp-memory-actions .rp-theater-enter-btn,
.rp-memory-actions .rp-theater-more-btn {
  background: #fff0f5 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
  transition: all 0.2s ease !important;
}
.rp-memory-actions .rp-theater-enter-btn:hover,
.rp-memory-actions .rp-theater-more-btn:hover {
  transform: translateY(-2px) !important;
  background: #ffe8f0 !important;
  box-shadow: 0 6px 14px rgba(255, 150, 180, 0.12) !important;
}
.rp-memory-actions .rp-theater-enter-btn:active,
.rp-memory-actions .rp-theater-more-btn:active {
  transform: translateY(0) scale(0.98) !important;
}

/* 剧场列表更多菜单样式 */
.rp-theater-more-menu {
  z-index: 9999 !important;
}
.rp-theater-more-menu button {
  background: #ffffff !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
  margin: 4px 0 !important;
  padding: 10px 12px !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  text-align: left !important;
  display: block !important;
  width: 100% !important;
  pointer-events: auto !important;
}
.rp-theater-more-menu button:hover {
  background: #ffe8f0 !important;
  transform: translateX(4px) !important;
  border-color: #ffb0c8 !important;
}
.rp-theater-more-menu button:active {
  transform: scale(0.98) !important;
}

/* 存档列表中的按钮 */
.rp-savepoint-load-btn,
.rp-savepoint-del-btn,
.rp-savepoint-folder-btn {
  background: #fff0f5 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
}
.rp-savepoint-load-btn:hover,
.rp-savepoint-del-btn:hover,
.rp-savepoint-folder-btn:hover {
  transform: translateY(-2px) !important;
  background: #ffe8f0 !important;
}
.rp-savepoint-folder-btn.active {
  background: linear-gradient(135deg, #ffd8e8, #ffc8d8) !important;
  color: #a03060 !important;
}

/* 日记收藏卡片按钮 */
.rp-favorite-read,
.rp-favorite-edit,
.rp-favorite-del {
  background: #fff0f5 !important;
  border: 1px solid #ffd0e0 !important;
  color: #b05070 !important;
}
.rp-favorite-read:hover,
.rp-favorite-edit:hover,
.rp-favorite-del:hover {
  transform: translateY(-2px) !important;
  background: #ffe8f0 !important;
}

/* ========== 5. 清空所有图片按钮（改为浅粉色） ========== */
#rp-clear-all-images-cfg,
#rp-clear-all-images-mem,
.rp-clear-all-images-btn {
  background: linear-gradient(135deg, #ffe8f0, #ffd8e8) !important;
  border: none !important;
  color: #b05070 !important;
  box-shadow: 0 4px 10px rgba(255, 150, 180, 0.12) !important;
  transition: all 0.2s ease !important;
}
#rp-clear-all-images-cfg:hover,
#rp-clear-all-images-mem:hover,
.rp-clear-all-images-btn:hover {
  transform: translateY(-2px) !important;
  background: linear-gradient(135deg, #ffd8e8, #ffc8d8) !important;
  box-shadow: 0 8px 18px rgba(255, 150, 180, 0.2) !important;
}
#rp-clear-all-images-cfg:active,
#rp-clear-all-images-mem:active,
.rp-clear-all-images-btn:active {
  transform: translateY(0) scale(0.98) !important;
}

/* 确保所有交互元素有平滑反馈 */
button, .rp-clickable, .rp-preset-card, .rp-home-icon, .rp-char-mem-btn {
  -webkit-tap-highlight-color: transparent;
}

/* 增强文字对比度：深粉/暗粉文字 */
.rp-char-card-title,
.rp-preset-card-name,
.rp-mem-tab.active,
.rp-worldbook-item-title,
.rp-memory-item-title,
.rp-cfg-st,
.rp-cfg-ov-title,
.rp-char-mem-btn,
.rp-theater-enter-btn,
.rp-theater-more-btn,
.rp-savepoint-load-btn,
.rp-favorite-read {
  color: #a03060 !important; /* 深玫瑰色，高对比 */
}
.rp-home-icon-desc,
.rp-memory-info,
.rp-worldbook-item-content,
.rp-cfg-tip,
.rp-preset-label {
  color: #9a6a7a !important;
}

/* 移除任何蓝色残留 */
.rp-container.theme-setup,
.rp-cfg-ov,
.rp-worldbook-ov,
.rp-memory-ov,
.rp-char-page,
.rp-home-page {
  background-color: #fff5f8 !important;
}

/* ========================================
   剧场剧情界面 - “更多”菜单美化（浅粉色/白色风格）
   作用于 #rp-more-menu 与 #rp-wallpaper-menu 及其内部按钮
   ======================================== */

/* 菜单容器 */
#rp-more-menu,
#rp-wallpaper-menu {
  background: #ffffff !important;
  border-radius: 16px !important;
  padding: 8px !important;
  min-width: 160px !important;
  box-shadow: 0 8px 24px rgba(160, 100, 120, 0.15), 0 2px 6px rgba(0, 0, 0, 0.05) !important;
  border: 1px solid #ffd8e8 !important;
  backdrop-filter: blur(2px) !important;
}

/* 菜单项按钮 - 统一卡片样式 */
#rp-more-menu .rp-more-item,
#rp-wallpaper-menu .rp-more-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 14px !important;
  margin: 4px 0 !important;
  border-radius: 12px !important;
  background: #fff5f8 !important;
  border: 1px solid #ffe0ec !important;
  color: #b05070 !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

/* 悬停效果（桌面端） */
#rp-more-menu .rp-more-item:hover,
#rp-wallpaper-menu .rp-more-item:hover {
  background: #ffe8f0 !important;
  border-color: #ffb0c8 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 10px rgba(255, 150, 180, 0.15) !important;
}

/* 点击效果（所有设备） */
#rp-more-menu .rp-more-item:active,
#rp-wallpaper-menu .rp-more-item:active {
  transform: scale(0.98) !important;
  transition: transform 0.05s ease !important;
  background: #ffd8e8 !important;
}

/* 确保手机端触摸区域舒适 */
#rp-more-menu .rp-more-item,
#rp-wallpaper-menu .rp-more-item {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* 可选：图标与文字间距微调（保留原有emoji或文字） */
#rp-more-menu .rp-more-item span,
#rp-more-menu .rp-more-item svg,
#rp-wallpaper-menu .rp-more-item span,
#rp-wallpaper-menu .rp-more-item svg {
  margin-right: 4px;
}
/* 剧场加载进度条专用弹窗 */
.rp-loading-progress{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,245,248,0.92);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100000;transition:all .2s ease}
.rp-loading-progress-card{background:#ffffff;border-radius:24px;padding:28px 32px;min-width:280px;text-align:center;box-shadow:0 20px 35px -10px rgba(200,100,120,0.25);border:1px solid #ffd8e8}
.rp-loading-progress-title{font-size:1.25rem;font-weight:700;color:#b05070;margin-bottom:20px;letter-spacing:1px}
.rp-loading-progress-bar-wrap{width:100%;height:8px;background:#ffe8f0;border-radius:12px;overflow:hidden;margin:20px 0 12px 0;box-shadow:inset 0 1px 2px rgba(0,0,0,0.02)}
.rp-loading-progress-bar{width:0%;height:100%;background:linear-gradient(90deg,#ffb0c8,#ff80a0);border-radius:12px;transition:width .25s cubic-bezier(.2,.9,.4,1.1);box-shadow:0 0 6px rgba(255,128,160,0.4)}
.rp-loading-progress-text{font-size:.85rem;color:#a07080;margin-top:12px;font-weight:500}

/* 壁纸模式下：通过 --rp-msg-opacity 变量控制消息框背景透明度（0~1），文字颜色不受影响 */
#rp-page-main.rp-wallpaper-mode .rp-cc,
#rp-page-main.rp-wallpaper-mode .rp-uc,
#rp-page-main.rp-wallpaper-mode .rp-scene,
#rp-page-main.rp-wallpaper-mode .rp-npc {
  background-image: none !important;
  background-color: rgba(255,248,250, var(--rp-msg-opacity, 1)) !important;
  border-color: rgba(200, 150, 170, calc(0.55 * var(--rp-msg-opacity, 1))) !important;
  box-shadow: 0 2px 8px rgba(150,100,120, calc(0.15 * var(--rp-msg-opacity, 1))) !important;
  /* perf: removed transition here - fired on every bubble on each opacity slider tick and on each story relayout, very expensive in long stories */
}
#rp-page-main.rp-wallpaper-mode .rp-cc .rp-quote,
#rp-page-main.rp-wallpaper-mode .rp-uc .rp-quote,
#rp-page-main.rp-wallpaper-mode .rp-scene .rp-quote,
#rp-page-main.rp-wallpaper-mode .rp-npc .rp-quote {
  background: rgba(255,200,210, calc(0.4 * var(--rp-msg-opacity, 1))) !important;
}
#rp-page-main.rp-wallpaper-mode .rp-options-wrap{
  background: rgba(255,255,255, var(--rp-options-bg-opacity, var(--rp-options-opacity, 1))) !important;
  border-top-color: rgba(180,150,165, calc(0.6 * var(--rp-options-bg-opacity, var(--rp-options-opacity, 1)))) !important;
}
#rp-page-main.rp-wallpaper-mode .rp-opt-btn{
  background: rgba(255,255,255, var(--rp-options-box-opacity, var(--rp-options-opacity, 1))) !important;
  border-color: rgba(180,150,165, calc(0.65 * var(--rp-options-box-opacity, var(--rp-options-opacity, 1)))) !important;
}
#rp-page-main.rp-wallpaper-mode .rp-main-title,
#rp-page-main.rp-wallpaper-mode .rp-scene,
#rp-page-main.rp-wallpaper-mode .rp-scene-content,
#rp-page-main.rp-wallpaper-mode .rp-uc-text,
#rp-page-main.rp-wallpaper-mode .rp-cc-text,
#rp-page-main.rp-wallpaper-mode .rp-npc-text,
#rp-page-main.rp-wallpaper-mode .rp-cc-hint,
#rp-page-main.rp-wallpaper-mode .rp-edit-btn,
#rp-page-main.rp-wallpaper-mode .rp-del-btn,
#rp-page-main.rp-wallpaper-mode .rp-opt-btn,
#rp-page-main.rp-wallpaper-mode #rp-hn,
#rp-page-main.rp-wallpaper-mode #rp-hm,
#rp-page-main.rp-wallpaper-mode #rp-ht{
  color:#000 !important;
}
#rp-page-main.rp-wallpaper-mode .rp-msg-selected{
  background-color: rgba(0,0,0,0.35) !important;
  border-color: rgba(255,96,128,0.95) !important;
}
#rp-page-main.rp-batch-del-mode .rp-voice-container,
#rp-page-main.rp-batch-del-mode .rp-voice-btn{
  pointer-events:none !important;
  opacity:.45 !important;
}

/* 世界书绑定列表中的复选框样式 */
.rp-worldbook-checkbox-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    margin: 4px 0;
    background: rgba(255,255,255,0.9);
    border-radius: 8px;
    border: 1px solid #ffe0ec;
    transition: all 0.2s;
}
.rp-worldbook-checkbox-item:hover {
    background: #fff5f8;
    transform: translateX(2px);
}
.rp-worldbook-checkbox-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: #d05090;
}
.rp-worldbook-checkbox-item label {
    flex: 1;
    font-size: 0.85rem;
    color: #b05070;
    cursor: pointer;
    margin: 0;
}

/* 优化世界书绑定列表滚动条样式 */
#rp-char-worldbook-list {
    scrollbar-width: thin;
    scrollbar-color: #ffb0c8 #ffe8f0;
    overflow-x: hidden;
}
#rp-xuverse-worldbook-list {
    scrollbar-width: thin;
    scrollbar-color: #d0c0d0 #f0e8f0;
    overflow-x: hidden;
}
#rp-char-worldbook-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
#rp-char-worldbook-list::-webkit-scrollbar-track {
    background: #ffe8f0;
    border-radius: 4px;
}
#rp-char-worldbook-list::-webkit-scrollbar-thumb {
    background: #ffb0c8;
    border-radius: 4px;
}
#rp-char-worldbook-list::-webkit-scrollbar-thumb:hover {
    background: #ff90b0;
}
#rp-xuverse-worldbook-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
#rp-xuverse-worldbook-list::-webkit-scrollbar-track {
    background: #f0e8f0;
    border-radius: 4px;
}
#rp-xuverse-worldbook-list::-webkit-scrollbar-thumb {
    background: #d0c0d0;
    border-radius: 4px;
}
#rp-xuverse-worldbook-list::-webkit-scrollbar-thumb:hover {
    background: #b0a0b0;
}

/* 防止列表项内容过长导致水平滚动条 */
.rp-worldbook-checkbox-item {
    white-space: normal !important;
    word-break: break-word;
}
.rp-worldbook-checkbox-item label {
    flex: 1;
    word-break: break-word;
    white-space: normal;
}

/* === Phase 1: 视频背景层 === */
/* 视频激活时给容器隔离 stacking 上下文，防止 z-index:-1 沉到页面之下 */
#rp-page-main.rp-video-bg-active {
    isolation: isolate;
}
/* 剧场背景视频：z-index:-1 沉到所有 static 兄弟节点之下，自身仍在 #rp-page-main 内部 */
#rp-page-main > video.rp-video-bg#rp-video-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
    pointer-events: none;
    background: #000;
}
/* 宇宙背景视频：盖在 #rp-xuverse-bg-layer 的 backgroundImage 之上 */
#rp-xuverse-bg-layer > video.rp-video-bg#rp-xuverse-video-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    background: transparent;
}

/* ---------- 电台专属：新建/设置/主页 改为纯白背景 ---------- */
#rp-page-radio,
#rp-radio-new-ov,
#rp-radio-cfg-ov {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* ============================================================
   长剧情性能优化（A+B 阶段）
   目的：当 #rp-story 内消息数量很多时，输入框打字与选项弹窗
   展开/收起不再卡顿。所有规则用 !important 覆盖 styles/app.css
   原有声明，不修改 app.css 原文。
   ============================================================ */

/* [改动 2] 用 CSS containment 切断输入区/选项区与 .rp-story 的布局耦合。
   它们的高度/内容变化不再触发 .rp-story 内 N 条消息的重排。
   注意：这里不改 position（保持现有 flex 列布局），仅声明 contain。 */
#rp-page-main .rp-input-area,
#rp-page-main .rp-options-wrap {
  contain: layout style paint !important;
}

/* [改动 1] 选项弹窗展开/收起：为容器加 contain，
   并将 .rp-options 自己也变成包含块，避免动画过程中影响外部布局。
   同时缩短 transition 时间，加 will-change 提示合成器单独提层。 */
#rp-page-main .rp-options {
  transition: max-height .2s ease !important;
  will-change: max-height;
  contain: layout style paint;
}

/* [改动 3] 移除发送/回复按钮的 backdrop-filter。
   它们贴在很高的 .rp-story 上方，每次后方内容变动（含每次按键的
   reflow）都会强制重新栅格化模糊背景，是长剧情下的主要绘制成本。 */
#rp-page-main .rp-reply-btn,
#rp-page-main .rp-send-btn {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(255,255,255,0.55) !important;
}

/* [改动 4] 把 `transition: all` 改为显式属性列表，
   避免合成器为每个 .rp-quote / .rp-del-btn / .rp-cc-hint
   监听所有 CSS 属性变化（长剧情下数量很多）。 */
.rp-quote {
  transition: background-color .2s ease, filter .2s ease, transform .15s ease !important;
}
.rp-del-btn,
.rp-edit-btn {
  transition: background-color .2s ease, opacity .2s ease, transform .15s ease, filter .2s ease !important;
}
.rp-cc-hint {
  transition: opacity .2s ease, color .2s ease, transform .15s ease !important;
}

/* [改动 6] 给每条历史消息容器加 content-visibility:auto。
   视口外的气泡跳过渲染（布局/绘制），是 #rp-story 的"穷人虚拟化"。
   contain-intrinsic-size 给浏览器一个高度占位估值，避免滚动跳动。
   注意：不会影响 DOM 结构、选择器、JS 行为，仅渲染层优化。 */
#rp-story .rp-cc,
#rp-story .rp-uc,
#rp-story .rp-scene,
#rp-story .rp-npc {
  content-visibility: auto;
  contain-intrinsic-size: auto 120px;
}