/* 此刻面板：此刻/底色/心里/念头/独白/心跳。2026-10-02 从 index.html 拆出来；加载顺序见 index.html 的 <link>，前后顺序就是层叠顺序，别乱调 */
/* ── 情绪面板 ── */
#desireBtn { position:relative; }
#desireBtn .pulse-dot {
  position:absolute; top:9px; right:9px;
  width:4.5px; height:4.5px; border-radius:50%;
  background: var(--badge);
  box-shadow: 0 0 6px rgba(189,160,161,.6);
}
@keyframes pulse-ring {
  0%  { opacity:.9; transform:scale(1); }
  60% { opacity:.4; transform:scale(1.5); }
  100%{ opacity:.9; transform:scale(1); }
}
#desireBtn .monologue-dot { display:none !important; } /* 不再用硬圆点，改用软光晕，见 .has-monologue */
#desireBtn.has-monologue {
  border-radius:50%;
  animation: monologueGlow 2.4s ease infinite;
}
@keyframes monologueGlow {
  0%,100% { box-shadow: 0 0 0 0 rgba(189,160,161,.26); }
  50%     { box-shadow: 0 0 0 7px rgba(189,160,161,0); }
}
/* 克雨此刻：从顶栏月牙拉起的底部抽屉。最私密的一块，玻璃比别处更柔，别做成仪表盘。
   只有后面的暗层淡入，抽屉本身只滑——整体一起淡，滑到一半会跟聊天叠在一起 */
