/* 难受的时候 */
.cf-page{ display:flex; flex-direction:column; overflow:hidden; }
.cf-h{ font-size:16px; font-weight:500; }
.cf-body{ flex:1; overflow-y:auto; padding: 8px 18px calc(36px + env(safe-area-inset-bottom)); }
.cf-lead{ font-size:15px; line-height:1.8; color: var(--text); margin: 8px 0 4px; }
.cf-q{ font-size:13px; color: var(--text-faint); margin: 18px 0 10px; }
.cf-foot{ font-size:11.5px; color: var(--text-faint); text-align:center; margin-top:20px; line-height:1.6; }
.cf-scenes{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
.cf-scenes button{ text-align:left; padding:14px 13px; border-radius:16px; border:1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.05);
  color: var(--text); font: inherit; cursor:pointer; display:flex; flex-direction:column; gap:4px; }
.cf-scenes button b{ font-size:14.5px; font-weight:600; }
.cf-scenes button small{ font-size:12px; color: var(--text-faint); }
.cf-scenes button:active{ transform: scale(.97); }

/* 呼吸的圈：4 秒吸、2 秒停、6 秒呼 */
.cf-breath{ display:flex; flex-direction:column; align-items:center; gap:12px; margin: 18px 0 6px; }
.cf-ring{ width:120px; height:120px; border-radius:50%; display:grid; place-items:center;
  background: radial-gradient(circle, rgba(232,200,130,.22), rgba(232,200,130,.04) 70%); border:1px solid rgba(232,200,130,.3); }
.cf-dot{ width:44px; height:44px; border-radius:50%; background: rgba(240,214,150,.55); box-shadow: 0 0 30px rgba(240,214,150,.45);
  animation: cf-breathe 12s ease-in-out infinite; }
@keyframes cf-breathe{ 0%{ transform: scale(.7); } 33%{ transform: scale(2.2); } 50%{ transform: scale(2.2); } 100%{ transform: scale(.7); } }
.cf-breath-t{ font-size:13.5px; color: var(--text-soft); letter-spacing:.08em; min-height:20px; }

.cf-back{ border:0; background:none; color: var(--text-faint); font: inherit; font-size:13px; padding:4px 0 10px; cursor:pointer; }
.cf-letter{ padding:18px 18px 14px; border-radius:18px; background: linear-gradient(170deg, rgba(240,214,150,.12), rgba(255,255,255,.03)); border:1px solid rgba(240,214,150,.2); }
.cf-letter p{ font-size:15px; line-height:1.9; color: var(--text); margin: 0 0 12px; opacity:0; animation: cf-in .9s ease forwards; }
@keyframes cf-in{ from{ opacity:0; transform: translateY(4px); } to{ opacity:1; transform:none; } }
.cf-sign{ text-align:right; font-size:13px; color: var(--text-soft); }
.cf-timer{ margin-top:16px; text-align:center; }
.cf-timer > button, .cf-write button{ padding:11px 18px; border-radius:14px; border:1px solid rgba(240,214,150,.4); background: rgba(240,214,150,.2);
  color: var(--text); font: inherit; font-size:14px; cursor:pointer; }
.cf-clock{ font-size:40px; font-weight:300; letter-spacing:.06em; color: var(--text); font-variant-numeric: tabular-nums; }
.cf-tline{ font-size:14px; line-height:1.8; color: var(--text-soft); margin: 6px 0 10px; min-height:26px; }
.cf-stop{ border:0; background:none; color: var(--text-faint); font: inherit; font-size:12.5px; text-decoration: underline; cursor:pointer; }
.cf-write{ margin-top:18px; display:flex; flex-direction:column; gap:8px; }
.cf-write textarea{ padding:11px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06);
  color: var(--text); font: inherit; font-size:14px; line-height:1.6; resize:vertical; outline:none; }
.cf-write button{ align-self:flex-end; }
.cf-help{ margin-top:18px; font-size:12.5px; line-height:1.7; color: var(--text-faint); padding:10px 12px; border-radius:12px; background: rgba(255,255,255,.04); }

