/* ============================================================
   一盏茶 · 宋式表面
   月白底、墨灰字、竹青只做锚点、缃色只做一线。
   动效参数与 tea-ritual.js 的 config 对齐。
   ============================================================ */

:root {
  --paper: #F7F5F0;
  --paper-2: #F3EFE6;
  --ink: #3A3A38;
  --ink-soft: #8A8175;
  --tea: #8C6A3E;
  --tea-deep: #5C4030;
  --bamboo: #4F6F5A;
  --xiang: #C4A574;
  --line: rgba(92, 64, 48, .15);
  --bg: var(--paper);
  --text: var(--ink);
  --muted: var(--ink-soft);
  --primary: var(--bamboo);
  --primary-dark: #3E5A48;
}

html { background: var(--paper); }
body.tea-paper {
  background: var(--paper);
  color: var(--ink);
}

/* 宣纸纤维：小块重复，不铺整屏大图 */
body.tea-paper::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .55;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .32  0 0 0 0 .26  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.35'/></svg>");
  background-size: 140px 140px;
  mix-blend-mode: multiply;
}
.app-container { z-index: 1; background: transparent; }

.board-page, .today-page, .stats-page, .weekly-page, .me-page, .focus-page {
  background: transparent;
}

.page-title, .tea-poem, .seal-label, .tea-kicker, .timer-time, .list-ritual-num {
  font-family: "Songti SC", "STSong", "SimSun", "PMingLiU", "Noto Serif SC", serif;
}
.page-title {
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--ink);
}
.page-sub, .section-title { color: var(--ink-soft); }
.section-title { font-weight: 600; letter-spacing: .06em; }

