/* Extracted from family-home.html inline <style> blocks - 20260713 */

/* === CSS Variables: aligned with design tokens (fix0730design) === */
:root,
html[data-theme="light"] {
  --h-bg: var(--ai-bg);
  --h-bg-soft: var(--ai-bg-soft);
  --h-card: var(--ai-card);
  --h-text: var(--ai-text);
  --h-text2: var(--ai-text-secondary);
  --h-secondary: var(--ai-text-secondary);
  --h-border: var(--ai-border);
  --h-accent: var(--ai-accent);
}
html[data-theme="dark"] {
  --h-bg: var(--ai-bg);
  --h-bg-soft: var(--ai-bg-soft);
  --h-card: var(--ai-card);
  --h-text: var(--ai-text);
  --h-text2: var(--ai-text-secondary);
  --h-secondary: var(--ai-text-secondary);
  --h-border: var(--ai-border);
  --h-accent: var(--ai-accent);
}
html[data-theme="dark"] body {
  background: var(--h-bg) !important;
  color: var(--h-text) !important;
}
html[data-theme="dark"] .fh-l1-section {
  background: var(--h-bg) !important;
  color: var(--h-text) !important;
}
html[data-theme="dark"] .v2-zone-layout,
html[data-theme="dark"] .v2-zone-hero,
html[data-theme="dark"] .v2-zone-cards,
html[data-theme="dark"] .v2-zone-caps-grid,
html[data-theme="dark"] .v2-zone-ai-entry {
  background: var(--h-bg) !important;
  color: var(--h-text) !important;
}
html[data-theme="dark"] .v2-zone-hero-indicator,
html[data-theme="dark"] .v2-zone-card,
html[data-theme="dark"] .v2-zone-cap,
html[data-theme="dark"] .v2-zone-quick-action {
  background: var(--h-card) !important;
  border-color: var(--h-border) !important;
  color: var(--h-text) !important;
}
html[data-theme="dark"] .v2-zone-cap-name,
html[data-theme="dark"] .v2-zone-card-title,
html[data-theme="dark"] .v2-ai-title {
  color: var(--h-text) !important;
}
html[data-theme="dark"] .v2-zone-cap-desc,
html[data-theme="dark"] .v2-zone-card-desc,
html[data-theme="dark"] .v2-ai-desc,
html[data-theme="dark"] .v2-zone-hero-label {
  color: var(--h-text2) !important;
}

/* === V2 Hero: emoji/title/sub on gradient background — always white === */
.v2-zone-hero-emoji { color: #fff !important; }
.v2-zone-hero-title { color: #fff !important; }
.v2-zone-hero-sub { color: rgba(255,255,255,0.75) !important; }
html[data-theme="dark"] .v2-zone-hero-emoji { color: #fff !important; }
html[data-theme="dark"] .v2-zone-hero-title { color: #fff !important; }
html[data-theme="dark"] .v2-zone-hero-sub { color: rgba(255,255,255,0.75) !important; }
.v2-zone-indicator-value { color: var(--h-text) !important; }
.v2-zone-indicator-value[data-empty="true"] { color: var(--h-text2) !important; }

html[data-theme="dark"] .v2-zone-back-bar {
  background: var(--h-card) !important;
  border-color: var(--h-border) !important;
}
html[data-theme="dark"] .v2-daily-picks {
  background: var(--h-card) !important;
}
html[data-theme="dark"] .v2-daily-pick-card {
  background: var(--h-bg-soft) !important;
  border-color: var(--h-border) !important;
}
/* ===== z-index 层叠修复：功能页子页面必须在浮动元素之上 ===== */
#fhCapSubpage,
.fh-cap-subpage {
  z-index: 1100 !important;
  position: relative;
}

/* 子页面打开时隐藏浮动按钮（保留右侧边栏） */
body.ga-subpage-open #tcfDiscoverBtn,
body.ga-subpage-open #p2PreviewBtn,
body.ga-subpage-open #xzChatExpandBtn,
body.ga-subpage-open .xz-mobile-fab,
body.ga-subpage-open .tcf-floating-btn {
  display: none !important;
}

/* Toast 必须在所有元素之上（包括 navbar z=9999） */
#toast,
#toast.show {
  z-index: 99999 !important;
}

/* 子页面内容区不延伸到右侧栏下方 */
body.ga-subpage-open #fhCapSubpage > div:first-child {
  max-width: 100% !important;
  overflow-x: hidden;
  box-sizing: border-box !important;
}

html[data-theme="dark"] #fhCapSubpage,
html[data-theme="dark"] .fh-cap-subpage {
  background: var(--h-bg) !important;
  color: var(--h-text) !important;
}
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background: var(--h-card) !important;
  color: var(--h-text) !important;
  border-color: var(--h-border) !important;
}

/* === Inline Style Block 0 === */
/* P70v16d: 紧急修复 - FAB 在 @media 内 CSS 没闭合导致不生效 + dvh 误解析 */
.xz-mobile-fab {
  position: fixed !important;
  top: 10px !important;
  left: calc(50% - 29px) !important;
  transform: translateX(-50%) !important;
  bottom: auto !important;
  right: auto !important;
  width: auto !important;
  height: 36px !important;
  display: none;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(99,102,241,0.12), rgba(139,92,246,0.08)) !important;
  border: 1px solid rgba(99,102,241,0.15) !important;
  box-shadow: 0 2px 8px rgba(99,102,241,0.12) !important;
  cursor: grab !important;
  z-index: 99999 !important;
  padding: 2px 10px 2px 4px !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  color: var(--h-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  overflow: visible;
  white-space: nowrap !important;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, top 0.15s ease, left 0.15s ease;
}
.xz-mobile-fab.xz-fab-dragged {
  border-radius: 18px !important;
  padding: 2px 12px 2px 4px !important;
  box-shadow: 0 4px 16px rgba(99,102,241,0.25) !important;
}
.xz-mobile-fab.xz-fab-dragged .xz-mobile-fab-hint { display: flex !important; }
.xz-mobile-fab:active { cursor: grabbing; }
.xz-mobile-fab.dragging { transition: none; box-shadow: 0 4px 16px rgba(99, 102, 241, 0.3); transform: scale(1.02); }
.xz-mobile-fab .xz-mobile-fab-wrap {
  width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 0 !important;
  flex-shrink: 0 !important;
  pointer-events: none;
}
.xz-mobile-fab.xz-fab-dragged .xz-mobile-fab-wrap {
  width: 32px !important;
  height: 32px !important;
}
.xz-mobile-fab .xz-mobile-fab-wrap svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: visible;
}
.xz-mobile-fab .xz-mobile-fab-label { font-size: 12px !important; font-weight: 600 !important; color: var(--h-text) !important; pointer-events: none; display: flex !important; align-items: center; white-space: nowrap; }
.xz-mobile-fab .xz-mobile-fab-hint { display: none; font-size: 10px; font-weight: 400; color: var(--h-secondary, #888); pointer-events: none; align-items: center; white-space: nowrap; }
[data-theme=light] .xz-mobile-fab { /* P72v24: 浅色主题不再强制阴影，让 SVG 跟 PC 端一致 */ }
html[data-theme="light"] .xz-mobile-fab, html[data-theme="dark"] .xz-mobile-fab { background: linear-gradient(180deg, rgba(99,102,241,0.08), rgba(99,102,241,0.02)) !important; }
/* 小智陪伴FAB默认隐藏，仅用户点击AI入口时由JS唤起 */
@media (max-width: 768px) {
  .xz-mobile-fab { display: flex !important; }
  .xz-mobile-fab.xz-fab-active { display: flex !important; }
}
/* fix0801nav: Desktop hide mobile FAB */
@media (min-width: 769px) {
  .xz-mobile-fab { display: none !important; }
}

/* === 永久隐藏旧聊天系统（已迁移到 #xzChatPanel）=== */
#inputRow { display: none !important; }
#chatPanel { display: none !important; }
#chatExpandBtn { display: none !important; }

/* === 通知+反馈按钮已收入左侧边栏，所有端隐藏独立浮动按钮 === */
#pushSettingsFab { display: none !important; }

/* P70v17: 移动端 wizard 全屏底部抽屉 */
@media (max-width: 768px) {
  .xz-wizard {
    padding: 0;
    align-items: flex-end;  /* 底部对齐 */
    justify-content: stretch;
  }
  .xz-wizard-card {
    max-width: 100% !important;
    width: 100% !important;
    max-height: 100vh !important;
    height: 100vh !important;
    border-radius: 20px 20px 0 0 !important;  /* 顶部圆角，底部贴底 */
    margin: 0 !important;
    animation: xzModalSlideUp 0.3s ease;
  }
  .xz-wizard-body {
    padding: 16px 18px 24px !important;
  }
  .xz-wizard-title { font-size: 18px !important; }
  .xz-wizard-sub { font-size: 12px !important; margin-bottom: 16px !important; }
  .xz-wizard-icon { font-size: 36px !important; margin-bottom: 8px !important; }
  .xz-wizard-feature-list li { font-size: 12px !important; padding: 4px 0 !important; }
  .xz-wizard-form { gap: 10px !important; }
  .xz-form-field label, .xz-form-label { font-size: 12px !important; }
  .xz-form-field input, .xz-form-field select {
    padding: 9px 12px !important;
    font-size: 14px !important;
  }
  .xz-wiz-companion-svg { width: 40px !important; height: 40px !important; }
  .xz-wiz-companion-name { font-size: 11px !important; }
  .xz-wiz-companion-desc { font-size: 9px !important; }
  .xz-wizard-btn { padding: 11px !important; font-size: 13px !important; }
  .xz-wizard-step-dot { width: 18px !important; }
}
@keyframes xzModalSlideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

/* 修复 dvh → vh 后 body 高度正常 */
body { min-height: 100vh !important; }
main.fh-content { min-height: auto !important; }

/* === Inline Style Block 1 === */
/* 防闪烁：默认隐藏旧聊天组件，仅孩子区通过body class放行 */
#inputRow { display: none !important; }
#chatPanel { display: none !important; }
#chatExpandBtn { display: none !important; }
#chatPanelHeader { display: none !important; }
/* 旧聊天系统已永久迁移到 #xzChatPanel，不再需要 xz-show-old-chat 放行规则 */
/* body.xz-show-old-chat #inputRow { display: flex !important; } */
/* body.xz-show-old-chat #chatPanel.show { display: flex !important; flex-direction: column !important; } */
/* body.xz-show-old-chat #chatExpandBtn { display: flex !important; } */
/* body.xz-show-old-chat #chatPanelHeader { display: flex !important; } */
/* 防内容闪现：统一用 anti-flicker-pinned 块的 visibility 方案 */
/* 此处不再单独设 opacity 动画，避免与 anti-flicker 冲突 */
/* todayContent 不再 opacity:0 — 避免延迟闪跳，由 renderToday 直接填充内容 */

/* === Inline Style Block 2 === */
/* 溢出修复: 确保所有动态注入内容不超出容器 */
.et-guard-panel, .et-health-panel, .et-sos-panel, .et-safety-panel,
.et-travel-panel, .et-checkin-box, .et-medical-box, .et-fall-confirm-box,
.et-feedback-section, .et-hotel-section, .et-review-section,
.et-p4-section, .et-optimize-result, .et-deep-links,
.et-scenic-links, .et-spot-links, .et-feedback-btns,
.et-optimize-stats, .et-hotel-meta, .et-personas {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
}
.et-deep-links, .et-scenic-links, .et-spot-links,
.et-feedback-btns, .et-optimize-stats {
  flex-wrap: wrap !important;
}
.et-p4-card {
  min-width: unset !important;
  flex: 1 1 100% !important;
}
.et-hotel-card, .et-review-card {
  max-width: 100% !important;
  overflow: hidden !important;
}
.et-dl-btn, .et-mini-link {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
canvas {
  max-width: 100% !important;
}
.et-notif-panel {
  max-width: calc(100vw - 20px) !important;
}
@media (max-width: 768px) {
  .et-notif-panel {
    width: calc(100vw - 20px) !important;
    right: 10px !important;
  }
  .et-guard-grid, .et-health-charts {
    grid-template-columns: 1fr !important;
  }
  .et-p4-section {
    flex-direction: column !important;
  }
}

/* === Inline Style Block 3 === */
/* Anti-flicker: no longer hide pinnedGrid via visibility — causes flash */
/* initWrapper renders persona cards immediately, no need to pre-hide */
/* #allCapsSection display:none removed — .all-caps-section class handles it */

/* === Inline Style Block 4 === */
/* ===== A3: 四区卡片设计语言统一 ===== */
/* 统一规范: border-radius 16px + 1px border + subtle shadow + consistent padding */
/* 保留各区的色彩主题和适老化字号 */

/* 孩子区 action cards: 统一圆角 18px→16px */
.xz-action-card {
  border-radius: 16px !important;
}

/* 长辈区 cards: 加subtle shadow */
.elder-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.elder-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04) !important;
}

/* 个人区 scene cards: 加subtle shadow */
.personal-scene-card {
  transition: all 0.3s cubic-bezier(0.4,0,0.2,1) !important;
}
.personal-scene-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.03) !important;
}