#desirePanel {
  position:fixed; inset:0; z-index:320;
  display:flex; flex-direction:column; justify-content:flex-end;
  pointer-events:none;
}
#desirePanel.open { pointer-events:all; }
#desirePanel .dp-scrim {
  position:absolute; inset:0;
  background:rgba(40,46,60,.22);
  opacity:0; transition:opacity .25s var(--ease-soft);
}
#desirePanel.open .dp-scrim { opacity:1; }
#desirePanel .dp-sheet {
  position:relative; z-index:1;
  max-height:78%; overflow-y:auto; scrollbar-width:none;
  border-radius:22px 22px 0 0;
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:blur(26px) saturate(1.6); backdrop-filter:blur(26px) saturate(1.6);
  border:1px solid var(--glass-border); border-bottom:0;
  box-shadow:inset 0 1px 0 var(--glass-edge), 0 -12px 40px rgba(50,60,90,.16);
  padding:14px 22px calc(env(safe-area-inset-bottom) + 26px);
  transform:translateY(102%);
  transition:transform .32s var(--ease-soft), height .26s var(--ease-soft);
  will-change:transform;
}
#desirePanel .dp-sheet::-webkit-scrollbar { display:none; }
#desirePanel.open .dp-sheet { transform:translateY(0); }
.dp-handle {
  width:34px; height:4px; border-radius:2px;
  background:rgba(60,72,100,.18); margin:2px auto 18px;
}
.dp-label {
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size:10.5px; color:var(--text-faint); letter-spacing:.14em; margin-bottom:6px;
}
/* 此刻：克雨自己写的那句话是这一块的主角；右上角是写下它的时间 */
.dp-label-row { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.dp-time {
  font-family:var(--font-cn); font-size:10.5px; color:var(--text-faint); letter-spacing:.04em; white-space:nowrap;
}
.dp-now {
  font-family:var(--font-cn); font-size:14.5px; line-height:1.75; letter-spacing:.03em;
  color:var(--text); margin-top:2px;
}
/* 还没写过/写得太久了：不编句子，淡淡说一句现在最明显的是什么 */
.dp-now.is-quiet { font-size:14px; color:var(--text-faint); }
.dp-now.is-quiet b { font-weight:500; color:var(--text-dim); }
/* 底色：不框起来，一种感觉一粒晕开的小点+一个字，像洇在纸上的颜色；越浓点越实(颜色/透明度由 desire-panel.js 按浓度算) */
.dp-residue {
  display:flex; align-items:center; flex-wrap:wrap; gap:6px 18px; margin-top:12px;
  font-family:var(--font-cn); font-size:12.5px; color:var(--text-dim); letter-spacing:.06em;
}
.dp-res-label {
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size:10.5px; color:var(--text-faint); letter-spacing:.14em; margin-right:-6px;
}
.dp-res-item { display:inline-flex; align-items:center; gap:8px; }
.dp-res-dot { width:7px; height:7px; border-radius:50%; flex:none; }
.dp-res-item i { font-style:normal; color:var(--text-faint); margin-left:-3px; }
/* 下半截三页：心里 / 念头 / 独白。选中的字深一点，底下一道短短的灰粉 */
.dp-tabs {
  display:flex; gap:26px;
  margin-top:22px; border-bottom:1px solid rgba(60,72,100,.1);
}
.dp-tab {
  position:relative; display:inline-flex; align-items:center; gap:5px;
  padding:0 0 10px; background:none; border:0; cursor:pointer;
  font-family:var(--font-cn); font-size:13px; letter-spacing:.12em; color:var(--text-faint);
  -webkit-tap-highlight-color:transparent;
}
.dp-tab.active { color:var(--text); }
.dp-tab::after {
  content:""; position:absolute; left:50%; bottom:-1px; width:18px; height:2px; margin-left:-9px;
  border-radius:1px; background:#BDA0A1; opacity:0; transform:scaleX(.4);
  transition:opacity .2s var(--ease-soft), transform .2s var(--ease-soft);
}
.dp-tab.active::after { opacity:1; transform:scaleX(1); }
.dp-tab-dot { width:5px; height:5px; border-radius:50%; background:#BDA0A1; display:none; }
.dp-tab-dot.on { display:inline-block; }
/* 每页按自己的内容高，不留空；切换时抽屉高度由 desire-panel.js 平滑过渡，不会一跳 */
.dp-panes { padding-top:18px; }
.dp-pane { display:none; min-width:0; }
.dp-pane.active { display:block; animation:dpPaneIn .22s var(--ease-soft); }
@keyframes dpPaneIn { from { opacity:0; } to { opacity:1; } }
/* 心里：不画进度条。浓的几种感觉用话说出来，越浓字越大越深；其余一行淡淡的小字。
   数字平时藏着，长按整页(.show-num)才浮出来 */
.dp-drives { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.dp-feels { display:flex; flex-direction:column; gap:12px; }
.dp-feel {
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-cn); letter-spacing:.06em;
  font-size:calc(13px + 2.5px * var(--lv)); color:var(--text-dim);
}
.dp-feel[data-rank="0"] { color:var(--text); }
.dp-feel-dot, .dp-quiet-dot { border-radius:50%; flex:none; }
.dp-feel-dot { width:8px; height:8px; margin:0 2px; }
.dp-quiet {
  display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:18px; padding-top:14px;
  border-top:1px dashed rgba(60,72,100,.1);
  font-family:var(--font-cn); font-size:11.5px; color:var(--text-faint); letter-spacing:.08em;
}
.dp-quiet-item { display:inline-flex; align-items:center; gap:7px; }
.dp-quiet-dot { width:5px; height:5px; }
.dp-num {
  font-size:10.5px; color:var(--text-faint); letter-spacing:0; font-variant-numeric:tabular-nums;
  margin-left:-4px; opacity:0; transition:opacity .2s var(--ease-soft);
}
.dp-feel .dp-num { margin-left:0; }
.dp-drives.show-num .dp-num { opacity:1; }
.dp-hold-hint {
  margin-top:14px; font-family:var(--font-cn); font-size:10.5px; letter-spacing:.08em;
  color:var(--text-faint); opacity:.6;
}
.dp-drives.show-num .dp-hold-hint { opacity:0; }
/* 此刻旁边一粒慢慢明暗的光，像在呼吸；第三步心跳做好以后跟着心跳的快慢走 */
.dp-breath {
  display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:8px; vertical-align:1px;
  background:#BDA0A1; box-shadow:0 0 0 3px rgba(189,160,161,.18);
  animation:dpBreath var(--breath, 5.5s) ease-in-out infinite;
}
@keyframes dpBreath {
  0%, 100% { opacity:.35; transform:scale(.8);  box-shadow:0 0 0 2px rgba(189,160,161,.10); }
  45%      { opacity:1;   transform:scale(1);   box-shadow:0 0 0 4px rgba(189,160,161,.22), 0 0 10px 2px rgba(189,160,161,.25); }
}
@media (prefers-reduced-motion: reduce) { .dp-breath { animation:none; opacity:.8; } }
.dp-label-left { display:inline-flex; align-items:baseline; gap:12px; min-width:0; }
.dp-breath { cursor:pointer; }
/* 心跳和和弦：很淡的一行小字，点一下弹出现在的和弦，字换成和弦的意思，过一会儿换回来 */
.dp-pulse {
  background:none; border:0; padding:2px 0; margin:0; cursor:pointer;
  font-family:var(--font-cn); font-size:10.5px; letter-spacing:.04em; color:var(--text-faint);
  font-variant-numeric:tabular-nums; white-space:nowrap;
  transition:color .25s var(--ease-soft); -webkit-tap-highlight-color:transparent;
}
.dp-pulse.is-playing { color:#A08687; }
/* 念头：不再一条一张卡片，一行一件事，细线隔开；挂着的那几条染一层淡灰粉 */
.dp-thought-item {
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  font-family:var(--font-cn); font-size:12.5px; line-height:1.65; color:var(--text-dim);
  padding:10px 4px; border-bottom:1px solid rgba(60,72,100,.07);
}
.dp-thought-item:last-child { border-bottom:0; }
.dp-empty { font-family:var(--font-cn); font-size:12.5px; color:var(--text-faint); padding:6px 4px; }
#dpThoughts:not(:empty) + .dp-empty, #dpMonologueText:not(:empty) + .dp-empty { display:none; }
/* 独白：整段摊开读，不折叠 */
.dp-mono-meta { font-family:var(--font-cn); font-size:10.5px; color:var(--text-faint); letter-spacing:.04em; margin-bottom:8px; }
.dp-mono-meta:empty { display:none; }
.dp-monologue-text {
  font-family:var(--font-cn); font-size:13px; line-height:1.9; color:var(--text-dim);
  white-space:pre-wrap;
}
.dp-th-text { flex:1 1 auto; min-width:0; }
.dp-th-meta { flex:none; font-size:10.5px; color:var(--text-faint); white-space:nowrap; }
/* 反复想、变成执念的那几条：染一层淡灰粉，时间前面挂一个灰粉的"挂着" */
.dp-thought-item.fixation {
  background:rgba(189,160,161,.14); color:var(--text);
  border-radius:10px; border-bottom-color:transparent; padding:10px 12px; margin-bottom:2px;
}
.dp-th-meta em { font-style:normal; color:#A08687; margin-right:5px; }