.card, .pipeline, .goal-tags-card, .daily-item, .sched-item, .habit-card,
.history-item, .stat-item, .flash-note-item, .reflect-card, .me-card,
.target-card, .empty-card {
  /* 0.72 太透，底下的纸纹会从卡片里渗出来，字发灰。留 0.94 的纸感就够了 */
  background: rgba(255, 253, 248, .94);
  border: 1px solid var(--line);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.bottom-nav {
  background: rgba(247, 245, 240, .94);
  border-top: 1px solid var(--line);
  box-shadow: none;
  backdrop-filter: none;
}
.nav-btn { color: var(--ink-soft); border-radius: 0; gap: 4px; letter-spacing: .08em; }
.nav-btn.active { color: var(--bamboo); background: transparent; }
.nav-mark {
  width: 14px; height: 14px; border-radius: 50%;
  border: 1px solid rgba(92, 64, 48, .35);
  display: block;
}
.nav-btn.active .nav-mark {
  background: var(--bamboo);
  border-color: var(--bamboo);
  box-shadow: 0 0 0 3px rgba(79, 111, 90, .12);
}

.primary-wide-btn, .list-add-btn, .me-row-btn, .add-btn, .sub-tab.active,
.day-chip.active {
  background: var(--bamboo);
}
.seg-period {
  background: #fff;
  border: 1px solid var(--line);
}
.seg-period .seg-chip {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: transparent;
  color: var(--ink-soft);
  letter-spacing: .08em;
}
.seg-period .seg-chip.active {
  background: #fff;
  color: var(--bamboo);
  box-shadow: inset 0 -2px 0 var(--bamboo);
}
.sub-tab.active { box-shadow: none; }
.ghost-action {
  background: transparent;
  color: var(--bamboo);
  border: 1px solid var(--line);
  border-radius: 999px;
}

/* ---------- 页签：茶汤轻晃，不用圆形扩散 ---------- */
.page-content { transition: none; }
.page-content.tea-leave {
  transform: translateY(10px);
  opacity: 0;
  transition: transform 180ms cubic-bezier(.2,.7,.3,1), opacity 180ms linear;
}
.page-content.tea-enter {
  transform: translateY(14px);
  opacity: 0;
}
.page-content.tea-enter-on {
  transform: none;
  opacity: 1;
  transition: transform 300ms cubic-bezier(.2,.7,.3,1), opacity 260ms linear;
}
body.is-turn-lock .page-content,
body.is-turn-lock .bottom-nav { pointer-events: none; }

/* ---------- 专注：一屏放下 ---------- */
.focus-page {
  height: 100%;
  min-height: 0;
  padding: 6px 16px 8px;
  justify-content: flex-start;
}
.focus-container {
  max-width: 340px;
  gap: 6px;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  justify-content: flex-start;
  padding-bottom: 0;
}
.focus-page .tea-kicker { font-size: 11px; letter-spacing: .36em; }
.focus-page .tea-poem { font-size: 13px; min-height: 1.2em; }
.focus-page .mode-switch { padding: 3px; border-radius: 12px; }
.focus-page .mode-chip { padding: 6px 4px; font-size: 13px; }
.focus-page .task-picker { padding: 8px 12px; border-radius: 12px; background: #fff; }
.focus-page .soundscape {
  gap: 6px;
  padding: 8px 10px;
  border-radius: 14px;
  background: #fff;
  flex-shrink: 0;
}
.focus-page .soundscape-open { padding: 7px 10px; background: #fff; }
.focus-page .mix-chips:empty { display: none; }
.tea-kicker {
  margin: 0;
  font-size: 12px;
  letter-spacing: .42em;
  color: var(--xiang);
  text-indent: .42em;
}
.tea-poem {
  margin: 0;
  min-height: 1.4em;
  font-size: 14px;
  letter-spacing: .12em;
  color: var(--ink-soft);
  text-align: center;
}
.tea-cup-wrap, #ring-container.tea-cup-wrap {
  width: 100%;
  height: auto;
  flex: 1 1 auto;
  min-height: 72px;
  max-height: 168px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  box-shadow: none;
  border-radius: 0;
  animation: none;
}
.tea-cup-svg {
  width: auto;
  height: 100%;
  max-height: 168px;
  display: block;
  margin: 0 auto;
  overflow: visible;
}
.tea-wave-x { animation: teaWave 3.8s linear infinite; }
@keyframes teaWave {
  from { transform: translateX(0); }
  to { transform: translateX(-60px); }
}
#ring-container.is-idle .tea-cup-svg {
  animation: cupBreath 5.5s ease-in-out infinite;
  transform-origin: center 62%;
  transform-box: fill-box;
}
@keyframes cupBreath {
  0%, 100% { transform: scale(.998); }
  50% { transform: scale(1.002); }
}
.cup-glaze { opacity: 0; }
#ring-container.is-glaze .cup-glaze {
  animation: glazeSweep 680ms cubic-bezier(.2,.6,.4,1) forwards;
}
@keyframes glazeSweep {
  0% { opacity: 0; transform: translateY(28px); }
  35% { opacity: .9; }
  100% { opacity: 0; transform: translateY(-78px); }
}
.tea-steam { opacity: 0; }
#ring-container.is-steam .tea-steam { opacity: 1; }
#ring-container.is-steam .tea-steam path {
  animation: teaSteam 2.8s ease-in-out infinite;
}
#ring-container.is-steam .tea-steam path:nth-child(2) { animation-delay: .4s; }
#ring-container.is-steam .tea-steam path:nth-child(3) { animation-delay: .8s; }
@keyframes teaSteam {
  0% { opacity: 0; transform: translateY(6px); }
  40% { opacity: .55; }
  100% { opacity: 0; transform: translateY(-18px); }
}
.tea-base-word {
  font-family: "Songti SC", "STSong", "SimSun", serif;
  font-size: 13px;
  letter-spacing: .28em;
  fill: var(--xiang);
  opacity: 0;
}
#ring-container.is-empty .tea-base-word {
  opacity: 1;
  transition: opacity 700ms ease;
}

.timer-display {
  position: static;
  transform: none;
  width: auto;
  height: auto;
  background: none;
  box-shadow: none;
  border-radius: 0;
  backdrop-filter: none;
}
.timer-type {
  letter-spacing: .42em;
  font-size: 11px;
  color: var(--ink-soft);
  text-transform: none;
  margin-bottom: 4px;
}
.timer-time {
  font-size: 32px;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--ink);
  text-shadow: none;
  line-height: 1.1;
}
.timer-noise { color: var(--bamboo); }

.mode-switch, .soundscape, .task-picker, .current-task .task-picker {
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: none;
  backdrop-filter: none;
}
.duration-selector {
  position: relative;
  width: 100%;
  display: block;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  flex-shrink: 0;
  z-index: 5;
}
.duration-fold {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--line);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: var(--ink);
}
.duration-fold:disabled { opacity: .55; cursor: default; }
.duration-current {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  letter-spacing: .08em;
  color: var(--bamboo);
}
.duration-fold-arrow {
  color: var(--ink-soft);
  transition: transform 180ms cubic-bezier(.2,.7,.3,1);
}
.duration-fold[aria-expanded="true"] .duration-fold-arrow { transform: rotate(90deg); }
.duration-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 8;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(58, 58, 56, .08);
  overflow: hidden;
}
.duration-panel[hidden] { display: none; }
.mode-chip.active, .duration-chip.active {
  background: transparent;
  color: var(--bamboo);
  box-shadow: none;
}
.mode-chip { color: var(--ink-soft); letter-spacing: .12em; }