/* 个人区 hub cards: 统一阴影 */
.fh-hub-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.fh-hub-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04) !important;
}

/* 统一 today-card 阴影 */
.today-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.03) !important;
}

/* 统一 lens-card 圆角 */
.fh-lens-card {
  border-radius: 12px !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}
.fh-lens-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* 深色模式适配 */
[data-theme="dark"] .elder-card,
[data-theme="dark"] .personal-scene-card,
[data-theme="dark"] .fh-hub-card {
  box-shadow: 0 2px 8px rgba(0,0,0,0.3), 0 1px 3px rgba(0,0,0,0.2) !important;
}
[data-theme="dark"] .elder-card:hover,
[data-theme="dark"] .personal-scene-card:hover,
[data-theme="dark"] .fh-hub-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2) !important;
}

/* === Inline Style Block 5 === */
/* ===== K1-K5: 孩子区内容区精致化 ===== */

/* K1: 习惯打卡 — 进度条增强 */
.xz-habit-strip-progress {
  margin-left: auto; font-size: 13px; color: var(--h-accent);
  font-weight: 600; display: flex; align-items: center; gap: 8px;
}
.xz-habit-progress-bar {
  width: 80px; height: 6px; border-radius: 3px; background: rgba(124,92,255,0.12);
  overflow: hidden; flex-shrink: 0;
}
.xz-habit-strip-wrap {
  border-radius: 16px; padding: 16px 18px;
}
.xz-habit-strip-header {
  margin-bottom: 14px;
}
.xz-habit-strip-icon { font-size: 20px; }
.xz-habit-strip-title { font-size: 15px; }
/* 完成态 chips 更明显 */
.xz-habit-chip-done {
  opacity: 0.5; background: rgba(76,175,80,0.06) !important;
  border-color: rgba(76,175,80,0.25) !important;
}
.xz-habit-chip-done .xz-habit-chip-check {
  background: #4caf50; border-color: #4caf50; color: #fff;
  box-shadow: 0 0 0 3px rgba(76,175,80,0.15);
}
/* 未完成 chip hover 增强 */
.xz-habit-chip:hover {
  transform: translateY(-2px); box-shadow: 0 4px 14px rgba(124,92,255,0.1);
  border-color: rgba(124,92,255,0.3);
}