/* 备忘录（memo.js 借用 cf-page/cf-body） */
.mm-add{ display:flex; flex-direction:column; gap:8px; margin:6px 0 16px; }
.mm-row{ display:flex; gap:8px; }
.mm-in{ flex:1; min-width:0; padding:10px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: var(--text); font: inherit; font-size:14px; outline:none; }
.mm-row button{ padding:10px 16px; border-radius:12px; border:1px solid rgba(240,214,150,.4); background: rgba(240,214,150,.2); color: var(--text); font: inherit; font-size:14px; cursor:pointer; white-space:nowrap; }
.mm-item{ display:flex; align-items:center; gap:10px; padding:12px 4px; border-bottom:1px solid rgba(255,255,255,.07); }
.mm-check{ width:24px; height:24px; flex:0 0 auto; border-radius:50%; border:1.5px solid rgba(240,214,150,.55); background:none; color: var(--text); font-size:13px; cursor:pointer; }
.mm-main{ flex:1; min-width:0; }
.mm-text{ font-size:14.5px; color: var(--text); line-height:1.5; overflow-wrap:anywhere; }
.mm-meta{ font-size:12px; color: var(--text-faint); margin-top:2px; }
.mm-item.done .mm-text{ text-decoration: line-through; color: var(--text-faint); }
.mm-item.done .mm-check{ background: rgba(240,214,150,.3); }
.mm-del{ border:0; background:none; color: var(--text-faint); font-size:20px; cursor:pointer; padding:0 4px; }
.memo-chip{ display:inline-block; margin:4px 0; padding:5px 11px; border-radius:999px; font-size:12.5px; background: rgba(240,214,150,.16); border:1px solid rgba(240,214,150,.35); color: var(--text); cursor:pointer; }
/* 10/12 莫莫：备忘录的字眯着眼才看得清——淡色字直接压在湖面画上。给内容垫一层磨砂玻璃，淡字提亮一档 */
.mm-page .cf-body{ background: var(--glass-strong); -webkit-backdrop-filter: blur(16px) saturate(1.1); backdrop-filter: blur(16px) saturate(1.1);
  border:1px solid var(--glass-edge); border-bottom:0; border-radius:20px 20px 0 0; margin:6px 10px 0; padding-top:14px; }
.mm-page .cf-foot, .mm-page .mm-meta, .mm-page .mm-group, .mm-page .mm-del{ color: var(--text-soft); }
.mm-page .cf-foot{ font-size:13px; }
.mm-page .mm-group{ font-size:13px; font-weight:600; }
.mm-page .mm-meta{ font-size:12.5px; }
.mm-page .mm-in{ background: var(--glass); border-color: var(--glass-edge); font-size:15px; }
.mm-page .mm-in::placeholder{ color: var(--text-soft); opacity:1; }
:root[data-theme="stream"] .mm-page .mm-check{ border-color: var(--text-faint); }
:root[data-theme="stream"] .mm-page .mm-row button{ border-color: var(--text-faint); background: rgba(255,255,255,.55); }
.mm-group{ font-size:12px; color: var(--text-faint); letter-spacing:.06em; margin:16px 0 2px; }

/* 维护页（ops.js，10/14）：跟备忘录同一层磨砂玻璃（.mm-page） */
.op-btn{ display:flex; flex-direction:column; gap:4px; width:100%; text-align:left; margin:0 0 10px; padding:14px 14px; border-radius:16px;
  border:1px solid var(--glass-edge); background: var(--glass); color: var(--text); font: inherit; cursor:pointer; }
.op-btn b{ font-size:15px; font-weight:600; }
.op-btn small{ font-size:12.5px; color: var(--text-soft); line-height:1.5; }
.op-btn:active{ transform: scale(.99); }
.op-status{ font-size:13.5px; color: var(--text); margin:14px 2px 8px; min-height:1em; }
.op-log{ margin:0; padding:12px; border-radius:12px; background: rgba(0,0,0,.28); color: var(--text); font-size:12px; line-height:1.55;
  white-space:pre-wrap; word-break:break-all; max-height:46vh; overflow-y:auto; }