/* ---------- 印章按钮：按下 / 收缩 / 描边 / 光环 ---------- */
.timer-controls { min-height: 0; align-items: center; flex-shrink: 0; }
.seal-btn {
  position: relative;
  width: 68px;
  height: 68px;
  padding: 0;
  border-radius: 50%;
  background: var(--bamboo);
  color: #F7F5F0;
  box-shadow: inset 0 0 0 1px rgba(255, 252, 247, .28);
  letter-spacing: .14em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 160ms cubic-bezier(.2,.7,.3,1);
}
.seal-btn:hover { transform: none; background: var(--bamboo); }
.seal-btn.is-pressed { transform: scale(.97); }
.seal-btn.is-shrink {
  transform: scale(.62);
  transition: transform 180ms cubic-bezier(.2,.7,.3,1);
}
.seal-label {
  font-size: 12px;
  line-height: 1.25;
  letter-spacing: .08em;
  white-space: nowrap;
  transition: opacity 140ms linear;
}
.seal-btn.is-shrink .seal-label,
.seal-btn.is-stroke .seal-label,
.seal-btn.is-halo .seal-label { opacity: 0; }
.seal-check {
  position: absolute;
  width: 36px;
  height: 36px;
  opacity: 0;
}
.seal-btn.is-stroke .seal-check,
.seal-btn.is-halo .seal-check { opacity: 1; }
.seal-halo {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 1px solid rgba(196, 165, 116, 0);
  pointer-events: none;
}
.seal-btn.is-halo .seal-halo { animation: sealHalo 440ms ease-out forwards; }
@keyframes sealHalo {
  0% { transform: scale(.86); opacity: .9; border-color: rgba(232, 214, 170, .95); }
  100% { transform: scale(1.45); opacity: 0; border-color: rgba(232, 214, 170, 0); }
}
.seal-mote {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #E7D7A8;
  opacity: 0;
  pointer-events: none;
}
.seal-btn.is-halo .seal-mote { animation: sealMote 440ms ease-out forwards; }
.seal-mote.m1 { left: 18%; top: 22%; --dx: -12px; --dy: -16px; }
.seal-mote.m2 { right: 16%; top: 26%; --dx: 14px; --dy: -12px; animation-delay: 40ms; }
.seal-mote.m3 { left: 22%; bottom: 18%; --dx: -10px; --dy: 12px; animation-delay: 70ms; }
.seal-mote.m4 { right: 20%; bottom: 20%; --dx: 12px; --dy: 10px; animation-delay: 20ms; }
@keyframes sealMote {
  0% { opacity: .75; transform: translate(0, 0) scale(1); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.4); }
}
.seal-btn.is-locked { pointer-events: none; }
.stop-btn {
  background: transparent;
  color: var(--ink-soft);
  border: 1px solid var(--line);
  box-shadow: none;
  border-radius: 999px;
  padding: 10px 18px;
  letter-spacing: .12em;
}
.pause-btn.seal-btn { background: transparent; color: var(--bamboo); border: 1px solid var(--bamboo); }

/* ---------- 惯性滚轮 ---------- */
#duration-options.tea-wheel {
  display: block;
  position: relative;
  height: 132px;
  overflow: hidden;
  touch-action: none;
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(247,245,240,.96), rgba(247,245,240,0) 28%, rgba(247,245,240,0) 72%, rgba(247,245,240,.96)),
    rgba(255,252,247,.35);
  padding: 0;
  flex: 1;
}
.tea-wheel.is-locked { opacity: .55; }
.tea-wheel-track { will-change: transform; padding-top: 44px; padding-bottom: 44px; }
.tea-wheel .duration-chip {
  height: 44px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  color: var(--ink-soft);
  font-family: "Songti SC", "STSong", "SimSun", serif;
  font-size: 15px;
  letter-spacing: .16em;
  transform: none;
}
.tea-wheel .duration-chip.active {
  color: var(--bamboo);
  background: transparent;
  font-size: 18px;
  box-shadow: none;
}
.tea-wheel-mark {
  position: absolute;
  left: 16px; right: 16px; top: 44px; height: 44px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  pointer-events: none;
}
.duration-fold { align-items: center; }
.duration-fold .duration-label,
.duration-fold .duration-current,
.duration-fold .duration-fold-arrow {
  padding: 0;
  height: auto;
  width: auto;
  flex: 0 0 auto;
  white-space: nowrap;
  line-height: 1.2;
}
.duration-label { letter-spacing: .12em; color: var(--ink-soft); }