/* K2: 每日精选 — 卡片入场动画 */
@keyframes xz-card-enter {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.xz-action-card.xz-card-focus {
  animation: xz-card-enter 0.4s cubic-bezier(0.2,0,0.2,1) both;
}
.xz-action-card.xz-card-focus:nth-child(2) { animation-delay: 0.08s; }
.xz-action-card.xz-card-focus:nth-child(3) { animation-delay: 0.16s; }

/* K3: 成长路线时间轴 — 增强视觉 */
.xz-timeline {
  border-radius: 16px; padding: 16px 22px 22px;
}
.xz-tl-track::before {
  height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, #4caf50 0%, #4caf50 var(--tl-completed, 33%), var(--h-border) var(--tl-completed, 33%), var(--h-border) 100%);
}
/* 当前节点脉冲 */
.xz-tl-node.current {
  position: relative;
}
.xz-tl-node.current::after {
  content: '';
  position: absolute; inset: -4px;
  border-radius: 50%;
  border: 2px solid var(--h-accent);
  animation: xz-tl-pulse 2s ease-in-out infinite;
}
@keyframes xz-tl-pulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.15); }
}
/* 已完成节点 */
.xz-tl-node.done .xz-tl-dot {
  background: #4caf50; border-color: #4caf50;
  box-shadow: 0 0 0 2px rgba(76,175,80,0.15);
}
/* 节点 label */
.xz-tl-label {
  font-size: 11px; font-weight: 500;
  transition: color 0.2s;
}
.xz-tl-node.current .xz-tl-label {
  color: var(--h-accent); font-weight: 700;
}

