/* ============================================================
   老人端内页修复 v20260920-01
   作用域：#app-root[class*="FFF8DC"] = 仅老人端（子女端是 slate-900，不命中）
   背景：大事年表等浅顶栏内页，header 被 React 高频重渲染，
         JS 注入的内联样式会被抹掉 → 改用 CSS 定位稳定类名，一劳永逸
   移除本文件即回滚
   ============================================================ */

/* —— 「退回」按钮：白底描边芯片（原 bg-amber-100 在半透顶栏上发虚） —— */
#app-root[class*="FFF8DC"] header.bg-white\/50 button.bg-amber-100 {
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1.5px solid rgba(139, 94, 52, 0.5) !important;
  box-shadow: 0 2px 6px rgba(90, 50, 20, 0.18) !important;
}
#app-root[class*="FFF8DC"] header.bg-white\/50 button.bg-amber-100:hover {
  background: #fff !important;
}

/* —— 浅顶栏标题压深，避免发虚 —— */
#app-root[class*="FFF8DC"] header.bg-white\/50 h2 {
  color: #4a2510 !important;
}
/* ============================================================
   老人端顶栏「返回」按钮布局修复 v20260923-01
   问题：elder-back-button.js 把「‹ 返回」插为 header 第一个 flex 子元素，
         justify-between 变三段式，把「退出」按钮组挤到正中央，
         压住 absolute 居中的大标题（如「用声音记录您的珍贵回忆」）。
   方案：棕色渐变顶栏改 flex-start + 末子元素 margin-left:auto，
         恢复「左功能区 / 居中标题 / 右头像」布局。
   移除本段即回滚。
   ============================================================ */
#app-root[class*="FFF8DC"] header[class*="8B4513"] {
  justify-content: flex-start !important;
  gap: 14px;
}
#app-root[class*="FFF8DC"] header[class*="8B4513"] > :last-child {
  margin-left: auto !important;
}


/* ============================================================
   老人端修复 v20260923-02
   (a) 隐藏顶栏「退出」按钮：老人误触退出风险高，且 ☰ 菜单内已有导航。
       用 display:none 等效移除（React 渲染的按钮，不改 bundle 最稳）。
   (b) 强制 ☰ 侧边栏深棕渐变：memoir-polish.css 的
       "#app-root > div > div:has(> div.fixed + div > header) > div.fixed + div"
       因遮罩 fixed 也命中侧边栏，把浅奶油画廊渐变盖到侧边栏上，
       导致 text-amber-50 浅字看不清。这里作用域老人端强制恢复深棕底。
   移除本段即回滚。
   ============================================================ */
/* (a) 顶栏「退出」按钮消失 —— 仅老人端棕色顶栏命中 */
#app-root[class*="FFF8DC"] header[class*="8B4513"] button.text-amber-200 {
  display: none !important;
}

/* (b) ☰ 侧边栏恢复深棕渐变，保证浅字可读 */
#app-root[class*="FFF8DC"] div.fixed.top-0.left-0.h-full.w-72.text-amber-50 {
  background: linear-gradient(180deg, #4A2000, #6B3000) !important;
  background-image: linear-gradient(180deg, #4A2000, #6B3000) !important;
}