/* ---------- 今日勾选联动 ---------- */
.list-ritual {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.list-ring { width: 44px; height: 44px; transform: rotate(-90deg); }
.list-ring-bg { fill: none; stroke: rgba(92, 64, 48, .15); stroke-width: 2; }
.list-ring-fg {
  fill: none;
  stroke: var(--bamboo);
  stroke-width: 2;
  stroke-linecap: round;
  transition: stroke-dashoffset 420ms cubic-bezier(.2,.7,.3,1);
}
.list-ritual-num {
  font-size: 22px;
  letter-spacing: .04em;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  min-width: 3.2em;
}
.list-ritual-num small { font-size: 13px; color: var(--ink-soft); margin-left: 2px; }
.list-ritual-label { font-size: 11px; letter-spacing: .18em; color: var(--ink-soft); }
#page-today { --heat: 0; }
#today-page-title {
  color: color-mix(in srgb, var(--ink) calc((1 - var(--heat)) * 100%), var(--bamboo));
  transition: color 420ms cubic-bezier(.2,.7,.3,1);
}
#page-today {
  background-color: color-mix(in srgb, var(--paper) calc((1 - var(--heat) * .5) * 100%), #E4EDE4);
  transition: background-color 420ms linear;
}

.daily-check, .habit-check {
  width: 26px; height: 22px;
  border: none; background: transparent; color: inherit;
  border-radius: 0; padding: 0;
}
.daily-item.done .daily-check,
.habit-card.done .habit-check {
  background: transparent;
  border: none;
  color: inherit;
}
.tea-check-ico {
  width: 16px; height: 14px;
  border: 1.2px solid #8A8175;
  border-top: none;
  border-radius: 0 0 8px 8px;
  position: relative;
  overflow: hidden;
  display: block;
}
.tea-check-ico::before {
  content: "";
  position: absolute;
  left: -2px; right: -2px; top: -3px;
  height: 5px;
  border: 1.2px solid #6E6258;
  border-radius: 50%;
  background: var(--paper);
}
.tea-check-liquid {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 0;
  background: var(--tea);
  transition: height 120ms cubic-bezier(.2,.7,.3,1);
}
.daily-item.done .tea-check-liquid,
.habit-card.done .tea-check-liquid { height: 78%; }
.daily-item {
  border-bottom: 1px dashed rgba(58, 58, 56, .18);
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
.daily-item.done .daily-item-text { color: var(--ink-soft); }

/* ---------- 叠卡 ---------- */
.records-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.stack-deck {
  --n: 1;
  --peek: 10px;
  --card: 84px;
  position: relative;
  height: calc(var(--card) + var(--peek) * 3);
  margin-bottom: 12px;
  /* 父级 .history-list 是 flex + max-height，不加这行展开时会被压回折叠高度，
     卡片散开却撑不开容器，全挤在一起——看起来就是「点了没反应」。 */
  flex: 0 0 auto;
  transition: height 320ms cubic-bezier(.2,.7,.3,1);
}
.stack-deck.is-open {
  height: calc(var(--n) * (var(--card) + 8px));
}
/* 展开时放开父级的 420px 上限：内部再滚一层会让手指不知道该滚谁 */
.history-list:has(> .stack-deck.is-open) { max-height: none; }
.stack-deck .history-item.is-stacked {
  position: absolute;
  left: 0; right: 0; top: 0;
  height: var(--card);
  overflow: hidden;
  margin: 0;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid rgba(92, 64, 48, .12);
  box-shadow: 0 8px 18px rgba(58, 58, 56, .05);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform: translateY(calc(min(var(--i), 3) * var(--peek))) scale(calc(1 - min(var(--i), 3) * .03));
  z-index: calc(30 - var(--i));
  opacity: 1;
  transition: transform 320ms cubic-bezier(.2,.7,.3,1);
  transition-delay: calc((var(--n) - var(--i)) * 36ms);
}
.stack-deck .history-item.is-stacked:hover {
  background: #fff;
  transform: translateY(calc(min(var(--i), 3) * var(--peek))) scale(calc(1 - min(var(--i), 3) * .03));
}
.stack-deck.is-open .history-item.is-stacked:hover {
  transform: translateY(calc(var(--i) * (var(--card) + 8px))) scale(1);
}
.history-task {
  font-family: "Songti SC", "STSong", "SimSun", "Noto Serif SC", serif;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--ink);
}
.history-meta, .history-time, .history-duration, .history-status {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
}
.stack-deck.is-open .history-item.is-stacked {
  transform: translateY(calc(var(--i) * (var(--card) + 8px))) scale(1);
  opacity: 1;
  transition-delay: calc(var(--i) * 42ms);
}
.stack-deck:not(.is-open) .history-item.is-stacked { pointer-events: none; }
.stack-deck:not(.is-open) .history-item.is-stacked:first-child { pointer-events: auto; }