/* K4: 婴幼儿照护功能卡片 — 色彩增强 */
.fh-lens-cards {
  gap: 10px;
}
.fh-lens-card {
  border-radius: 12px; padding: 12px;
  position: relative; overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.fh-lens-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--lens-accent, var(--h-accent));
  opacity: 0; transition: opacity 0.25s;
}
.fh-lens-card:hover::before { opacity: 1; }
.fh-lens-card:hover {
  transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0,0,0,0.08);
  border-color: var(--h-accent);
}
.fh-lens-card-icon {
  font-size: 22px; margin-bottom: 6px;
}
.fh-lens-card-title {
  font-size: 13px; font-weight: 600; margin-bottom: 3px;
}
.fh-lens-card-desc {
  font-size: 11px; line-height: 1.4;
}
/* 每张卡片不同 accent 色 */
.fh-lens-card:nth-child(1) { --lens-accent: #F59E0B; }
.fh-lens-card:nth-child(2) { --lens-accent: #6366F1; }
.fh-lens-card:nth-child(3) { --lens-accent: #10B981; }
.fh-lens-card:nth-child(4) { --lens-accent: #EF4444; }
.fh-lens-card:nth-child(5) { --lens-accent: #8B5CF6; }
.fh-lens-card:nth-child(6) { --lens-accent: #EC4899; }

/* K5: 今日建议提示框 — 渐变增强 */
.xz-reminder {
  border-radius: 14px;
  border-left: 4px solid #F59E0B;
  background: linear-gradient(135deg, rgba(245,158,11,0.04) 0%, var(--h-card) 30%);
  padding: 14px 18px;
}
.xz-reminder-icon {
  font-size: 22px;
}
.xz-reminder-text {
  font-size: 14px;
}
.xz-reminder-text strong {
  color: #D97706;
}

/* 深色模式 */
html[data-theme="dark"] .xz-habit-chip:hover {
  box-shadow: 0 4px 14px rgba(124,92,255,0.15);
  border-color: rgba(124,92,255,0.4);
}
html[data-theme="dark"] .xz-reminder {
  background: linear-gradient(135deg, rgba(245,158,11,0.06) 0%, var(--h-card) 30%);
}
html[data-theme="dark"] .xz-tl-track::before {
  background: linear-gradient(90deg, #4caf50 0%, #4caf50 var(--tl-completed, 33%), rgba(255,255,255,0.08) var(--tl-completed, 33%), rgba(255,255,255,0.08) 100%);
}
html[data-theme="dark"] .fh-lens-card:hover {
  box-shadow: 0 4px 14px rgba(0,0,0,0.3);
}

/* 移动端 */
@media (max-width: 768px) {
  .xz-habit-progress-bar { width: 60px; }
  .fh-lens-card-icon { font-size: 20px; }
}

/* === Inline Style Block 6 === */
/* ===== E1-E4: 长辈区内容区精致化 ===== */

/* E1: 功能卡片微调 — 图标更大、状态标签更精致 */
.elder-card-icon {
  font-size: 28px !important;
  margin-bottom: 2px;
}
.elder-card-title {
  font-weight: 600 !important;
}
.elder-card-status {
  font-size: 12px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-weight: 500 !important;
}
/* 状态色映射 */
.elder-card[data-module="health"] .elder-card-status { background: rgba(239,68,68,0.1); color: #EF4444; }
.elder-card[data-module="medication"] .elder-card-status { background: rgba(139,92,246,0.1); color: #8B5CF6; }
.elder-card[data-module="safety"] .elder-card-status { background: rgba(245,158,11,0.1); color: #F59E0B; }
.elder-card[data-module="monitor"] .elder-card-status { background: rgba(59,130,246,0.1); color: #3B82F6; }
.elder-card[data-module="travel"] .elder-card-status { background: rgba(16,185,129,0.1); color: #10B981; }

/* E2: 今日事项列表 — 分组样式 + 状态图标 */
.elder-mode .today-card {
  border-radius: 14px !important;
  border-left: 3px solid transparent !important;
  transition: transform 0.15s ease, border-color 0.15s ease !important;
}
.elder-mode .today-card:hover {
  transform: translateX(2px);
}
/* 待完成 — 左边框琥珀色 */
.elder-mode .today-card .tc-badge[class*="pending"],
.elder-mode .today-card:has(.tc-badge[class*="待"]) {
  border-left-color: #F59E0B !important;
}
/* 已完成 — 左边框绿色 */
.elder-mode .today-card .tc-badge[class*="done"],
.elder-mode .today-card:has(.tc-badge[class*="已"]) {
  border-left-color: #10B981 !important;
  opacity: 0.7;
}
/* 用药提醒项 — 左边框紫色 */
.elder-mode .today-card:has(.tc-detail[class*="用药"]),
.elder-mode .today-card:has(.tc-title[class*="用药"]) {
  border-left-color: #8B5CF6 !important;
}
/* 签到项 — 左边框绿色 */
.elder-mode .today-card:has(.tc-title[class*="签到"]) {
  border-left-color: #10B981 !important;
}
/* 健康项 — 左边框红色 */
.elder-mode .today-card:has(.tc-title[class*="血压"]),
.elder-mode .today-card:has(.tc-title[class*="健康"]) {
  border-left-color: #EF4444 !important;
}

/* E3: 语音交互 — 聆听中脉冲动画 */
.elder-voice-btn.voice-listening {
  animation: elder-voice-pulse 1.5s ease-in-out infinite !important;
}
@keyframes elder-voice-pulse {
  0%, 100% { box-shadow: 0 4px 16px rgba(79,70,229,0.4); }
  50% { box-shadow: 0 4px 28px rgba(79,70,229,0.7), 0 0 0 8px rgba(79,70,229,0.1); }
}
/* 语音bar圆角统一 */
.elder-voice-bar {
  border-radius: 20px !important;
}
/* 语音hint字号微调 */
.elder-voice-hint {
  font-size: 13px !important;
}

/* E4: SOS按钮 — 持续脉冲吸引注意 */
.et-sos-fab {
  animation: elder-sos-pulse 2.5s ease-in-out infinite !important;
}
@keyframes elder-sos-pulse {
  0%, 100% { box-shadow: 0 4px 16px rgba(239,68,68,0.3); }
  50% { box-shadow: 0 4px 28px rgba(239,68,68,0.6), 0 0 0 6px rgba(239,68,68,0.08); }
}
.et-sos-fab:hover {
  animation: none !important;
  transform: scale(1.08) !important;
  box-shadow: 0 6px 24px rgba(239,68,68,0.5) !important;
}
.et-sos-fab:active {
  transform: scale(0.95) !important;
}

/* 深色模式 */
html[data-theme="dark"] .elder-card-status {
  opacity: 0.9;
}
html[data-theme="dark"] .elder-voice-btn.voice-listening {
  animation: elder-voice-pulse-dark 1.5s ease-in-out infinite !important;
}
@keyframes elder-voice-pulse-dark {
  0%, 100% { box-shadow: 0 4px 16px rgba(99,102,241,0.3); }
  50% { box-shadow: 0 4px 28px rgba(99,102,241,0.5), 0 0 0 8px rgba(99,102,241,0.08); }
}

/* 移动端 */
@media (max-width: 768px) {
  .elder-card-icon { font-size: 24px !important; }
  .elder-voice-bar { border-radius: 16px !important; }
}

/* === Inline Style Block 7 === */
/* ===== P1-P4: 个人区内容区精致化 ===== */

/* P1: 我的家人 — hub card 底部色条改为顶部色条 + 入场动画 */
.fh-hub-card {
  animation: xz-card-enter 0.4s cubic-bezier(0.2,0,0.2,1) both;
}
.fh-hub-card:nth-child(2) { animation-delay: 0.08s; }
.fh-hub-card:nth-child(3) { animation-delay: 0.16s; }
/* 底部色条增强 */
.fh-hub-card::after {
  height: 4px;
  opacity: 0.8;
  transition: opacity 0.2s, height 0.2s;
}
.fh-hub-card:hover::after {
  opacity: 1;
  height: 5px;
}
/* 头像增强 */
.fh-hub-card-avatar {
  transition: transform 0.2s;
}
.fh-hub-card:hover .fh-hub-card-avatar {
  transform: scale(1.05);
}

/* P2: 今日关注 — 分类左边框 + hover平移 */
.today-card.tc-classified {
  border-left: 3px solid transparent !important;
  transition: transform 0.15s ease, border-color 0.15s ease, border-left-color 0.15s ease !important;
}
.today-card.tc-classified:hover {
  transform: translateX(3px);
}
/* 婴幼儿照护 — 蓝色 */
.today-card.tc-classified:has(.tc-title[class*="婴幼儿"]),
.today-card.tc-classified:has(.tc-icon-baby) {
  border-left-color: #3B82F6 !important;
}
/* 长辈照护 — 琥珀色 */
.today-card.tc-classified:has(.tc-title[class*="长辈"]) {
  border-left-color: #F59E0B !important;
}
/* 通用 fallback: 用 tc-neutral → 加左边框 */
.today-card.tc-neutral {
  border-left: 3px solid var(--h-border) !important;
}
/* 每日精选类 — 紫色 */
.today-card.tc-classified:not(.tc-neutral) {
  border-left-color: var(--h-accent, #7c3aed) !important;
}

/* P3: 数据对比 — 空状态增强 */
.weekly-compare-section {
  border-radius: 14px !important;
}
.weekly-compare-toggle {
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
}
/* 空状态提示 */
.weekly-compare-body:not(.open) {
  display: none;
}
.weekly-compare-empty {
  text-align: center;
  padding: 20px 16px;
  color: var(--h-secondary);
  font-size: 13px;
  line-height: 1.6;
}
.weekly-compare-empty-icon {
  font-size: 32px;
  margin-bottom: 8px;
  opacity: 0.5;
}

/* P4: 常用能力 — 状态徽章 + accent色 */
.personal-scene-card {
  border-radius: 16px !important;
  position: relative;
  overflow: hidden;
}
/* 状态文字增强 */
.personal-scene-card .personal-scene-status {
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
}
/* 状态徽章颜色 — 基于 JS class 而非 :contains() */
.personal-scene-card .personal-scene-status.s-negative {
  background: rgba(239,68,68,0.1) !important;
  color: #EF4444 !important;
}
.personal-scene-card .personal-scene-status.s-positive {
  background: rgba(16,185,129,0.1) !important;
  color: #10B981 !important;
}
.personal-scene-card .personal-scene-status.s-blue {
  background: rgba(59,130,246,0.1) !important;
  color: #3B82F6 !important;
}
.personal-scene-card .personal-scene-status.s-purple {
  background: rgba(139,92,246,0.1) !important;
  color: #8B5CF6 !important;
}

/* cap-card 统一圆角 */
.cap-card {
  border-radius: 14px !important;
}

/* 深色模式 */
html[data-theme="dark"] .today-card.tc-neutral {
  border-left-color: rgba(255,255,255,0.08) !important;
}
html[data-theme="dark"] .weekly-compare-empty {
  color: rgba(255,255,255,0.4);
}

/* 移动端 */
@media (max-width: 768px) {
  .today-card.tc-classified {
    border-left-width: 3px !important;
  }
  .personal-scene-card {
    border-radius: 12px !important;
  }
}

/* === Inline Style Block 8 === */
/* ===== U1: 公共区精致化 ===== */

/* 功能卡片入场动画 */
.pub-uds-card {
  animation: xz-card-enter 0.4s cubic-bezier(0.2,0,0.2,1) both;
}
.pub-uds-card:nth-child(1) { animation-delay: 0s; }
.pub-uds-card:nth-child(2) { animation-delay: 0.06s; }
.pub-uds-card:nth-child(3) { animation-delay: 0.12s; }
.pub-uds-card:nth-child(4) { animation-delay: 0.18s; }
.pub-uds-card:nth-child(5) { animation-delay: 0.24s; }
.pub-uds-card:nth-child(6) { animation-delay: 0.30s; }

/* 确保阴影一致 */
.pub-uds-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.pub-uds-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.04) !important;
}

/* 近期动态空状态增强 */
.pub-uds-activity {
  border-radius: 14px;
  padding: 16px;
  background: var(--h-card);
  border: 1px solid var(--h-border);
}
.pub-uds-activity-title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}
/* 空状态引导 */
.pub-uds-activity:has(.pub-uds-empty) {
  text-align: center;
  padding: 28px 20px;
}
.pub-uds-empty,
.pub-uds-activity > div:last-child {
  font-size: 13px;
  color: var(--h-secondary);
  line-height: 1.6;
}
.pub-uds-activity::before {
  content: '';
}

/* 快捷操作按钮增强 */
.fh-public-quick-actions button,
.fh-quick-actions button,
#l1Section-public button[class*="quick"] {
  border-radius: 10px !important;
  font-weight: 500 !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}
.fh-public-quick-actions button:hover,
.fh-quick-actions button:hover,
#l1Section-public button[class*="quick"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* 深色模式 */
html[data-theme="dark"] .pub-uds-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.2), 0 1px 2px rgba(0,0,0,0.15) !important;
}
html[data-theme="dark"] .pub-uds-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.3), 0 2px 6px rgba(0,0,0,0.2) !important;
}
html[data-theme="dark"] .pub-uds-activity {
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.06);
}

/* 移动端 */
@media (max-width: 768px) {
  .pub-uds-card {
    animation: none;
  }
}

/* ===== 子页面打开时隐藏主页面内容（CSS级别，覆盖动态JS渲染） ===== */
body.ga-subpage-open #xzPageContent,
body.ga-subpage-open #xzPageContentKid,
body.ga-subpage-open .xz-timeline,
body.ga-subpage-open .xz-hero,
body.ga-subpage-open .fh-hub-section,
body.ga-subpage-open .fh-member-switcher,
body.ga-subpage-open #fhLensBarKid,
body.ga-subpage-open #fhLensBarElder,
body.ga-subpage-open .fh-lens-bar,
body.ga-subpage-open #pinnedGrid,
body.ga-subpage-open .personal-error-state,
body.ga-subpage-open .today-empty-card,
body.ga-subpage-open #weeklyCompare,
body.ga-subpage-open .xz-smart-bar,
body.ga-subpage-open .v2-zone-wrapper,
body.ga-subpage-open .v2-zone-layout,
body.ga-subpage-open .zone-hero-insight,
body.ga-subpage-open .tcf-hero-insight,
body.ga-subpage-open .tcf-shortcut-bar,
body.ga-subpage-open #inputRow {
  display: none !important;
}

/* === Today Focus PC Wrapping Enhancement === */
@media (min-width: 769px) {
  .today-scroll:not(.today-scroll-empty) .today-card {
    padding: 14px 16px !important;
    border-radius: 12px !important;
  }
  .today-scroll:not(.today-scroll-empty) .today-card .tc-icon {
    font-size: 28px !important;
    margin-bottom: 8px !important;
  }
  .today-scroll:not(.today-scroll-empty) .today-card .tc-title {
    font-size: 14px !important;
    margin-bottom: 4px !important;
  }
  .today-scroll:not(.today-scroll-empty) .today-card .tc-detail {
    font-size: 12px !important;
    line-height: 1.5 !important;
  }
}
/* Weekly compare: 2-column layout on PC */
@media (min-width: 769px) {
  .weekly-compare-body.open {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 24px !important;
  }
  .weekly-compare-row {
    flex: 1 1 calc(50% - 12px) !important;
    min-width: calc(50% - 12px) !important;
  }
}

/* === Today Focus: PC wrapping layout === */
@media (min-width: 769px) {
  #todayContent:not(.today-scroll-empty) {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
    gap: 10px !important;
  }
  #todayContent:not(.today-scroll-empty) .today-card {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    flex-basis: calc(50% - 5px) !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: calc(50% - 5px) !important;
    scroll-snap-align: none !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
  }
  #todayContent:not(.today-scroll-empty) .today-card .tc-icon {
    font-size: 28px !important;
    margin-bottom: 8px !important;
  }
  #todayContent:not(.today-scroll-empty) .today-card .tc-title {
    font-size: 14px !important;
    margin-bottom: 4px !important;
  }
  #todayContent:not(.today-scroll-empty) .today-card .tc-detail {
    font-size: 12px !important;
    line-height: 1.5 !important;
  }
}
@media (min-width: 1024px) {
  #todayContent:not(.today-scroll-empty) .today-card {
    flex-basis: calc(33.333% - 7px) !important;
    max-width: calc(33.333% - 7px) !important;
  }
}

