:root{--v5-paper:#fffaf7;--v5-white:#fffefd;--v5-rose:#e66f9a;--v5-berry:#ad4f72;--v5-ink:#30272a;--v5-muted:#9b858d;--v5-line:rgba(191,139,157,.22);--v5-shadow:0 16px 38px rgba(102,66,80,.075)}

/* V5 removes legacy geometry from the current task components. */
#view-today .task-edit{position:absolute!important;z-index:6!important;top:52px!important;right:16px!important;bottom:auto!important;display:grid!important;width:38px!important;height:38px!important;padding:0!important;place-items:center!important;overflow:visible!important;border:1px solid rgba(209,153,174,.28)!important;border-radius:14px!important;background:rgba(255,255,255,.86)!important;box-shadow:0 8px 18px rgba(119,75,91,.07)!important;font-size:0!important;backdrop-filter:blur(10px)}
#view-today .task-edit:before{display:none!important}
#view-today .task-edit img{display:block;width:17px;height:17px;opacity:.72}
#view-today .task-edit:active{transform:scale(.94)!important}

#view-today .task-stage.list-mode .card-stack{display:none!important}
#view-today .task-stage.cards-mode .task-list-mode{display:none!important}
#view-today .task-stage.list-mode .task-list-mode{display:grid!important}
#view-today .task-list-mode{gap:10px!important}
#view-today .task-list-summary{display:flex!important;margin:0 2px 2px!important;padding:0!important;align-items:end!important;justify-content:space-between!important;color:inherit!important}
#view-today .task-list-summary b{margin:3px 0 0!important;padding:0!important;background:none!important;color:var(--v5-ink)!important;font-size:18px!important}
#view-today .list-task,#view-today .list-task.active,#view-today .task-timeline .list-task{position:relative!important;display:grid!important;width:100%!important;grid-template-columns:58px minmax(0,1fr) 84px 38px!important;grid-template-rows:auto!important;align-items:center!important;gap:10px!important;min-height:112px!important;margin:0!important;padding:13px 12px!important;overflow:hidden!important;border:1px solid var(--v5-line)!important;border-radius:24px!important;background:rgba(255,255,255,.82)!important;box-shadow:none!important}
#view-today .list-task.active{min-height:156px!important;background:linear-gradient(145deg,#fff8fa,#f8f3fb)!important;box-shadow:0 14px 32px rgba(111,70,86,.065)!important}
#view-today .list-task:before,#view-today .task-timeline:before,#view-today .task-timeline .list-task:before{display:none!important}
#view-today .list-task time,#view-today .list-task.active time,#view-today .task-timeline .list-task time{position:static!important;align-self:start!important;margin:0!important;padding:8px 7px!important;border-radius:12px!important;background:#fff!important;font-size:11px!important;text-align:center!important;box-shadow:0 6px 14px rgba(105,69,82,.05)!important}
#view-today .list-task-copy,#view-today .list-task.active .list-task-copy,#view-today .task-timeline .list-task>div{position:static!important;width:100%!important;min-width:0!important;margin:0!important}
#view-today .list-task small{display:block!important;color:#b36380!important;font-size:7px!important;line-height:1.35!important;letter-spacing:0!important;white-space:normal!important}
#view-today .list-task h3,#view-today .list-task.active h3,#view-today .task-timeline .list-task h3{margin:5px 0 4px!important;overflow:hidden!important;font-size:14px!important;line-height:1.25!important;text-overflow:ellipsis!important;white-space:nowrap!important}
#view-today .list-task p,#view-today .list-task.active p,#view-today .task-timeline .list-task p{display:-webkit-box!important;margin:0!important;overflow:hidden!important;color:var(--v5-muted)!important;font-size:8px!important;line-height:1.45!important;white-space:normal!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important}
#view-today .task-art-frame,#view-today .list-task.active .task-art-frame,#view-today .task-timeline .task-art-frame{position:static!important;display:grid!important;width:82px!important;height:86px!important;align-self:center!important;justify-self:center!important;place-items:center!important;overflow:visible!important}
#view-today .task-art-frame img,#view-today .list-task.active .task-art-frame img,#view-today .task-timeline .task-art-frame img{display:block!important;width:80px!important;height:80px!important;object-fit:contain!important;object-position:center!important}
#view-today .list-task>button,#view-today .list-task.active>button,#view-today .task-timeline .list-task>button{position:static!important;display:grid!important;width:36px!important;height:36px!important;align-self:center!important;justify-self:end!important;padding:0!important;place-items:center!important;transform:none!important;border:1px solid rgba(216,170,187,.4)!important;border-radius:13px!important;background:#fff!important;color:#cf6c91!important;font-size:13px!important}
#view-today .list-task-progress,#view-today .list-task.active .list-task-progress{position:static!important;display:flex!important;margin-top:9px!important;gap:6px!important}
#view-today .list-task-progress i{position:static!important;width:54px!important;height:4px!important;flex:none!important;background:#efdae2!important}
#view-today .task-timeline{display:grid!important;gap:8px!important;padding:0!important}

/* Consistent illustrated metrics and insight. */
.home-metrics>button{min-height:74px!important;padding:9px!important;background:rgba(255,255,255,.8)!important}
.home-metrics .metric-art{display:grid;width:42px;height:42px;padding:3px;place-items:center;overflow:visible;border-radius:15px;background:linear-gradient(145deg,#fff,#f9eaf0)}
.home-metrics .metric-art:before{display:none!important}
.home-metrics .metric-art img{display:block;width:39px;height:39px;object-fit:contain;object-position:center}
.home-insight{grid-template-columns:52px minmax(0,1fr) 32px!important;padding:13px 14px!important;border:1px solid rgba(212,166,183,.18);background:linear-gradient(135deg,#fbf1f7,#fff5e9)!important}
.home-insight .ai-mark{width:48px!important;height:48px!important;border-radius:17px!important;background:linear-gradient(145deg,#c45b83,#a84d71)!important;box-shadow:0 10px 20px rgba(173,74,112,.15)}

/* Ledger stage is one scene; quick actions share one cartoon language. */
.ledger-summary-stage{min-height:302px!important}
.ledger-kitty-shelf{right:0!important;bottom:0!important;width:64%!important;height:154px!important;border-bottom-width:7px!important}
.ledger-kitty-shelf>img{bottom:2px!important;width:152px!important;height:152px!important}
.safe-spend-bubble{left:-92px!important;bottom:53px!important;min-width:116px!important}
.ledger-quick-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin:11px 0 14px!important;padding:7px!important;overflow:visible!important;border:0!important;border-radius:23px!important;background:#f8eff2!important;box-shadow:none!important}
.ledger-quick-actions button{display:grid!important;grid-template-columns:48px minmax(0,1fr)!important;gap:7px!important;min-height:70px!important;padding:8px!important;overflow:hidden!important;border:1px solid transparent!important;border-right:0!important;border-radius:18px!important;background:rgba(255,255,255,.88)!important;outline:0!important;text-align:left!important;box-shadow:0 7px 18px rgba(106,70,83,.035)!important}
.ledger-quick-actions button:focus-visible{border-color:#e681a5!important;box-shadow:0 0 0 3px rgba(230,129,165,.16)!important}
.ledger-quick-actions i{display:grid!important;width:48px!important;height:48px!important;place-items:center!important;overflow:visible!important;border:0!important;border-radius:15px!important;background:linear-gradient(145deg,#fff,#fbe8ef)!important}
.ledger-quick-actions button:nth-child(2) i{background:linear-gradient(145deg,#fff4f8,#eee8fa)!important}
.ledger-quick-actions button:nth-child(3) i{background:linear-gradient(145deg,#fff9e9,#fff1d2)!important}
.ledger-quick-actions i img,.ledger-quick-actions button:first-child i img{display:block!important;width:46px!important;height:46px!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important}
.ledger-quick-actions b{font-size:9px!important;line-height:1.2!important}
.ledger-quick-actions small{margin-top:4px!important;font-size:6px!important;line-height:1.35!important;white-space:normal!important}

/* Small profile art gets its own safe frame instead of shrinking the full artwork blindly. */
.profile-avatar-button{width:50px!important;height:50px!important;padding:3px!important;overflow:visible!important;border-color:rgba(218,172,189,.3)!important;background:linear-gradient(145deg,#fff,#fff1f6)!important}
.profile-avatar-button>img{width:44px!important;height:44px!important;object-fit:contain!important;object-position:center!important}
.profile-avatar-button>i{right:1px!important;top:1px!important}
.control-grid>button{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:104px auto!important;min-height:186px!important;padding:12px 13px 15px!important;overflow:hidden!important}
.control-grid>button>span{display:grid!important;width:100%!important;height:104px!important;place-items:center!important;overflow:visible!important;background:transparent!important}
.control-grid>button>span img{display:block!important;width:104px!important;height:104px!important;object-fit:contain!important;object-position:center!important}
.control-grid>button>div{min-width:0!important;padding-right:16px}
.control-grid>button>em{right:12px!important;top:12px!important}

/* Compact, purposeful add panel. */
.sheet.sheet-compact{min-height:0!important;max-height:min(78svh,650px)!important}
.sheet.sheet-compact .sheet-content{padding-bottom:12px!important}
.sheet.sheet-compact .composer{margin-top:8px!important}
.add-content-panel{display:grid;gap:10px}
.add-content-intro{margin:0;padding:12px 14px;border-radius:18px;background:#fbf1f5;color:#806f76;font-size:9px;line-height:1.55}
.add-content-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.add-content-options button{display:grid;min-height:126px;align-content:center;justify-items:center;gap:7px;padding:10px 5px;border:1px solid var(--v5-line);border-radius:21px;background:#fff;text-align:center;box-shadow:0 9px 22px rgba(106,70,83,.04)}
.add-content-options button:active{transform:scale(.97)}
.add-content-options img{width:62px;height:62px;object-fit:contain}
.add-content-options b{font-size:10px}.add-content-options small{color:var(--v5-muted);font-size:7px}

/* Animated water experience replaces the old static hero. */
.water-experience{display:grid;justify-items:center;gap:12px}
.water-stage{position:relative;display:grid;width:100%;min-height:292px;place-items:center;overflow:hidden;border-radius:28px;background:radial-gradient(circle at 50% 42%,#fff 0 24%,#f7edf4 54%,#e9f4f3 100%)}
.water-stage:before,.water-stage:after{position:absolute;border-radius:50%;content:"";pointer-events:none}
.water-stage:before{width:210px;height:210px;border:1px solid rgba(120,174,187,.18)}
.water-stage:after{width:150px;height:150px;border:1px dashed rgba(224,126,160,.22);animation:waterOrbit 9s linear infinite}
.water-stage img{position:relative;z-index:2;width:230px;height:230px;object-fit:contain;object-position:center}
.water-copy{text-align:center}.water-copy h3{margin:0;font-size:22px}.water-copy p{margin:6px auto 0;max-width:290px;color:var(--v5-muted);font-size:9px;line-height:1.55}
.water-progress{display:grid;width:100%;grid-template-columns:repeat(8,1fr);gap:5px}
.water-progress i{height:8px;border-radius:99px;background:#eadfe3;transition:background .3s,transform .3s}
.water-progress i.filled{background:linear-gradient(90deg,#8cc8d9,#76afc4);transform:translateY(-1px)}
.water-actions{display:grid;width:100%;grid-template-columns:1.4fr 1fr 1fr;gap:8px}
.water-actions button{min-height:44px;padding:9px 6px;border-radius:16px;background:#f7edf1;color:#9d4d6b;font-size:8px}
.water-actions .water-primary{background:linear-gradient(135deg,#d65f8b,#e983a7);color:#fff;font-size:9px;font-weight:850;box-shadow:0 10px 22px rgba(194,78,121,.17)}
.water-actions .water-primary:disabled{background:#e9dfe3;color:#aa9ba0;box-shadow:none}
.water-stage.celebrate img{animation:waterCelebrate .62s cubic-bezier(.2,.75,.2,1)}
@keyframes waterOrbit{to{transform:rotate(360deg)}}
@keyframes waterCelebrate{0%{transform:scale(.96)}55%{transform:scale(1.035) translateY(-4px)}100%{transform:none}}

@media(max-width:380px){
  #view-today .list-task,#view-today .list-task.active,#view-today .task-timeline .list-task{grid-template-columns:52px minmax(0,1fr) 70px 34px!important;gap:7px!important}
  #view-today .task-art-frame,#view-today .task-art-frame img{width:68px!important;height:68px!important}
  .ledger-quick-actions button{grid-template-columns:42px minmax(0,1fr)!important;padding:6px!important}.ledger-quick-actions i,.ledger-quick-actions i img{width:42px!important;height:42px!important}
  .add-content-options{grid-template-columns:1fr}.add-content-options button{grid-template-columns:64px 1fr;min-height:76px;text-align:left;justify-items:start}
}

@media(prefers-reduced-motion:reduce){.water-stage:after,.water-stage.celebrate img{animation:none!important}}
/* Production readiness: consistent media framing, offline feedback and AI states. */
.app-shell img,
.sheet img {
  max-width: 100%;
}

#view-today .mood-rail {
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:3px;
  overflow:visible;
}
#view-today .mood-rail button { min-width:0!important; padding-inline:1px; }
#view-today .mood-rail i,
#view-today .mood-rail i img { width:40px; height:40px; }

.profile-avatar-button img,
.archive-card span img,
.control-grid span img,
.health-module img,
.task-card img,
.list-task img,
.ledger-tool img,
.ledger-category-card img {
  object-fit: contain;
  object-position: center;
}

.health-grid button > i {
  position:static!important;
  inset:auto!important;
  transform:none!important;
}

.ai-loading-state,
.ai-answer-card {
  min-height: 180px;
  padding: 32px 24px;
  border: 1px solid rgba(185,87,122,.14);
  border-radius: 28px;
  background: linear-gradient(145deg,rgba(255,255,255,.96),rgba(250,232,241,.72));
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  text-align: center;
}

.ai-loading-state span {
  width: 42px;
  height: 42px;
  border: 4px solid rgba(185,87,122,.13);
  border-top-color: #b9577a;
  border-radius: 50%;
  animation: kitty-ai-spin .9s linear infinite;
}

.ai-answer-card small { color:#b9577a; letter-spacing:.16em; font-weight:800; }
.ai-answer-card p { margin:0; color:#36272d; font-size:17px; line-height:1.7; }
.ai-answer-card span { color:#8c6a77; font-size:13px; }
.ai-answer-card.offline { background:linear-gradient(145deg,#fffaf6,#f4f3ee); }

.platform-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:18px 0 10px;
}
.platform-actions button {
  min-height:52px;
  border:1px solid rgba(185,87,122,.18);
  border-radius:18px;
  background:#fff;
  color:#8d3e60;
  font-weight:750;
}

.sheet,
.sheet-content {
  scrollbar-width:none;
}
.sheet::-webkit-scrollbar,
.sheet-content::-webkit-scrollbar { display:none; }

input[type="number"] { appearance:textfield; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { margin:0; appearance:none; }

.view-toggle button { min-height:36px; }
.home-overview-heading button,
.compact-insight button { min-height:36px; }

.import-options.is-loading { opacity:.55; pointer-events:none; }

html.is-offline::after {
  content:'当前离线 · 本地记录仍可使用';
  position:fixed;
  left:50%;
  bottom:calc(92px + env(safe-area-inset-bottom));
  z-index:1000;
  transform:translateX(-50%);
  padding:9px 14px;
  border-radius:999px;
  background:rgba(67,55,59,.92);
  color:#fff;
  font-size:12px;
  white-space:nowrap;
  box-shadow:0 10px 30px rgba(45,30,36,.16);
}

@keyframes kitty-ai-spin { to { transform:rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  .ai-loading-state span { animation-duration:1.8s; }
}