/* ---------- 吸附 + 画线 ---------- */
.schedule-stage {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  align-items: stretch;
  margin-top: 4px;
}
.snap-line { width: 20px; height: 248px; display: block; }
.snap-line-base { stroke: rgba(92, 64, 48, .18); stroke-width: 1; }
.snap-line-draw {
  stroke: var(--tea);
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-dasharray: 88;
  stroke-dashoffset: calc(88 * (1 - var(--draw, 0)));
  transition: stroke-dashoffset 280ms cubic-bezier(.2,.7,.3,1);
}
.schedule-list.is-snap {
  position: relative;
  display: block;
  height: 248px;
  overflow: hidden;
  touch-action: none;
}
.schedule-stage:not(:has(.is-snap)) .snap-line { opacity: .2; }
.snap-track { will-change: transform; }
.snap-card {
  height: 100px;
  margin-bottom: 8px;
  box-sizing: border-box;
}
.schedule-list.is-snap .snap-card {
  height: 100px;
  margin: 0 0 8px;
}
.snap-hint {
  font-size: 12px;
  color: var(--ink-soft);
  letter-spacing: .12em;
  margin: 0 0 8px;
}

/* ---------- 茶渍色带 ---------- */
.tea-stain {
  display: flex;
  gap: 3px;
  height: 12px;
  margin-top: 8px;
}
.tea-stain i {
  flex: 1;
  border-radius: 2px 2px 6px 3px;
  background: rgba(92, 64, 48, var(--d, .08));
  min-width: 0;
}

.flash-note-trigger {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: rgba(255, 252, 247, .85);
  border: 1px solid var(--line);
  box-shadow: none;
}
.flash-note-trigger:hover { transform: none; box-shadow: none; }
#running-timer-indicator {
  background: rgba(58, 58, 56, .92);
}
#focus-overlay { background: #1C1A17; color: #F7F5F0; }
.focus-task-title { color: var(--xiang); font-family: "Songti SC", "STSong", "SimSun", serif; }
.sheet, .mixer-panel, .flash-note-modal {
  background: #F7F5F0;
  border: 1px solid var(--line);
}

/* 低端机 / 减少动效：波浪、呼吸、粒子、位移停掉；文字仍在 */
.reduce-motion .tea-wave-x,
.reduce-motion #ring-container.is-idle .tea-cup-svg,
.reduce-motion #ring-container.is-steam .tea-steam path,
.reduce-motion #ring-container.is-glaze .cup-glaze,
.reduce-motion .seal-mote,
.reduce-motion .seal-btn.is-halo .seal-halo {
  animation: none !important;
}
.reduce-motion .page-content.tea-leave,
.reduce-motion .page-content.tea-enter-on {
  transform: none;
  transition: opacity 160ms linear;
}
.reduce-motion .stack-deck,
.reduce-motion .stack-deck .history-item.is-stacked,
.reduce-motion .snap-line-draw,
.reduce-motion .tea-check-liquid,
.reduce-motion .list-ring-fg {
  transition-duration: 1ms;
  transition-delay: 0s;
}
.reduce-motion .seal-mote { display: none; }
.reduce-motion #ring-container.is-steam .tea-steam { opacity: .4; }
.reduce-motion #ring-container.is-empty .tea-base-word { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .tea-wave-x,
  #ring-container.is-idle .tea-cup-svg,
  #ring-container.is-steam .tea-steam path,
  #ring-container.is-glaze .cup-glaze,
  .seal-mote,
  .seal-btn.is-halo .seal-halo { animation: none !important; }
  .page-content.tea-leave,
  .page-content.tea-enter-on { transform: none; transition: opacity 160ms linear; }
  .stack-deck .history-item.is-stacked { transition-duration: 1ms; transition-delay: 0s; }
  .seal-mote { display: none; }
  #ring-container.is-empty .tea-base-word { opacity: 1; }
}