/* === Weekly Compare: 2-column on PC === */
@media (min-width: 769px) {
  .weekly-compare-body.open {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 24px !important;
  }
  .weekly-compare-row {
    flex: 1 1 calc(50% - 12px) !important;
    min-width: calc(50% - 12px) !important;
  }
}



/* === Audit fixes 20260715 === */

/* P1: Elder card height consistency — cards with quick actions should not be 62% taller */
.elder-card { min-height: 180px !important; max-height: 220px !important; overflow: hidden !important; }
.elder-card[data-module="mood"] { overflow: hidden !important; min-height: 180px !important; max-height: 220px !important; }
.elder-card-quick { padding: 2px 8px 4px !important; }
.elder-quick-btn { padding: 3px 10px !important; font-size: 11px !important; }
.elder-mood-emoji { font-size: 16px !important; padding: 0 2px !important; }
.elder-card-status { font-size: 11px !important; padding: 2px 8px !important; }

/* P0: Kid zone baby select wrap overflow fix — use visible, not hidden, to allow dropdown */
.fh-l1-select-wrap { flex-wrap: wrap; gap: 4px; overflow: visible; max-width: 100%; }
.fh-l1-select-wrap > button { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
@media (max-width: 480px) {
  .fh-l1-select-wrap { font-size: 12px; }
}

/* P2: Mobile nav tap targets — Apple HIG minimum 44×44px */
@media (max-width: 768px) {
  .nav-logo { min-height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; }
  .nav-zone-tab { min-height: 44px !important; min-width: 44px; padding: 6px 10px !important; font-size: 13px; }
  .nav-zone-tabs { gap: 2px; }
  .fh-sidebar-close-btn { min-height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; }
  .nav-icon-btn { min-height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; }
}

/* P1: Dark mode fixes for navbar/sidebar hardcoded colors */
[data-theme="dark"] .nav-deep-link,
[data-theme="dark"] .nav-icon-btn,
[data-theme="dark"] .nav-labeled-btn {
  background: var(--h-card) !important;
  color: var(--h-text) !important;
  border-color: var(--h-border) !important;
}
[data-theme="dark"] .nav-deep-link:hover,
[data-theme="dark"] .nav-icon-btn:hover {
  background: var(--h-hover) !important;
  border-color: var(--h-accent) !important;
}
[data-theme="dark"] .nav-btn-label {
  color: var(--h-text) !important;
}
[data-theme="dark"] .fh-sidebar-home {
  background: var(--h-surface) !important;
}
[data-theme="dark"] .fh-sidebar-section-title {
  color: var(--h-secondary) !important;
}
[data-theme="dark"] .fh-l1-select-wrap button {
  background: var(--h-surface) !important;
  color: var(--h-text) !important;
  border-color: var(--h-border) !important;
}
[data-theme="dark"] .fh-l1-dropdown {
  background: var(--h-card) !important;
  border-color: var(--h-border) !important;
  box-shadow: var(--h-shadow) !important;
}
[data-theme="dark"] .fh-l1-dropdown button {
  background: var(--h-card) !important;
  color: var(--h-text) !important;
}
[data-theme="dark"] .fh-l1-dropdown button:hover {
  background: var(--h-hover) !important;
}
[data-theme="dark"] .fh-sidebar-pin-row {
  color: var(--h-text) !important;
}
[data-theme="dark"] .sidebar-left {
  background: var(--h-bg) !important;
}

/* === 移动端聊天面板强制全屏 === */
@media (max-width: 768px) {
  #xzChatPanel {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: var(--app-height, 100dvh) !important;
    max-height: var(--app-height, 100dvh) !important;
    z-index: 100000 !important;
    border-radius: 0 !important;
  }
}

/* === PC端右侧边栏显示小智宠物（不自动展开聊天） === */
@media(min-width:769px){
  .sidebar-right{
    display:flex !important;
    flex-direction:column;
    align-items:center;
    padding-top:8px;
    background:var(--h-card) !important;
    border-left:1px solid var(--h-border);
  }
  .xz-sidebar-pet{
    cursor:pointer;
    transition:transform 0.2s;
  }
  .xz-sidebar-pet:hover{
    transform:scale(1.08);
  }
  .xz-pet-label{
    color:var(--h-text) !important;
    font-size:13px;
    font-weight:600;
    margin-top:6px;
  }
  .xz-pet-hint{
    color:var(--h-secondary) !important;
    font-size:11px;
    margin-top:2px;
  }
}

/* Fix: theme.v2.css sets background:inherit !important on all buttons with selector html[data-theme] button (specificity 0,1,1)
   Need higher specificity to override. Use #fhSettingsCenterBody prefix (specificity 1,1,0) */

#fhSettingsCenterBody .fh-sc-btn-primary:hover{opacity:0.9}

#fhSettingsCenterBody .fh-sc-btn-secondary:hover{background:var(--h-hover,rgba(99,102,241,0.08)) !important}
#fhSettingsCenterBody .fh-sc-close{background:none !important}
#fhSettingsCenterBody .fh-sc-close:hover{color:var(--h-text) !important}


/* 小智陪伴 sidebar pet — card style with robot avatar */
.xz-sidebar-pet{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:10px 14px;
  border-radius:16px;
  background:rgba(99,102,241,0.06) !important;
  border:1px solid rgba(99,102,241,0.12);
  cursor:pointer;
  transition:transform 0.2s,box-shadow 0.2s;
}
.xz-sidebar-pet:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 16px rgba(99,102,241,0.15);
}
[data-theme="dark"] .xz-sidebar-pet{
  background:rgba(129,140,248,0.08) !important;
  border-color:rgba(129,140,248,0.15);
}
.xz-pet-wrap{
  width:64px;
  height:64px;
  border-radius:50%;
  display:flex !important;
  align-items:center;
  justify-content:center;
  animation:xzFloat 3s ease-in-out infinite;
}
.xz-pet-wrap svg{
  width:64px !important;
  height:64px !important;
  display:block;
}
.xz-pet-label{
  color:var(--h-text) !important;
  font-size:13px;
  font-weight:700;
  margin-top:8px;
  text-align:center;
}
.xz-pet-hint{
  color:var(--h-secondary) !important;
  font-size:11px;
  margin-top:2px;
  text-align:center;
}
@keyframes xzFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}