.op-log:empty{ display:none; }
:root[data-theme="stream"] .op-log{ background: rgba(255,255,255,.6); }

/* 手账本（journal.js，10/20）：本子上的纸不管白天夜里都是纸的颜色，字是墨色 */
.jn-page .profile-topbar{ display:flex; align-items:center; }
.jn-new{ margin-left:auto; padding:7px 14px; border-radius:999px; border:1px solid var(--glass-edge); background: var(--glass); color: var(--text); font: inherit; font-size:13.5px; cursor:pointer; }
.jn-compose{ background:#fbf6ec; color:#3b3226; border-radius:14px; padding:14px; margin:6px 2px 18px; box-shadow:0 8px 24px rgba(0,0,0,.18); display:flex; flex-direction:column; gap:9px; }
.jn-in{ width:100%; box-sizing:border-box; padding:9px 11px; border-radius:10px; border:1px solid #e3d8c4; background:#fffdf8; color:#3b3226; font: inherit; font-size:14.5px; outline:none; }
.jn-in::placeholder{ color:#a89a84; }
.jn-text{ min-height:110px; resize:vertical; line-height:1.7; background: repeating-linear-gradient(#fffdf8 0 26px, #efe6d4 26px 27px); }
.jn-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.jn-end{ justify-content:flex-end; }
.jn-chip{ padding:7px 12px; border-radius:999px; border:1px solid #e3d8c4; background:#fffdf8; color:#5a4b37; font: inherit; font-size:13px; cursor:pointer; }
.jn-save{ padding:8px 16px; border-radius:999px; border:0; background:#c9784f; color:#fff; font: inherit; font-size:14px; cursor:pointer; }
.jn-photo-name{ font-size:12.5px; color:#7a6a52; }
.jn-stk-box{ display:grid; grid-template-columns:repeat(auto-fill, minmax(54px, 1fr)); gap:6px; max-height:220px; overflow-y:auto; padding:6px; border-radius:10px; background:#f4ecdc; }
.jn-stk{ border:2px solid transparent; border-radius:10px; background:none; padding:2px; cursor:pointer; }
.jn-stk.on{ border-color:#c9784f; background:#fff3e6; }
.jn-stk img{ width:100%; aspect-ratio:1; object-fit:contain; }
.jn-picked{ display:flex; gap:6px; flex-wrap:wrap; }
.jn-picked img{ width:38px; height:38px; object-fit:contain; }
.jn-sheet{ position:relative; background:#fbf6ec; color:#3b3226; border-radius:6px; padding:22px 18px 14px; margin:26px 6px 30px;
  box-shadow:0 10px 26px rgba(0,0,0,.22), inset 0 0 0 1px rgba(120,95,60,.08);
  background-image: radial-gradient(rgba(140,110,70,.06) 1px, transparent 1px); background-size: 4px 4px; }
.jn-sheet.amo{ background-color:#f4f1ea; }
.jn-tape{ position:absolute; top:-11px; left:50%; width:96px; height:24px; margin-left:-48px; opacity:.78; transform:rotate(-3deg);
  clip-path: polygon(3% 0, 97% 4%, 100% 50%, 96% 100%, 2% 96%, 0 50%); }
.jn-meta{ font-size:12px; color:#8a7a62; letter-spacing:.04em; display:flex; align-items:center; }
.jn-del{ margin-left:auto; border:0; background:none; color:#b3a48c; font-size:18px; cursor:pointer; padding:0 2px; }
.jn-title{ margin:6px 0 4px; font-size:18px; font-weight:600; color:#2f2619; }
.jn-body{ font-size:15px; line-height:1.85; margin:8px 0; white-space:normal; overflow-wrap:anywhere; }
.jn-photo{ display:block; max-width:86%; margin:12px auto; padding:7px 7px 22px; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,.15); border-radius:2px; }
.jn-drawing{ display:block; max-width:100%; margin:8px auto; border-radius:4px; }
.jn-quote{ margin:12px 0; padding:9px 12px; border:1px dashed #cdbb9b; border-radius:6px; background:#fff8ea; font-size:13.5px; color:#5a4b37; line-height:1.6; }
.jn-stickers{ position:relative; height:70px; margin-top:4px; }
.jn-sticker{ position:absolute; top:4px; width:58px; height:58px; object-fit:contain; filter: drop-shadow(0 2px 2px rgba(0,0,0,.18)); }
.jn-notes{ margin-top:10px; border-top:1px dashed #e0d3bb; padding-top:8px; }
.jn-note{ font-size:13.5px; line-height:1.6; margin:5px 0; color:#4a3d2c; }
.jn-note b{ font-weight:600; margin-right:6px; color:#a0623f; }
.jn-note.amo b{ color:#4f6f8f; }
.jn-note-add{ display:flex; gap:6px; margin-top:6px; }
.jn-note-add .jn-in{ font-size:13px; padding:7px 10px; }
.jn-note-add button{ flex:none; padding:0 12px; border-radius:10px; border:1px solid #e3d8c4; background:#fffdf8; color:#5a4b37; font: inherit; font-size:13px; cursor:pointer; }
.jn-tabs{ grid-column:1/-1; display:flex; gap:6px; margin-bottom:4px; }
.jn-tab{ padding:5px 11px; border-radius:999px; border:1px solid #e3d8c4; background:#fffdf8; color:#7a6a52; font: inherit; font-size:12.5px; cursor:pointer; }
.jn-tab.on{ background:#c9784f; border-color:#c9784f; color:#fff; }
.jn-tabpane{ grid-column:1/-1; display:grid; grid-template-columns:repeat(auto-fill, minmax(54px, 1fr)); gap:6px; }
.jn-stk.txt{ font-size:12px; color:#5a4b37; padding:6px 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; grid-column: span 2; }
.jn-stk.ico{ font-size:24px; }
.jn-picked-txt{ font-size:13px; color:#5a4b37; padding:4px 8px; background:#fff3e6; border-radius:8px; }
.jn-sticker.txt{ width:auto; height:auto; font-size:16px; color:#6b5638; background:rgba(255,248,232,.85); padding:3px 8px; border-radius:8px; white-space:nowrap; filter:none; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.jn-video{ margin:6px 0 10px; }
.jn-video summary{ font-size:13px; color:#8a6a48; cursor:pointer; }
.jn-video video{ width:100%; margin-top:6px; border-radius:6px; background:#000; }
.jn-sticker.draw{ width:72px; height:72px; background:#fff; padding:3px; box-shadow:0 2px 6px rgba(0,0,0,.18); }
.op-dl{ display:block; margin:4px 2px 10px; padding:10px 14px; border-radius:12px; background:#c9784f; color:#fff; text-align:center; text-decoration:none; font-size:14px; }
.jn-gal-btn{ margin-left:auto; margin-right:8px; }
.jn-gal-btn + .jn-new{ margin-left:0; }
.jn-gallery{ padding:4px 2px 10px; }
.jn-gal-tip{ font-size:13px; color: var(--text-soft); margin:4px 2px 12px; }
.jn-gal-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; }
.jn-gal-item{ border:0; padding:8px 8px 18px; background:#fbf6ec; border-radius:4px; box-shadow:0 6px 16px rgba(0,0,0,.2); cursor:pointer; }
.jn-gal-item:nth-child(odd){ transform:rotate(-1.5deg); }
.jn-gal-item:nth-child(even){ transform:rotate(1.2deg); }
.jn-gal-item img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:2px; display:block; }
.jn-viewer{ position:fixed; inset:0; z-index:400; background:rgba(10,14,20,.86); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; }
.jn-viewer img{ max-width:100%; max-height:75vh; border-radius:6px; background:#fbf6ec; box-shadow:0 10px 30px rgba(0,0,0,.4); }
.jn-viewer-row{ display:flex; gap:10px; margin-top:16px; }
.jn-viewer-row button{ padding:10px 16px; border-radius:999px; border:0; background:#fbf6ec; color:#3b3226; font: inherit; font-size:14px; cursor:pointer; }
.jn-viewer-row [data-save]{ background:#c9784f; color:#fff; }
.op-usage{ margin:4px 0 14px; padding:12px 14px; border-radius:16px; border:1px solid var(--glass-edge); background: var(--glass); font-size:13px; color: var(--text-soft); }
.op-u-h{ font-size:14px; font-weight:600; color: var(--text); margin-bottom:8px; }
.op-u-row{ display:flex; align-items:center; gap:10px; margin-top:6px; color: var(--text); }
.op-u-row span:first-child{ width:52px; flex:none; }
.op-u-bar{ flex:1; height:8px; border-radius:99px; background: rgba(255,255,255,.15); overflow:hidden; }
.op-u-bar i{ display:block; height:100%; border-radius:99px; background:#c9784f; }
.op-u-row b{ width:42px; text-align:right; font-weight:600; }
.op-u-sub{ font-size:11.5px; color: var(--text-faint); margin:2px 0 0 62px; }

/* nightlight.js —— 不写是什么，留给她自己碰到 */
.nl-layer{ position:fixed; inset:0; z-index:500; pointer-events:none; overflow:hidden; transition:opacity 1.2s ease; }
.nl-layer.out{ opacity:0; }
.nl-star{ position:absolute; top:-24px; color:#f6e7b0; text-shadow:0 0 8px rgba(255,236,170,.9); font-size:14px; line-height:1; animation-name:nlFall; animation-timing-function:linear; animation-fill-mode:forwards; opacity:0; }
@keyframes nlFall{ 0%{ transform:translateY(0) rotate(0); opacity:0; } 12%{ opacity:1; } 100%{ transform:translateY(105vh) rotate(160deg); opacity:.2; } }
.nl-moon{ position:absolute; top:12%; right:-60px; font-size:46px; filter:drop-shadow(0 0 16px rgba(255,230,160,.7)); animation:nlMoon 4.6s ease-out forwards; }
@keyframes nlMoon{ 0%{ transform:translateX(0); } 35%,100%{ transform:translateX(-96px); } }
.nl-word{ position:absolute; left:50%; top:42%; transform:translateX(-50%); font-size:22px; letter-spacing:.2em; color:#fff6dc; text-shadow:0 0 14px rgba(255,220,150,.9), 0 2px 6px rgba(0,0,0,.35); opacity:0; animation:nlWord 4.2s ease forwards; animation-delay:.6s; white-space:nowrap; }
@keyframes nlWord{ 0%{ opacity:0; transform:translate(-50%, 8px); } 25%,75%{ opacity:1; transform:translate(-50%, 0); } 100%{ opacity:0; transform:translate(-50%, -6px); } }
/* 维护页两个开关（10/28）：像手机里开流量那样 */
.op-sws{ margin:0 0 14px; }
.op-sw{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; text-align:left; margin:0 0 8px; padding:12px 14px;
  border-radius:16px; border:1px solid var(--glass-edge); background: var(--glass); color: inherit; font: inherit; cursor:pointer; }
.op-sw span{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.op-sw b{ font-size:15px; font-weight:600; }
.op-sw small{ font-size:12.5px; color: var(--text-soft); line-height:1.5; }
.op-sw-knob{ flex:none; position:relative; width:46px; height:28px; border-radius:14px; background: rgba(140,140,140,.45); transition: background .2s; }
.op-sw-knob::after{ content:""; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); transition: transform .2s; }
.op-sw[aria-checked="true"] .op-sw-knob{ background:#6fbf73; }
.op-sw[aria-checked="true"] .op-sw-knob::after{ transform: translateX(18px); }
.op-sw-foot{ margin:2px 4px 0; font-size:12px; color: var(--text-soft); line-height:1.5; }