/* ============================================================
   子任务清单：一张可勾选的纸
   ------------------------------------------------------------
   不做「一行一个输入框」——框框会把人框住，写不长。
   整块是一张连续的纸：每行一项，回车换行，点行首的圈打勾。
   字号 14px / 行高 1.75，比卡片里其他元素大一号，因为这里是写字的地方。
   ============================================================ */
.sub-list {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid rgba(92, 64, 48, .08);
}
.sub-head {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 14px;
  /* 和 .sub-row 的文字左对齐，别让「1 / 3」孤零零挂在最左边 */
  padding-left: 26px;
  margin-bottom: 5px;
}
.sub-label {
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.sub-list.is-all-done .sub-label { color: var(--bamboo); }

.sub-body {
  outline: none;
  white-space: pre-wrap;
  word-break: break-word;
  -webkit-user-select: text;
  user-select: text;
}
.sub-row {
  position: relative;
  /* 右侧留 26px 给删除按钮，文字不会跑到 × 底下 */
  padding: 3px 26px 3px 26px;
  font-size: 14px;
  line-height: 1.85;
  color: var(--ink);
  border-radius: 6px;
  transition: color 180ms ease;
}
.sub-row::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 9px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1.3px solid rgba(92, 64, 48, .3);
  transition: background 160ms ease, border-color 160ms ease;
}
.sub-row[data-done="1"] {
  color: rgba(138, 129, 117, .92);
  text-decoration: line-through;
  text-decoration-color: rgba(92, 64, 48, .22);
  text-decoration-thickness: 1px;
}
/* 勾画在圈里，用 content 而不是再加一个节点——伪元素不会被编辑、不会被光标穿过 */
.sub-row[data-done="1"]::before {
  content: "✓";
  background: var(--bamboo);
  border-color: var(--bamboo);
  color: #fff;
  font-size: 9.5px;
  line-height: 15px;
  text-align: center;
}

/* ---------- 删除：右侧一枚淡色的 ×，不 hover 基本看不见 ---------- */
.sub-row::after {
  content: "×";
  position: absolute;
  right: 1px;
  top: 50%;
  width: 22px;
  height: 22px;
  margin-top: -11px;
  line-height: 21px;
  text-align: center;
  font-size: 14px;
  color: rgba(92, 64, 48, .26);
  border-radius: 7px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 140ms ease, background 140ms ease, color 140ms ease;
}
.sub-row:hover::after { opacity: 1; color: rgba(92, 64, 48, .44); }

/* 删掉时先淡出再收走，不要「啪」一下消失 */
.sub-row.is-removing {
  opacity: 0;
  transform: translateX(8px);
  pointer-events: none;
  transition: opacity 150ms ease, transform 150ms ease;
}
/* 空行也给一点高度，不然回车后光标没处站 */
.sub-row:empty::after { content: none; }
.sub-row br { line-height: 1.75; }

.sub-add {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  padding: 4px 9px 4px 4px;
  border-radius: 8px;
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--ink-soft);
  opacity: .5;
  transition: opacity 160ms ease, background 160ms ease, color 160ms ease;
}
.sub-add span { font-size: 13px; line-height: 1; }
.block:hover .sub-add,
.sub-add:focus-visible { opacity: 1; }
.sub-add:hover { background: rgba(79, 111, 90, .07); color: var(--bamboo); }

/* 空清单：只留一行淡淡的入口，不占地方 */
.sub-list.is-empty {
  margin-top: 6px;
  padding-top: 0;
  border-top: none;
}
.sub-list.is-empty .sub-head,
.sub-list.is-empty .sub-body { display: none; }
.sub-list.is-empty .sub-add { margin-top: 0; }

/* 触屏没有 hover，入口常驻 */
@media (hover: none) {
  .sub-add { opacity: .75; }
  .sub-row::after { opacity: .38; }
}