/* === Shopping page fixes === */
/* Width alignment: fhCapSubpage inside public zone container */
#fhPublicCapSubpage {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
#fhPublicCapSubpage #fhCapSubpage {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
#fhPublicCapSubpage #fhPubSubContent {
  width: 100% !important;
  box-sizing: border-box !important;
}
/* Shopping subpage content should fill container width */
#fhCapSubpage .pz-shop-widget,
#fhCapSubpage > div {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

/* Fix button borders in shopping page — override theme.v2.css button{background:inherit} */
#fhCapSubpage button {
  background: var(--h-card) !important;
  color: var(--h-text) !important;
  border: 1px solid var(--h-border) !important;
}
#fhCapSubpage button[style*="var(--h-accent)"] {
  background: var(--h-accent) !important;
  color: #fff !important;
  border: 1px solid var(--h-accent) !important;
}
#fhCapSubpage button[style*="background:transparent"],
#fhCapSubpage button[style*="background: transparent"] {
  background: transparent !important;
  color: var(--h-text-secondary) !important;
  border: 1px solid var(--h-border) !important;
}

/* Tab buttons in shopping */
#fhCapSubpage .shop-tab,
#fhCapSubpage #shopTabBar button {
  background: transparent !important;
  color: var(--h-text-secondary) !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
}
#fhCapSubpage .shop-tab.active,
#fhCapSubpage #shopTabBar button.active {
  color: var(--h-accent) !important;
  border-bottom-color: var(--h-accent) !important;
}


/* Fix: shop-btn-reco / shop-btn-urgent invisible in light mode
   Root cause: theme.v2.css sets html[data-theme=light] button { background: inherit !important }
   These buttons relied on a dynamically injected <style> tag from cap-shopping.js render().
   If the <style> tag isn't applied yet (timing/race), theme.v2.css makes bg=inherit (transparent/white)
   while the class color:#fff still applies => white-on-white = invisible.
   Fix: add static CSS rules here so styling doesn't depend on dynamic injection. */
#fhCapSubpage .shop-btn-reco {
  background: var(--h-accent, #6366f1) !important;
  background-color: var(--h-accent, #6366f1) !important;
  color: #fff !important;
  border: 1px solid var(--h-accent, #6366f1) !important;
}
#fhCapSubpage .shop-btn-urgent {
  background: #10b981 !important;
  background-color: #10b981 !important;
  color: #fff !important;
  border: 1px solid #10b981 !important;
}

/* Scope tab buttons */
#fhCapSubpage .pz-shop-scope-tab {
  background: transparent !important;
  color: var(--h-text-secondary) !important;
  border: none !important;
}
/* Scope tab buttons - finance (upgraded to pill style) */#fhCapSubpage .pz-fin-scope-tabs {  background: var(--h-bg-soft, #f3f4f6) !important;  border-radius: 12px !important;  padding: 4px !important;  border: 1px solid var(--h-border, #e5e7eb) !important;  border-bottom: 1px solid var(--h-border, #e5e7eb) !important;  margin-bottom: 14px !important;  display: flex !important;  gap: 4px !important;}#fhCapSubpage .pz-fin-scope-tab {  background: transparent !important;  color: var(--h-text-secondary) !important;  border: none !important;  border-radius: 9px !important;  flex: 1 !important;  padding: 9px 16px !important;  cursor: pointer !important;  transition: all 0.25s cubic-bezier(.4,0,.2,1) !important;  font-size: 14px !important;  font-weight: 500 !important;}#fhCapSubpage .pz-fin-scope-tab:hover {  color: var(--h-text) !important;  background: var(--h-card, #fff) !important;}#fhCapSubpage .pz-fin-scope-tab.active {  background: linear-gradient(135deg, #6366f1, #7c3aed) !important;  color: #fff !important;  -webkit-text-fill-color: #fff !important;  font-weight: 600 !important;  border: none !important;  border-radius: 9px !important;  box-shadow: 0 2px 8px rgba(99,102,241,0.3) !important;}
#fhCapSubpage .pz-shop-scope-tab.active {
  background: var(--h-accent) !important;
  color: #fff !important;
}

/* Scope tab buttons - calendar (pill style) */
#fhCapSubpage .pz-cal-scope-tab {
  background: transparent !important;
  color: var(--h-text-secondary) !important;
  border: none !important;
}
#fhCapSubpage .pz-cal-scope-tab.active {
  background: var(--h-accent) !important;
  color: #fff !important;
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(99,102,241,0.3);
}
html[data-theme="dark"] #fhCapSubpage .pz-cal-scope-tab.active {
  background: #818cf8 !important;
  color: #1f2937 !important;
}
#fhCapSubpage .pz-cal-scope-tab:not(.active):hover {
  background: var(--h-card-hover) !important;
}

/* Select dropdowns */
#fhCapSubpage select {
  background: var(--h-card) !important;
  color: var(--h-text) !important;
  border: 1px solid var(--h-border) !important;
}


/* === FOUC Prevention: hide old elder content by default === */
/* V2 layout (#v2ZoneLayout-elder) is injected as a separate direct child, not affected */
#l1Section-elder > .fh-subpage { display: none !important; }
#l1Section-elder > .fh-subpage-header { display: none !important; }
#elderLoadingSkeleton { display: none !important; }
/* Also hide any dynamically injected old containers that are direct children */
#l1Section-elder > .elder-s22-container { display: none !important; }
#l1Section-elder > .fh-elder-lens-content { display: none !important; }
#l1Section-elder > .elder-cards-grid { display: none !important; }
#l1Section-elder > .elder-module-bar { display: none !important; }
#l1Section-elder > .elder-func-nav { display: none !important; }
#l1Section-elder > .elder-func-grid { display: none !important; }
#l1Section-elder > .elder-tip-bar { display: none !important; }
#l1Section-elder > .elder-voice-entry { display: none !important; }
/* Show V2 layout */
#l1Section-elder > #v2ZoneLayout-elder { display: block !important; }

/* === FOUC Prevention: hide old kid content by default === */
/* V2 layout (#v2ZoneLayout-kid) is injected as a separate direct child, not affected */
#l1Section-kid > .fh-subpage { display: none !important; }
#l1Section-kid > .fh-subpage-header { display: none !important; }
#l1Section-kid > .xz-page-kid { display: none !important; }
#l1Section-kid > #xzPageContentKid { display: none !important; }
#xzKidSkeleton { display: none !important; }
#l1Section-kid > #fhKidLensContent { display: none !important; }
#l1Section-kid > #fhLensBarKid { display: none !important; }
#l1Section-kid > #fhMemberSwitcherKid { display: none !important; }
/* Show V2 layout */
#l1Section-kid > #v2ZoneLayout-kid { display: block !important; }
/* Broader kid FOUC prevention */
#l1Section-kid .xz-skeleton { display: none !important; }
#l1Section-kid .xz-page-kid { display: none !important; }

/* === Fix: Hide V2 zone layout when cap subpage opens (must beat FOUC prevention specificity) === */
body.ga-subpage-open #l1Section-kid > #v2ZoneLayout-kid,
body.ga-subpage-open #l1Section-elder > #v2ZoneLayout-elder,
body.ga-subpage-open #l1Section-me > #v2ZoneLayout-me,
body.ga-subpage-open #l1Section-public > #v2ZoneLayout-public {
  display: none !important;
}
/* === fix0719bd3: Subpage bounded alignment === */
/* Content area must respect BOTH sidebars:
   - Left: 200px sidebar
   - Right: 280px sidebar (kept visible)
   - Content stays within [200px, viewport-280px] */
body.ga-subpage-open .page {
  margin-right: 280px !important;
  max-width: calc(100vw - 480px) !important;
}
body.ga-subpage-open .fh-l1-section[data-outside-mainpage] {
  margin-right: 280px !important;
  max-width: calc(100vw - 480px) !important;
}
/* Overflow containment within subpage */
body.ga-subpage-open #fhCapSubpage {
  padding: 0 16px;
  overflow-x: hidden !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
body.ga-subpage-open .navbar {
  margin-right: 280px !important;
  max-width: calc(100vw - 480px) !important;
}
/* Cap content width on very wide screens */
@media (min-width: 1620px) {
  body.ga-subpage-open .page,
  body.ga-subpage-open .fh-l1-section[data-outside-mainpage],
  body.ga-subpage-open .navbar {
    max-width: 1280px !important;
  }
}

/* === fix0719mws: Mobile white screen fix === */
/* On mobile, right sidebar is hidden so remove the 160px margin constraint */
@media (max-width: 768px) {
  body.ga-subpage-open .page,
  body.ga-subpage-open .fh-l1-section[data-outside-mainpage],
  body.ga-subpage-open .navbar {
    margin-right: 0 !important;
    max-width: 100% !important;
  }
  body.ga-subpage-open #fhCapSubpage {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 14px !important;
    box-sizing: border-box !important;
  }
  body.ga-subpage-open #fhCapSubpage > div:first-child {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* === fix0720m2: Mobile responsive fix for travel page grids === */
@media (max-width: 640px) {
  #v2RecommendList > div:last-child { grid-template-columns: 1fr !important; }
  #v2TravelRecommend + div { grid-template-columns: 1fr !important; }
  #v2TravelRecommend + div > div:first-child > div:first-child { grid-template-columns: 1fr !important; }
  [id^="v2Travel"] [style*="repeat(2,1fr)"] { grid-template-columns: 1fr !important; }
  #fhCapSubpage [style*="grid-template-columns:1fr 1fr"]:not([data-keep-2col]) { grid-template-columns: 1fr !important; }
  #fhCapSubpage [style*="grid-template-columns:repeat(2"]:not([data-keep-2col]) { grid-template-columns: 1fr !important; }
  #fhCapSubpage [style*="grid-template-columns:repeat(3"]:not([data-keep-2col]) { grid-template-columns: 1fr 1fr !important; }
}


/* ===== fix0721sb: 孩子区左侧边栏一屏适配 ===== */
/* 目标：720px视口下完整展示，不改变功能内容 */

/* 1. Home卡片：padding 12px→8px，margin 8/4→4/2 */
.fh-sidebar-home { padding: 5px !important; margin: 4px 0 2px !important; }

/* 2. 切换区section：margin-bottom 12px→6px */
.fh-sidebar-section { margin-bottom: 6px !important; }
.fh-sidebar-section-title { font-size: 11px !important; margin-bottom: 4px !important; }

/* 3. Divider：margin 8/8→3/3 */
.fh-sidebar-divider { margin: 3px 0 !important; }

/* 4. Baby section内部压缩 */
/* PIN row + Weather row：padding 6/10→4/8，margin-top→3px */
.fh-sidebar-pin-row { padding: 4px 8px !important; margin-top: 3px !important; font-size: 11px !important; }
.fh-sidebar-pin-row button { padding: 2px 8px !important; font-size: 10px !important; }

/* Baby selector按钮：压缩高度 */
.fh-l1-select { padding: 6px 10px !important; font-size: 13px !important; }
.fh-baby-edit-btn { padding: 4px !important; }

/* Reading badge压缩 */
.fh-sidebar-reading-badge { padding: 3px 8px !important; margin-top: 3px !important; font-size: 11px !important; }

/* 关系链管理按钮压缩 */
.fh-sidebar-item { padding: 6px 10px !important; font-size: 13px !important; }
.fh-sidebar-item .fh-sidebar-emoji svg { width: 16px !important; height: 16px !important; }

/* 5. 深度助手链接：padding 10/10→6/8 */
a.fh-sidebar-item[style*="deep-assistant"],
a.fh-sidebar-item[href*="deep-assistant"] {
  padding: 6px 10px !important;
  margin-bottom: 4px !important;
}
a.fh-sidebar-item[style*="deep-assistant"] div:first-child + div,
a.fh-sidebar-item[href*="deep-assistant"] div:first-child + div {
  font-size: 12px !important;
}
a.fh-sidebar-item[style*="deep-assistant"] div:last-child,
a.fh-sidebar-item[href*="deep-assistant"] div:last-child {
  font-size: 10px !important;
}

/* 6. 账号区压缩 */
.fh-sidebar-account-wrap { padding-top: 6px !important; }
.fh-sidebar-account { padding: 6px 8px !important; }
.fh-sidebar-account-avatar { width: 28px !important; height: 28px !important; font-size: 16px !important; }
.fh-sidebar-account-name { font-size: 12px !important; }
.fh-sidebar-account-role { font-size: 10px !important; }

/* 7. 侧边栏允许滚动作为兜底 */
.fh-sidebar { overflow-y: auto !important; -webkit-overflow-scrolling: touch; }
.fh-sidebar::-webkit-scrollbar { width: 3px; }
.fh-sidebar::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.1); border-radius: 2px; }

/* 8. 隐藏重复的divider（baby section后面有两个divider，隐藏第二个） */
.fh-sidebar-divider#fhSidebarBabyDivider + .fh-sidebar-divider { display: none !important; }

/* 9. fh-sidebar-home-name/meta 压缩 */
.fh-sidebar-home-name { font-size: 13px !important; }
.fh-sidebar-home-meta { margin-top: 1px !important; }
#fhSidebarHomeCount { font-size: 10px !important; }

/* 10. PC端L1 select dropdown压缩 */
.fh-l1-option { padding: 6px 10px !important; font-size: 12px !important; }
.fh-l1-option-hint { font-size: 10px !important; }

/* fix0723hs1: Hero-navbar spacing consistency - zero out #mainPage height on mobile when non-me zone active,
   keep 8px top padding to match me zone's hero-to-navbar gap */
@media (max-width: 768px) {
  body[data-l1-active]:not([data-l1-active="me"]) #mainPage {
    padding: 8px 14px 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  body[data-l1-active].ga-subpage-open:not([data-l1-active="me"]) #mainPage {
    height: auto !important;
    overflow: visible !important;
  }
}

/* SOS按钮靠近小智陪伴 — 减小上边距 */
.sidebar-right .emer-sos-fab-sidebar {
  margin: 4px auto 8px !important;
}


/* ====== P1#6: Settings Center Mobile Responsive ====== */
@media (max-width: 568px) {
  .fh-sc-content {
    max-width: 100% !important;
    max-height: 90vh !important;
    border-radius: 12px !important;
    margin: 0 8px !important;
  }
  .fh-sc-modal {
    padding: 0 !important;
  }
  .fh-sc-header {
    padding: 12px 14px !important;
  }
  .fh-sc-title {
    font-size: 15px !important;
  }
  .fh-sc-tabs {
    padding: 0 4px !important;
    gap: 2px !important;
    -webkit-overflow-scrolling: touch;
  }
  .fh-sc-tab {
    padding: 8px 10px !important;
    font-size: 12px !important;
  }
  .fh-sc-body {
    padding: 12px 14px !important;
  }
  .fh-sc-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
  }
  .fh-sc-label {
    min-width: 0 !important;
  }
  .fh-sc-input {
    width: 100% !important;
  }
  .fh-sc-actions {
    flex-direction: column-reverse !important;
  }
  .fh-sc-actions button {
    width: 100% !important;
  }
  .fh-privacy-row {
    padding: 8px 4px !important;
  }
  .fh-privacy-asymmetry {
    flex-direction: column !important;
  }
  .fh-type-selector {
    flex-wrap: wrap !important;
  }
  .fh-type-pill {
    font-size: 12px !important;
    padding: 6px 10px !important;
  }
  .fh-invite-target-row {
    padding: 10px 8px !important;
  }
}

/* === fix0730sc8: 设置中心按钮浅色模式不可见 + 操作按钮遮挡修复 === */
/* 根因: theme.v2.css 的 html[data-theme=light] button { background: inherit !important } 特异性(0,1,1)压过 .fh-sc-btn-primary(0,1,0) */
/* 修复: 用 html[data-theme] 前缀提升特异性到(0,2,1) */
html[data-theme=light] .fh-sc-btn-primary,
html[data-theme=dark] .fh-sc-btn-primary {
    background: var(--h-accent) !important;
    background-color: var(--h-accent) !important;
    color: #fff !important;
    border-color: var(--h-accent) !important;
}
html[data-theme=light] .fh-sc-btn-secondary,
html[data-theme=dark] .fh-sc-btn-secondary {
    background: var(--h-card) !important;
    background-color: var(--h-card) !important;
    color: var(--h-text) !important;
    border-color: var(--h-border) !important;
}
/* 操作按钮 sticky 固定在弹窗底部，解决内容溢出时按钮不可见 */
.fh-sc-actions {
    position: sticky !important;
    bottom: 0 !important;
    background: var(--h-card) !important;
    z-index: 10 !important;
}

/* === fix0730sc9: 设置中心审计修复 === */

/* Fix A: 退出共享按钮颜色被 fix0730sc8 的 !important 覆盖 */
/* 根因: html[data-theme] .fh-sc-btn-primary { background: var(--h-accent) !important } 覆盖了内联 style="background:var(--h-danger)" */
/* 修复: 对含 h-danger 内联样式的按钮单独设置 */
html[data-theme=light] .fh-sc-btn-primary[style*="h-danger"],
html[data-theme=dark] .fh-sc-btn-primary[style*="h-danger"] {
    background: var(--h-danger, #ef4444) !important;
    background-color: var(--h-danger, #ef4444) !important;
    border-color: var(--h-danger, #ef4444) !important;
    color: #fff !important;
}

/* Fix B: 移动端 Tab 栏溢出 - 6个Tab在375px宽度下需要横向滚动 */
@media (max-width: 480px) {
    .fh-sc-tabs {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .fh-sc-tabs::-webkit-scrollbar {
        display: none;
    }
    .fh-sc-tab {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
        padding: 8px 12px !important;
        font-size: 13px !important;
    }
}

/* Fix C: 隐私 Tab 内容溢出 - 增加 maxHeight 让更多内容可见 */
.fh-sc-content {
    max-height: 90vh !important;
}
.fh-sc-body {
    max-height: calc(90vh - 110px) !important;
}

/* Fix D: 隐私 Tab 紧凑布局 - 减少间距让内容在视口内 */
.fh-privacy-row {
    padding: 5px 0 !important;
}
.fh-privacy-section-title {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
}
.fh-privacy-asymmetry-col {
    padding: 5px !important;
}
.fh-privacy-asymmetry-col p {
    font-size: 11px !important;
    line-height: 1.4 !important;
}

/* === fix0730sc12: 隐私面板视觉修复 === */

/* Fix A: Selected pill 选中状态不可见 — 根因: [data-theme=light] .fh-type-pill 特异性(0,2,0) 与 .fh-type-pill.selected(0,2,0) 相同, 但前者靠后覆盖了 selected 状态 */
/* 修复: 用 [data-theme] 前缀提升 selected 规则特异性到 (0,3,0) */
html[data-theme=light] .fh-type-pill.selected,
html[data-theme=dark] .fh-type-pill.selected {
    background: var(--h-accent, #6366f1) !important;
    background-color: var(--h-accent, #6366f1) !important;
    color: #fff !important;
    border-color: var(--h-accent, #6366f1) !important;
}

/* Fix B: 描述文字低对比度 — color 从 gray-500(#6b7280) 提升到 gray-600(#4b5563), font-size 从 11px 提升到 12px */
.fh-privacy-row-desc {
    color: #4b5563 !important;
    font-size: 12px !important;
}
html[data-theme=dark] .fh-privacy-row-desc {
    color: #9ca3af !important;
}

/* Fix C: 底部提示文字字号 11px → 12px */
.fh-sc-section > div[style*="font-size:11px"] {
    font-size: 12px !important;
}


/* === fix0730sc15: 可交互隐私卡片 === */
.fh-priv-card {
  border: 1px solid var(--h-border);
  border-radius: 10px;
  overflow: hidden;
  transition: border-color 0.2s;
}
.fh-priv-card + .fh-priv-card { margin-top: 8px; }
.fh-priv-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s;
}
.fh-priv-card-header:hover { background: var(--h-hover, rgba(99,102,241,0.06)); }
.fh-priv-card-icon { font-size: 18px; flex-shrink: 0; }
.fh-priv-card-info { flex: 1; min-width: 0; }
.fh-priv-card-title { font-size: 14px; font-weight: 600; color: var(--h-text); }
.fh-priv-card-summary { font-size: 11px; color: var(--h-secondary); margin-top: 2px; }
.fh-priv-card-chevron {
  font-size: 12px; color: var(--h-secondary); flex-shrink: 0;
  transition: transform 0.2s; width: 16px; text-align: center;
}
.fh-priv-card[data-expanded="true"] .fh-priv-card-chevron { transform: rotate(180deg); }
.fh-priv-card-body {
  padding: 0 12px 10px;
  display: none;
}
.fh-priv-card[data-expanded="true"] .fh-priv-card-body { display: block; }
.fh-priv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.fh-priv-grid-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--h-bg-soft, var(--h-surface));
  cursor: pointer;
  transition: background 0.15s;
  user-select: none;
}
.fh-priv-grid-item:hover { background: var(--h-hover, rgba(99,102,241,0.08)); }
.fh-priv-grid-icon { font-size: 16px; flex-shrink: 0; }
.fh-priv-grid-name { font-size: 13px; color: var(--h-text); flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fh-priv-grid-item .fh-privacy-toggle { width: 36px; height: 20px; flex-shrink: 0; }
.fh-priv-badge {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  font-weight: 500; flex-shrink: 0; white-space: nowrap;
}
.fh-priv-badge.on { background: rgba(16,185,129,0.12); color: #10b981; }
.fh-priv-badge.off { background: rgba(156,163,175,0.12); color: #9ca3af; }
html[data-theme=dark] .fh-priv-badge.on { background: rgba(52,211,153,0.15); color: #34d399; }
html[data-theme=dark] .fh-priv-badge.off { background: rgba(148,163,184,0.12); color: #94a3b8; }
.fh-priv-note {
  font-size: 11px; color: var(--h-secondary); line-height: 1.5;
  margin-top: 8px; padding: 0 4px;
}
.fh-privacy-toggle {
  width: 40px; height: 22px; border-radius: 11px;
  background: #d1d5db; position: relative; cursor: pointer;
  transition: background 0.2s; flex-shrink: 0;
}
.fh-privacy-toggle::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 18px; height: 18px; border-radius: 50%;
  background: #fff; transition: transform 0.2s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.fh-privacy-toggle.on { background: var(--h-accent, #6366f1); }
.fh-privacy-toggle.on::after { transform: translateX(18px); }
html[data-theme=dark] .fh-privacy-toggle { background: #374151; }
html[data-theme=dark] .fh-privacy-toggle.on { background: var(--h-accent, #818cf8); }
@media (max-width: 480px) {
  .fh-priv-grid { grid-template-columns: 1fr !important; }
  .fh-priv-grid-item { padding: 7px 10px !important; }
}

/* === fix0730sc13: nav-user button background override === */
/* Root cause: bundle-core.css has html[data-theme=light] button { background: inherit !important } which overrides nav-user.js inline background */
/* Fix: restore nav-user button background with !important + data-theme specificity */
html[data-theme=light] #userMenuBtn,
html[data-theme=light] #userMenuBtnMobile {
    background: #F4F6F8 !important;
    color: #1A1D26 !important;
}
html[data-theme=dark] #userMenuBtn,
html[data-theme=dark] #userMenuBtnMobile {
    background: rgba(255,255,255,0.06) !important;
    color: #e5e7eb !important;
}
/* Also fix dropdown background */
html[data-theme=light] #userMenuDD,
html[data-theme=light] #userMenuDDMobile {
    background: #ffffff !important;
}
html[data-theme=dark] #userMenuDD,
html[data-theme=dark] #userMenuDDMobile {
    background: rgba(15,23,42,0.98) !important;
}
