/* ════════════════════════════════════════
   Go Go Day — 瑞士风格：暖米色、朱红、钴蓝、墨黑，大字、圆、细线
   ════════════════════════════════════════ */

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

/* ── 颜色和字体 ── */
:root {
  --bg:     #f1f1ef;
  --surf:   #f9f9f8;
  --surf2:  #e6e6e3;
  --ink:    #151515;
  --ink2:   #5c5c59;
  --ink3:   #9a9a96;
  --line:   rgba(21,21,21,0.14);
  --line2:  rgba(21,21,21,0.07);
  --accent: #e8452c;
  --accent-fg: #151515;
  --scrim:  rgba(21,21,21,0.42);

  /* 类别：主色 / 卡片上的文字 / 圆按钮 / 圆按钮文字 */
  --cat-meal:   #e8452c; --cat-meal-fg:   #151515; --cat-meal-btn:   #151515; --cat-meal-btnfg:   #f5f2ec;
  --cat-focus:  #2b3df0; --cat-focus-fg:  #f5f2ec; --cat-focus-btn:  #e8452c; --cat-focus-btnfg:  #151515;
  --cat-health: #f0a81c; --cat-health-fg: #151515; --cat-health-btn: #151515; --cat-health-btnfg: #f5f2ec;
  --cat-life:   #151515; --cat-life-fg:   #f5f2ec; --cat-life-btn:   #e8452c; --cat-life-btnfg:   #151515;
  --cat-other:  #c7c7c2; --cat-other-fg:  #151515; --cat-other-btn:  #151515; --cat-other-btnfg:  #f5f2ec;

  --r-lg: 28px;
  --r-md: 18px;
  --r-sm: 12px;
  --font: 'Inter Tight', -apple-system, 'Helvetica Neue', 'PingFang SC', sans-serif;
  color-scheme: light;
}

html[data-theme="dark"] {
  --bg:     #121212;
  --surf:   #1d1c1a;
  --surf2:  #2a2824;
  --ink:    #f0ebe2;
  --ink2:   #a8a196;
  --ink3:   #6b665e;
  --line:   rgba(240,235,226,0.16);
  --line2:  rgba(240,235,226,0.08);
  --scrim:  rgba(0,0,0,0.6);
  --cat-life:   #f0ebe2; --cat-life-fg:   #151515;
  --cat-other:  #46423b; --cat-other-fg:  #f0ebe2; --cat-other-btn: #e8452c; --cat-other-btnfg: #151515;
  color-scheme: dark;
}

html, body {
  min-height: 100%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}
button { font: inherit; color: inherit; }

/* ════ MAIN VIEW ════ */
.main-view {
  max-width: 440px;
  margin: 0 auto;
  padding: calc(14px + env(safe-area-inset-top)) 16px calc(60px + env(safe-area-inset-bottom));
  min-height: 100vh;
}

.topbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.date-badge {
  width:60px; height:60px; border-radius:50%;
  background:var(--surf); display:flex; flex-direction:column; align-items:center; justify-content:center;
  line-height:1;
}
.db-wd { font-size:11px; font-weight:600; color:var(--accent); letter-spacing:0.04em; margin-bottom:3px; }
.db-d  { font-size:24px; font-weight:700; letter-spacing:-0.02em; }
.top-actions { display:flex; gap:8px; }

.icon-btn {
  width:44px; height:44px; border-radius:50%;
  border:1px solid var(--line); background:transparent; color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; flex-shrink:0; transition:background 0.18s;
}
.icon-btn:hover { background:var(--surf); }

.greeting {
  font-size:36px; font-weight:800; letter-spacing:-0.035em; line-height:1;
  margin-bottom:18px;
}

/* 进度条 */
.progress-rail { display:flex; gap:4px; margin-bottom:16px; }
.pseg { flex:1; height:4px; border-radius:99px; background:var(--line); position:relative; overflow:hidden; }
.pseg::after {
  content:''; position:absolute; inset:0; background:var(--ink);
  transform:scaleX(0); transform-origin:left;
  transition:transform 0.5s cubic-bezier(0.4,0,0.2,1);
}
.pseg.done::after { transform:scaleX(1); }
.pseg.active { background:var(--accent); }
.pseg.skipped { background:var(--line2); }

/* ════ HERO：当前任务 / 开始卡片 / 到点提醒 ════ */
.hero {
  --fg: var(--task-fg, var(--accent-fg));
  background: var(--task-color, var(--accent));
  color: var(--fg);
  border-radius: var(--r-lg);
  padding: 22px 22px 0;
  position: relative;
}
.start-card { margin-bottom:16px; }
.hero-kicker { font-size:12px; font-weight:600; letter-spacing:0.06em; opacity:0.75; margin-bottom:10px; }
.hero-title  { font-size:28px; font-weight:800; letter-spacing:-0.03em; line-height:1.08; margin-bottom:20px; }

.hero .ft-note { border-top:1px solid color-mix(in srgb, var(--fg) 25%, transparent); padding-top:12px; margin-bottom:20px; }
.hero .ft-label { opacity:0.7; }
.hero .ft-text { font-size:20px; font-weight:600; letter-spacing:-0.01em; line-height:1.35; }

.hero-foot {
  display:grid; grid-template-columns:auto 1fr; align-items:center; gap:16px;
  border-top:1px solid color-mix(in srgb, var(--fg) 25%, transparent);
  margin:0 -22px; padding:16px 22px 18px;
}
.circle-btn {
  width:112px; height:112px; border-radius:50%; border:none;
  background:var(--task-btn, var(--ink)); color:var(--task-btn-fg, var(--bg));
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  font-size:14px; font-weight:600; line-height:1.2; text-align:center; padding:14px;
  cursor:pointer; transition:transform 0.2s;
}
.circle-btn:hover:not(:disabled)  { transform:scale(1.04); }
.circle-btn:active:not(:disabled) { transform:scale(0.96); }
.circle-btn:disabled { opacity:0.3; cursor:not-allowed; }

.hero-actions { display:flex; flex-direction:column; }
.act {
  display:flex; align-items:center; gap:10px; min-height:44px;
  background:none; border:none; color:inherit; text-align:left;
  font-size:14px; font-weight:500; cursor:pointer; padding:0 2px;
}
.act + .act { border-top:1px solid color-mix(in srgb, var(--fg) 18%, transparent); }
.act svg { flex-shrink:0; opacity:0.8; width:16px; height:14px; }
.act:hover span { text-decoration:underline; text-underline-offset:3px; }

/* ════ TASK ROWS ════ */
#chainList { display:flex; flex-direction:column; }

.task-row { position:relative; border-bottom:1px solid var(--line); }
.task-row.hero { border-bottom:none; margin:4px 0 18px; }
.task-row.hero.current { animation:heroFloat 6s ease-in-out infinite; }
@keyframes heroFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }

.row-top { display:flex; align-items:center; gap:12px; min-height:50px; padding:0 2px; }
.dot { width:10px; height:10px; border-radius:50%; background:var(--task-color); flex-shrink:0; }
.row-icon  { font-size:19px; line-height:1; flex-shrink:0; }
.row-title { font-size:17px; font-weight:500; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.row-right { display:flex; align-items:center; gap:8px; flex-shrink:0; color:var(--ink2); }

.hero .row-top { min-height:0; padding:0; margin-bottom:14px; align-items:flex-start; }
.hero .row-icon { font-size:26px; }
.hero .row-title { font-size:30px; font-weight:800; letter-spacing:-0.035em; line-height:1.05; white-space:normal; }
.hero .row-right { color:inherit; padding-top:6px; }

.row-now {
  font-size:11px; font-weight:700; letter-spacing:0.08em;
  border:1.5px solid currentColor; border-radius:99px; padding:3px 9px;
}
.row-check { display:flex; color:var(--ink); }
.row-lock  { display:flex; color:var(--ink3); }
.row-time  { font-size:12px; font-variant-numeric:tabular-nums; }
.row-skip  { font-size:12px; }
.row-restore {
  background:none; border:1px solid var(--line); border-radius:99px;
  font-size:12px; padding:5px 12px; cursor:pointer; color:var(--ink);
}
.row-del {
  width:32px; height:32px; border-radius:50%; border:none; background:none;
  color:var(--ink2); font-size:18px; line-height:1; cursor:pointer;
}
.row-del:hover { background:var(--accent); color:var(--accent-fg); }

.task-row.done .row-title { color:var(--ink3); text-decoration:line-through; text-decoration-thickness:1px; }
.task-row.done .row-icon, .task-row.done .dot { opacity:0.4; }
.task-row.locked { color:var(--ink2); }
.task-row.skipped { opacity:0.45; }

.row-body { padding:0 2px 16px 56px; }
.hero .row-body { padding:0; }
.row-hint { font-size:14px; line-height:1.55; opacity:0.75; margin-bottom:14px; }

.ft-label { font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; margin-bottom:6px; color:inherit; }
.ft-text  { font-size:15px; line-height:1.5; }
.ft-text.editable { cursor:text; }
.ft-empty { font-size:13px; opacity:0.6; }
.ft-ghost {
  font-size:15px; cursor:text; margin-bottom:20px;
  border:1.5px dashed color-mix(in srgb, var(--fg, var(--ink)) 40%, transparent);
  border-radius:var(--r-sm); padding:12px 14px; opacity:0.85;
}
.ft-ghost:hover { opacity:1; }
.edit-ph { opacity:0.55; font-style:normal; }

.inline-edit {
  background:transparent; border:none; border-bottom:1.5px solid currentColor;
  color:inherit; font:inherit; width:100%; outline:none; padding:2px 0;
}
.inline-edit::placeholder { color:inherit; opacity:0.5; }

/* 出门清单：药丸形 */
.row-checks { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.check-row {
  display:inline-flex; align-items:center; min-height:40px; padding:0 16px;
  border:1.5px solid color-mix(in srgb, var(--fg, var(--ink)) 35%, transparent);
  border-radius:99px; cursor:pointer; user-select:none; transition:all 0.18s;
}
.check-row .cbox { display:none; }
.clabel { font-size:14px; font-weight:500; }
.check-row.checked { background:var(--fg, var(--ink)); border-color:var(--fg, var(--ink)); color:var(--task-color, var(--bg)); }

/* 求职 */
.job-list { display:flex; flex-direction:column; margin-bottom:16px; }
.job-item { padding:10px 0; border-top:1px solid color-mix(in srgb, var(--fg) 20%, transparent); }
.job-title { font-size:15px; font-weight:600; }
.job-co    { font-size:12px; opacity:0.7; }
.feed-hint { font-size:12px; opacity:0.75; margin-bottom:16px; }
.feed-link { text-decoration:underline; cursor:pointer; }

.once-note { font-size:12px; color:var(--ink2); margin-top:4px; }

/* 专注视图 */
.section-label {
  font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--ink2); padding:4px 2px 2px;
}
.chain-fold {
  font-size:13px; color:var(--ink2); padding:16px 2px; cursor:pointer; user-select:none;
}
.chain-fold:hover { color:var(--ink); }

/* 全部完成 */
.all-done { text-align:center; padding:24px 0 16px; }
.done-art { position:relative; width:180px; height:180px; margin:0 auto 18px; }
.done-art .c1 { position:absolute; inset:0; border-radius:50%; background:var(--ink); }
.done-art .c2 {
  position:absolute; width:62px; height:62px; left:30px; bottom:22px; border-radius:50%;
  background:var(--accent); animation:doneOrbit 8s ease-in-out infinite;
}
@keyframes doneOrbit { 0%,100% { transform:translate(0,0); } 50% { transform:translate(56px,-40px); } }
.all-done h2 { font-size:30px; font-weight:800; letter-spacing:-0.03em; margin-bottom:10px; }

/* 文字按钮 */
.text-link {
  display:block; width:100%; background:none; border:none; cursor:pointer;
  color:var(--ink2); font-size:14px; padding:10px; text-decoration:underline; text-underline-offset:3px;
}
.text-link:hover { color:var(--ink); }
.text-link.inline { display:inline; width:auto; padding:0; color:inherit; font-size:inherit; }
.back-link { width:auto; padding:0; margin-bottom:18px; text-align:left; text-decoration:none; }

/* 拖拽 */
.task-row.sortable-ghost  { opacity:0.25; }
.task-row.sortable-chosen { background:var(--surf); border-radius:var(--r-sm); }
.task-row.pressing { background:var(--surf); border-radius:var(--r-sm); }

/* ════ EDIT MODE ════ */
body.edit-mode .task-row { cursor:pointer; }
body.edit-mode .row-title { cursor:text; text-decoration:underline dotted; text-underline-offset:4px; text-decoration-color:var(--ink3); }
body.edit-mode .task-row.edit-target:not(.hero) { background:var(--surf); border-radius:var(--r-md); border-bottom-color:transparent; padding:0 12px; margin:6px -12px; }
body.edit-mode .edit-target .row-hint,
body.edit-mode .edit-target .ft-text,
body.edit-mode .edit-target .clabel { cursor:text; text-decoration:underline dotted; text-underline-offset:3px; }
.edit-target:not(.hero) .ft-note { border-top:1px solid var(--line); padding-top:10px; margin-bottom:14px; }



/* ════ BUTTONS ════ */
.btn-primary, .btn-ghost {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 22px; border-radius:99px;
  font-size:15px; font-weight:600; cursor:pointer; transition:transform 0.15s, background 0.15s;
}
.btn-primary { background:var(--ink); color:var(--bg); border:none; }
.btn-primary.danger { background:var(--accent); color:var(--accent-fg); }
.btn-ghost { background:transparent; color:var(--ink); border:1.5px solid var(--line); }
.btn-ghost:hover { border-color:var(--ink); }
.btn-primary:active, .btn-ghost:active { transform:scale(0.98); }
.wide { width:100%; }

/* ════ MODALS ════ */
.modal-overlay {
  position:fixed; inset:0; z-index:80; background:var(--scrim);
  display:flex; align-items:flex-end; justify-content:center;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
}
.modal-overlay.hidden { display:none; }
.modal-box {
  background:var(--bg); color:var(--ink); border-radius:var(--r-lg);
  padding:20px 22px 16px; width:100%; max-width:420px; max-height:88vh; overflow-y:auto;
  animation:sheetUp 0.3s cubic-bezier(0.2,0.8,0.2,1);
}
@keyframes sheetUp { from { transform:translateY(40px); opacity:0; } to { transform:none; opacity:1; } }
.modal-title { font-size:24px; font-weight:800; letter-spacing:-0.03em; margin-bottom:14px; }
.modal-note  { font-size:13px; color:var(--ink2); line-height:1.6; margin-bottom:16px; }
.modal-field { margin-bottom:14px; }
.modal-field label { display:block; font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink2); margin-bottom:6px; }
.modal-field input, .modal-field select {
  width:100%; min-height:48px; background:var(--surf); border:1.5px solid transparent;
  border-radius:var(--r-sm); padding:0 14px; color:var(--ink); font:inherit; font-size:16px; outline:none;
  appearance:none; -webkit-appearance:none;
}
.modal-field input:focus, .modal-field select:focus { border-color:var(--ink); }
.modal-field input::placeholder { color:var(--ink3); }
.modal-actions { display:flex; gap:8px; margin-top:20px; }
.modal-actions .btn-primary { flex:1; }
.modal-actions.col { flex-direction:column; gap:8px; }

/* 菜单 */
.menu-box { padding:8px 22px; }
.menu-item {
  display:flex; align-items:center; gap:14px; width:100%; min-height:46px;
  background:none; border:none; border-bottom:1px solid var(--line); padding:0;
  font-size:17px; font-weight:500; text-align:left; cursor:pointer;
}
.menu-item:last-child { border-bottom:none; }
.menu-item.danger { color:var(--accent); }
.mi-icon { width:22px; text-align:center; font-size:18px; }

/* 换一个 */
.swap-sub   { font-size:14px; color:var(--ink2); margin:-10px 0 18px; }
.swap-label { font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink2); margin-bottom:4px; }
.swap-list  { display:flex; flex-direction:column; max-height:38vh; overflow-y:auto; margin-bottom:6px; }
.swap-item {
  display:flex; align-items:center; gap:12px; min-height:56px; cursor:pointer;
  border-bottom:1px solid var(--line); padding:6px 2px;
}
.swap-item::before { content:''; width:10px; height:10px; border-radius:50%; background:var(--c); flex-shrink:0; }
.swap-item:hover .swap-title { text-decoration:underline; text-underline-offset:3px; }
.swap-icon  { font-size:18px; }
.swap-text  { display:flex; flex-direction:column; min-width:0; }
.swap-title { font-size:16px; font-weight:500; }
.swap-step  { font-size:12px; color:var(--ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ════ INSERT TRAY（编辑模式底部：收起 / 半屏 / 大半屏） ════ */
body { --tray-h:0px; }
body[data-tray="peek"] { --tray-h:calc(76px + env(safe-area-inset-bottom)); }
body[data-tray="half"] { --tray-h:50vh; }
body[data-tray="full"] { --tray-h:86vh; }

#palDrawer {
  position:fixed; left:0; right:0; bottom:0; z-index:65; /* 盖过休息卡片 */
  max-width:440px; margin:0 auto; height:var(--tray-h);
  background:var(--surf); border-radius:var(--r-lg) var(--r-lg) 0 0;
  box-shadow:0 -12px 40px rgba(0,0,0,0.14);
  display:flex; flex-direction:column; overflow:hidden;
  padding-bottom:env(safe-area-inset-bottom);
  transition:height 0.3s cubic-bezier(0.2,0.8,0.2,1), transform 0.3s cubic-bezier(0.2,0.8,0.2,1);
}
#palDrawer[data-state="closed"] { transform:translateY(110%); height:50vh; }
/* 列表底部留出托盘的高度，最后几件也能滚出来 */
body.edit-mode .main-view { padding-bottom:calc(var(--tray-h) + 28px); }
body.dragging-tile #palDrawer { opacity:0.6; }

.tray-head { padding:8px 16px 6px; cursor:pointer; user-select:none; -webkit-user-select:none; flex-shrink:0; touch-action:none; }
.tray-grab { width:40px; height:5px; border-radius:99px; background:var(--line); margin:0 auto 10px; }
.tray-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.sheet-title { display:flex; align-items:center; gap:10px; font-size:22px; font-weight:800; letter-spacing:-0.03em; }
.tray-plus { display:flex; }
.tray-chev { display:flex; color:var(--ink2); transition:transform 0.3s; }
#palDrawer[data-state="half"] .tray-chev,
#palDrawer[data-state="full"] .tray-chev { transform:rotate(180deg); }
.pal-hint { font-size:12px; color:var(--ink2); line-height:1.5; margin-top:6px; }
#palDrawer[data-state="peek"] .pal-hint { display:none; }
.pal-body { flex:1; overflow-y:auto; padding:4px 16px 24px; overscroll-behavior:contain; }

.pal-group + .pal-group { margin-top:6px; }
.pal-sec {
  display:flex; align-items:center; gap:6px;
  font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--ink2); margin:12px 0 8px;
}
.pal-sec i { width:8px; height:8px; border-radius:50%; display:inline-block; }
.pal-grid { display:grid; grid-template-columns:repeat(5, 1fr); gap:8px; }
.pal-tile {
  aspect-ratio:1; border-radius:50%; background:var(--bg);
  box-shadow:inset 0 0 0 1.5px var(--c);        /* 类别色细环，和日历一致 */
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  cursor:grab; user-select:none; -webkit-user-select:none; position:relative;
  transition:transform 0.15s;
}
.pal-tile:active { transform:scale(0.95); }
.pt-icon { display:flex; }
.pt-name { font-size:10px; font-weight:600; text-align:center; line-height:1.15; padding:0 4px; }
.pt-del {
  position:absolute; top:-2px; right:-2px; width:22px; height:22px; border-radius:50%;
  background:var(--ink); color:var(--bg); border:none; font-size:12px; line-height:1; cursor:pointer;
}
.pal-add-btn {
  margin-top:16px; width:100%; min-height:48px; border-radius:99px;
  background:transparent; border:1.5px dashed var(--line); color:var(--ink);
  font-size:14px; font-weight:600; cursor:pointer;
}
.pal-add-btn:hover { border-style:solid; border-color:var(--ink); }

/* 拖着的圆跟着手指走 */
.sortable-fallback { transition:none !important; animation:none !important; }
.pal-tile.sortable-fallback { width:72px !important; height:72px !important; opacity:0.95 !important; box-shadow:inset 0 0 0 2.5px var(--c), 0 10px 30px rgba(0,0,0,0.2); }
/* 在任务链里显示成一条朱红色插入线 */
#chainList .pal-tile {
  aspect-ratio:auto; height:4px; border-radius:99px; background:var(--accent);
  box-shadow:none; margin:6px 0; padding:0;
}
#chainList .pal-tile > * { display:none; }

/* 新建事件：类别按钮 */
.cat-picker { display:flex; flex-wrap:wrap; gap:6px; }
.cat-chip {
  display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:0 14px;
  border-radius:99px; border:1.5px solid var(--line); background:transparent;
  font-size:14px; font-weight:500; cursor:pointer;
}
.cat-chip i { width:10px; height:10px; border-radius:50%; display:inline-block; }
.cat-chip.on { border-color:var(--ink); background:var(--ink); color:var(--bg); }

/* ════ FULL PAGES：睡前 / 记录 ════ */
.page-overlay {
  display:none; position:fixed; inset:0; z-index:70; background:var(--bg);
  overflow-y:auto; padding:calc(14px + env(safe-area-inset-top)) 16px calc(60px + env(safe-area-inset-bottom));
}
.page-overlay.active { display:block; }
.page-overlay > * { max-width:440px; margin-left:auto; margin-right:auto; }
.page-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.page-kicker { font-size:12px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink2); }
.page-title { font-size:34px; font-weight:800; letter-spacing:-0.035em; line-height:1.02; margin-bottom:6px; }
.page-sub   { font-size:14px; color:var(--ink2); margin-bottom:24px; }
.sec-label {
  font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--ink2); margin:20px 0 8px;
}

.night-row {
  display:flex; align-items:center; gap:14px; min-height:46px;
  border-bottom:1px solid var(--line); cursor:pointer; user-select:none;
}
.cbox {
  width:24px; height:24px; border-radius:50%; border:1.5px solid var(--ink3);
  display:flex; align-items:center; justify-content:center; color:transparent; flex-shrink:0;
}
.night-row .clabel { font-size:16px; }
.night-row.checked .cbox { background:var(--ink); border-color:var(--ink); color:var(--bg); }
.night-row.checked .clabel { color:var(--ink3); text-decoration:line-through; }

.input-group { background:var(--surf); border-radius:var(--r-md); padding:14px 16px; margin-bottom:8px; }
.input-label { font-size:12px; font-weight:600; color:var(--ink2); margin-bottom:6px; }
textarea.ni {
  width:100%; background:transparent; border:none; outline:none; resize:none;
  color:var(--ink); font:inherit; font-size:16px; line-height:1.5;
}
textarea.ni::placeholder { color:var(--ink3); }
#bedtimeView .btn-primary { margin-top:22px; }
#bedtimeView .btn-ghost { margin-top:8px; }

/* 记录 */
.hist-day { padding:18px 0; border-bottom:1px solid var(--line); cursor:pointer; }
.page-title + .hist-day { border-top:1px solid var(--line); margin-top:18px; }
.hd-top { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin-bottom:12px; }
.hd-date { font-size:18px; font-weight:700; letter-spacing:-0.01em; }
.hd-meta { font-size:13px; color:var(--ink2); font-variant-numeric:tabular-nums; margin-top:2px; }
.big-num {
  font-size:48px; font-weight:300; letter-spacing:-0.04em; line-height:0.85;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.big-num small { font-size:14px; font-weight:500; letter-spacing:0; margin-left:4px; color:var(--ink2); }
.hist-empty { font-size:15px; color:var(--ink2); line-height:1.8; padding:20px 0; }
.hist-detail .hd-top { margin-bottom:18px; }
.hist-detail .page-sub { margin-bottom:0; }

.day-strip { position:relative; height:10px; border-radius:99px; background:var(--surf2); overflow:hidden; }
.day-strip .seg { position:absolute; top:0; bottom:0; background:var(--c); }
.day-strip .seg.rest { background:repeating-linear-gradient(45deg, var(--ink3) 0 2px, transparent 2px 5px); }
.hist-detail .day-strip { height:16px; margin-bottom:12px; }

.legend { display:flex; flex-wrap:wrap; gap:6px 16px; margin-bottom:24px; }
.lg-item { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--ink2); }
.lg-item i { width:10px; height:10px; border-radius:50%; display:inline-block; }
.lg-item i.lg-rest { background:repeating-linear-gradient(45deg, var(--ink2) 0 1.5px, transparent 1.5px 3.5px); }

.timeline { display:flex; flex-direction:column; }
.tl-mark { font-size:13px; color:var(--ink2); padding:0 0 10px 64px; }
.tl-row {
  display:grid; grid-template-columns:46px 6px 1fr; gap:12px; align-items:stretch;
  padding:8px 0; border-top:1px solid var(--line2);
}
.tl-time { font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; line-height:1.4; text-align:right; }
.tl-time span { display:block; font-weight:400; color:var(--ink2); font-size:12px; }
.tl-bar { border-radius:99px; background:var(--c); min-height:40px; }
.tl-main { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.tl-title { font-size:16px; font-weight:500; }
.tl-dur { font-size:12px; color:var(--ink2); white-space:nowrap; font-variant-numeric:tabular-nums; }
.tl-rest .tl-bar { background:repeating-linear-gradient(180deg, var(--ink3) 0 3px, transparent 3px 7px); }
.tl-rest .tl-title { color:var(--ink2); }

/* ════ REST ════ */
body.resting #chainList,
body.resting #progressRail,
body.resting #startDay {
  filter:grayscale(1); opacity:0.28; pointer-events:none;
  transition:filter 0.5s, opacity 0.5s;
}
body.resting .task-row.hero.current { animation:none; }
#restSheet {
  position:fixed; left:0; right:0; bottom:0; z-index:60; pointer-events:none;
  padding:0 16px calc(12px + env(safe-area-inset-bottom));
}
#restSheet:empty { display:none; }
.rest-card {
  pointer-events:auto; max-width:420px; margin:0 auto;
  background:var(--surf); color:var(--ink); border-radius:var(--r-lg);
  padding:20px 22px 12px; box-shadow:0 -10px 40px rgba(0,0,0,0.12);
  animation:sheetUp 0.35s cubic-bezier(0.2,0.8,0.2,1);
}
.rest-card.hero {
  background:var(--task-color); color:var(--fg);
  padding:20px 22px 0; box-shadow:0 -10px 40px rgba(0,0,0,0.18);
}
.rest-title { font-size:28px; font-weight:800; letter-spacing:-0.03em; line-height:1.05; margin-bottom:6px; }
.rest-sub   { font-size:14px; color:var(--ink2); margin-bottom:18px; line-height:1.55; }
.rest-remind { font-size:13px; color:var(--ink2); margin:0 0 16px; }

.next-row { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0 14px; margin-bottom:16px; }
.next-row .section-label { padding:0 0 6px; }
.next-title { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:700; letter-spacing:-0.01em; }
.next-step  { font-size:14px; color:var(--ink2); margin:4px 0 0 20px; }

.chips { display:grid; grid-template-columns:repeat(6, 1fr); gap:8px; margin-bottom:4px; }
.chips .chip { grid-column:span 2; padding:0 8px; }
.chips .chip:nth-child(n+4) { grid-column:span 3; }
.chip {
  flex:1 0 auto; min-height:48px; padding:0 16px; border-radius:99px;
  border:1.5px solid var(--line); background:transparent; color:var(--ink);
  font-size:15px; font-weight:500; cursor:pointer; transition:all 0.15s;
}
.chip:hover { border-color:var(--ink); }
.chip:active { background:var(--ink); color:var(--bg); }

/* ════ TOAST ════ */
#toast {
  position:fixed; left:50%; bottom:calc(var(--tray-h) + 16px + env(safe-area-inset-bottom)); z-index:90;
  transform:translate(-50%, 20px); opacity:0; pointer-events:none;
  display:flex; align-items:center; gap:14px; max-width:calc(100% - 32px);
  padding:12px 12px 12px 20px; border-radius:99px;
  background:var(--ink); color:var(--bg); font-size:14px;
  transition:opacity 0.25s, transform 0.25s;
}
#toast.show { opacity:1; transform:translate(-50%, 0); pointer-events:auto; }
#toast button {
  background:var(--accent); color:var(--accent-fg); border:none; border-radius:99px;
  padding:7px 14px; font-weight:700; cursor:pointer; white-space:nowrap;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation:none !important; transition:none !important; }
}

/* ════ LINE ICONS ════ */
.glyph { display:block; flex-shrink:0; }
.row-icon { display:flex; align-items:center; color:var(--ink); }
.task-row.locked .row-icon { color:var(--ink2); }
.hero .row-icon { color:inherit; padding-top:3px; }
.with-glyph { display:flex; align-items:center; gap:8px; }
.ft-ghost { display:flex; align-items:center; gap:8px; }
.next-title .glyph, .tl-title .glyph, .swap-icon .glyph { display:inline-block; vertical-align:-3px; }
.tl-title { display:flex; align-items:center; gap:8px; }
.tl-mark { display:flex; align-items:center; gap:6px; }
.pt-icon { display:flex; }
.input-label { display:flex; align-items:center; gap:6px; }

/* 图标选择 */
.glyph-picker { display:grid; grid-template-columns:repeat(6, 1fr); gap:6px; }
.gp-item {
  aspect-ratio:1; border-radius:50%; border:1.5px solid transparent;
  background:var(--surf); color:var(--ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.gp-item:hover { border-color:var(--line); }
.gp-item.on { background:var(--ink); color:var(--bg); }
.circle-btn.long { font-size:12px; padding:18px; }
.circle-btn svg { width:15px; height:17px; }

/* ════ DAY RINGS / CALENDAR ════ */
.ring-track { stroke:var(--line); }
.date-badge { position:relative; border:none; cursor:pointer; color:var(--ink); }
.date-badge .ring { position:absolute; inset:0; }
.date-badge span { position:relative; }

.cal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.cal-head .icon-btn { font-size:22px; line-height:1; }
.cal-month { text-align:center; }
.cal-month .page-title { margin-bottom:0; }
.cal-month small { font-size:13px; color:var(--ink2); font-variant-numeric:tabular-nums; }
.cal-week, .cal-grid { display:grid; grid-template-columns:repeat(7, 1fr); gap:8px 4px; }
.cal-week span { text-align:center; font-size:11px; font-weight:700; color:var(--ink2); padding-bottom:4px; }
.cal-day {
  position:relative; aspect-ratio:1; max-width:52px; width:100%; justify-self:center;
  border:none; background:none; padding:0; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:600; color:var(--ink2); font-variant-numeric:tabular-nums;
}
.cal-day .ring { position:absolute; inset:0; width:100%; height:100%; }
.cal-day span { position:relative; }
.cal-day.has { color:var(--ink); cursor:pointer; }
.cal-day.has:hover { background:var(--surf); }
.cal-day.future { color:var(--ink3); }
.cal-day.today span { color:var(--accent); font-weight:800; }
.cal-legend { margin-top:26px; }

/* 编辑模式的拖动把手 */
.drag-handle {
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  color:var(--ink2); cursor:grab; touch-action:none; border-radius:50%;
}
.drag-handle:hover { background:var(--surf2); color:var(--ink); }
.task-row.sortable-chosen .drag-handle { cursor:grabbing; }
.mi-icon { display:flex; align-items:center; justify-content:center; }

/* ════ EDIT MODE：右上角按钮、标题 ════ */
.edit-btn .ic-done { display:none; }
body.edit-mode .edit-btn { background:var(--ink); color:var(--bg); border-color:var(--ink); }
body.edit-mode .edit-btn .ic-edit { display:none; }
body.edit-mode .edit-btn .ic-done { display:flex; }
.edit-btn span { display:flex; }

.edit-head { display:none; }
body.edit-mode .edit-head { display:block; }
body.edit-mode #greeting, body.edit-mode .progress-rail { display:none; }
.edit-head .greeting { margin-bottom:8px; }
.edit-hint { font-size:13px; color:var(--ink2); line-height:1.5; margin-bottom:18px; }

/* 刚插入的那一行闪一下 */
.task-row.just-added { animation:justAdded 2s ease-out; border-radius:var(--r-sm); }
@keyframes justAdded {
  0%, 35% { background:color-mix(in srgb, var(--accent) 22%, transparent); }
  100%    { background:transparent; }
}

/* ════ 写下第一步（休息卡片 / 开始卡片里） ════ */
.step-field { display:block; margin-top:12px; }
.step-field-label { display:block; font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; opacity:0.7; margin-bottom:6px; }
.step-input {
  width:100%; min-height:46px; padding:0 14px; border-radius:var(--r-sm);
  border:1.5px solid transparent; background:var(--bg); color:var(--ink);
  font:inherit; font-size:16px; outline:none;
}
.step-input::placeholder { color:var(--ink3); }
.step-input:focus { border-color:var(--ink); }
.hero .step-input { background:color-mix(in srgb, var(--fg) 12%, transparent); color:var(--fg); }
.hero .step-input::placeholder { color:color-mix(in srgb, var(--fg) 55%, transparent); }
.hero .step-input:focus { border-color:var(--fg); }

/* ════ 模版：编辑页底部按钮 + 面板 ════ */
#editFooter { display:none; gap:8px; margin-top:22px; }
body.edit-mode #editFooter { display:flex; }
#editFooter > button { flex:1; min-height:50px; font-size:14px; }
#editFooter svg { flex-shrink:0; }

.tpl-list { display:flex; flex-direction:column; margin-bottom:6px; }
.tpl-row { display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--line); }
.tpl-pick {
  flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:7px;
  background:none; border:none; text-align:left; padding:10px 2px; cursor:pointer;
}
.tpl-row-name { font-size:17px; font-weight:600; }
.tpl-row.on .tpl-row-name { font-weight:800; }
.tpl-dots { display:flex; flex-wrap:wrap; gap:4px; }
.tpl-dots i { width:9px; height:9px; border-radius:50%; display:block; }
.tpl-check {
  width:28px; height:28px; border-radius:50%; background:var(--ink); color:var(--bg);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.tpl-del { background:none; border:none; color:var(--ink2); font-size:20px; width:36px; height:36px; cursor:pointer; flex-shrink:0; }
.tpl-del:hover { color:var(--accent); }
.tpl-new { display:flex; gap:8px; margin-top:14px; }
.tpl-new input {
  flex:1; min-height:50px; padding:0 16px; border-radius:99px; border:1.5px solid var(--line);
  background:var(--surf); color:var(--ink); font:inherit; font-size:16px; outline:none;
}
.tpl-new input:focus { border-color:var(--ink); }
.tpl-new .btn-primary { width:50px; min-height:50px; padding:0; }
.tpl-new .btn-primary:disabled { opacity:0.3; }
body.edit-mode .edit-head .greeting { margin-bottom:22px; }
#palDrawer[data-state="peek"] .pal-body { visibility:hidden; }

/* ════ 睡前页 ════ */
.bed-today { display:flex; align-items:center; gap:18px; }
.bed-ring { width:72px; height:72px; flex-shrink:0; }
.bed-first { margin-top:16px; padding:14px 16px; background:var(--surf); border-radius:var(--r-md); }
.bed-first .next-title { font-size:18px; }
.bed-first .next-step { margin-left:0; margin-top:6px; }
#bedtimeView .bed-done { margin-top:28px; }
#bedtimeView .tpl-chips { display:flex; flex-wrap:wrap; gap:8px; }

/* ════ 编辑卡片：小 ＋ 按钮、色点图标按钮 ════ */
.add-chips { display:flex; gap:8px; flex-wrap:wrap; margin:2px 0 4px; }
.add-chip {
  display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 14px;
  border-radius:99px; border:1.5px dashed var(--line); background:transparent; color:var(--ink2);
  font-size:13px; font-weight:600; cursor:pointer;
}
.add-chip:hover { border-style:solid; border-color:var(--ink); color:var(--ink); }
.style-btn {
  display:inline-flex; align-items:center; gap:6px; padding:6px; margin:0 -4px 0 -2px;
  border:none; border-radius:99px; background:var(--surf2); color:var(--ink); cursor:pointer;
}
.task-row.edit-target .style-btn { background:var(--bg); }

/* ════ 颜色和图标选择 ════ */
.style-head { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.style-preview {
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:inset 0 0 0 2.5px var(--c); flex-shrink:0;
}
.style-title { font-size:22px; font-weight:800; letter-spacing:-0.02em; }
.color-row { display:flex; gap:12px; margin-bottom:18px; }
.color-dot {
  width:44px; height:44px; border-radius:50%; border:none; background:var(--c); cursor:pointer;
  box-shadow:0 0 0 0 var(--bg); transition:box-shadow 0.15s;
}
.color-dot.on { box-shadow:0 0 0 3px var(--bg), 0 0 0 5.5px var(--ink); }

/* ════ 第一次使用的动作提示（不靠文字） ════ */
@keyframes nudgeY { 0%,100% { transform:translateY(0); } 25% { transform:translateY(-4px); } 75% { transform:translateY(4px); } }
body.hint-drag .drag-handle { animation:nudgeY 0.55s ease-in-out 3; color:var(--ink); background:var(--surf2); }
@keyframes trayBounce { 0%,100% { transform:translateY(0); } 30% { transform:translateY(-26px); } 55% { transform:translateY(0); } 75% { transform:translateY(-9px); } }
#palDrawer.hint-bounce { animation:trayBounce 1.3s ease-out 1; }

/* ════ 睡前页：明天的任务链 ════ */
.bed-today { display:flex; align-items:center; gap:18px; background:none; border:none; padding:0; cursor:pointer; color:inherit; text-align:left; }
.tmr-list { margin-top:12px; }
.tmr-row { border-bottom:1px solid var(--line); }
.tmr-row .row-top { min-height:46px; }
.tmr-title { cursor:text; }
.tmr-body { padding:0 2px 12px 56px; }
.tmr-body:empty { display:none; }
.tmr-step { font-size:14px; color:var(--ink2); cursor:text; }
.tmr-row.first { background:var(--surf); border-radius:var(--r-md); border-bottom-color:transparent; padding:0 12px; margin:0 -12px 6px; }
.tmr-row.first .step-field { margin-top:0; }
#tmrModal .pal-grid { grid-template-columns:repeat(5, 1fr); max-height:56vh; overflow-y:auto; }
.menu-title { font-size:12px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink2); padding:10px 0 4px; }
.alldone-edit { margin:6px auto 2px; }

/* 休息中也能随时编辑：进编辑时休息卡片让开，列表恢复正常；退出编辑后休息卡片回来 */
body.edit-mode #restSheet { display:none; }
body.edit-mode.resting #chainList,
body.edit-mode.resting #progressRail,
body.edit-mode.resting #startDay { filter:none; opacity:1; pointer-events:auto; }

/* ════ 往日记录 ════ */
.pl-day { padding:14px 0 6px; border-top:1px solid var(--line); }
#pastLogView .page-title { margin-bottom:18px; }
.pl-head { display:flex; justify-content:space-between; align-items:flex-end; width:100%; background:none; border:none; padding:0 0 10px; cursor:pointer; color:inherit; text-align:left; }
.pl-date { font-size:18px; font-weight:700; letter-spacing:-0.01em; }
.pl-head .big-num { font-size:40px; }
.pl-item { display:grid; grid-template-columns:44px 5px 1fr; gap:12px; padding:8px 0; }
.pl-time { font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; text-align:right; line-height:1.4; }
.pl-time span { display:block; font-weight:400; color:var(--ink2); font-size:12px; }
.pl-bar { border-radius:99px; background:var(--c); }
.pl-title { display:flex; align-items:center; gap:8px; font-size:16px; font-weight:600; }
.pl-dur { margin-left:auto; font-size:12px; font-weight:400; color:var(--ink2); font-variant-numeric:tabular-nums; }
.pl-note { font-size:13px; color:var(--ink2); line-height:1.5; margin-top:3px; }
.pl-note span { display:inline-block; font-size:11px; font-weight:700; letter-spacing:0.08em; color:var(--ink3); margin-right:8px; }

/* iPhone：输入框文字小于 16px 会自动放大页面，所以输入时一律至少 16px */
input, textarea, select { font-size:max(16px, 1em); }
.inline-edit { font-size:max(16px, 1em); }

/* 往日记录：折叠 / 展开 */
.pl-head { align-items:center; gap:12px; }
.pl-head .pl-date { flex:1; }
.pl-head .big-num { font-size:32px; }
.pl-tri {
  width:0; height:0; flex-shrink:0;
  border-left:8px solid var(--ink); border-top:6px solid transparent; border-bottom:6px solid transparent;
  transition:transform 0.2s;
}
.pl-day.open .pl-tri { transform:rotate(90deg); }
.pl-day { padding:12px 0; }
.pl-head { padding:0; }
.pl-items { padding-top:10px; }

/* 睡前：选中的那一行（新加的事插在它后面） */
.tmr-row { cursor:pointer; }
.tmr-row.sel { background:var(--surf); box-shadow:inset 3px 0 0 var(--task-color); border-radius:var(--r-sm); border-bottom-color:transparent; padding:0 12px; margin:0 -12px; }
.tmr-row.first.sel { margin-bottom:6px; }
.tmr-groups { max-height:56vh; overflow-y:auto; margin-bottom:6px; }

/* ════ 今天最后一件：圆按钮轻轻放大缩小 + 撒花 ════ */
.circle-btn.day-done { animation:dayDonePulse 2.8s ease-in-out infinite; }
@keyframes dayDonePulse { 0%, 100% { transform:scale(1); } 50% { transform:scale(1.04); } }

.confetti { position:fixed; width:0; height:0; z-index:95; pointer-events:none; }
.confetti i {
  position:absolute; left:0; top:0; border-radius:50%; opacity:0;
  transform:translate(-50%, -50%);
  animation:confettiFly 1.1s cubic-bezier(0.15, 0.8, 0.3, 1) forwards;
}
@keyframes confettiFly {
  0%   { opacity:1; transform:translate(-50%, -50%) scale(0.3); }
  70%  { opacity:1; }
  100% { opacity:0; transform:translate(calc(-50% + var(--x)), calc(-50% + var(--y) + 40px)) scale(1); }
}
.done-art.pop { animation:donePop 0.6s cubic-bezier(0.2, 1.6, 0.4, 1) both; }
@keyframes donePop { from { transform:scale(0.2); opacity:0; } to { transform:scale(1); opacity:1; } }
.confetti { z-index:1; }
.all-done { position:relative; z-index:2; }
.all-done .undo-link { display:inline-flex; align-items:center; gap:6px; text-decoration:none; }
.all-done .undo-link span { text-decoration:underline; text-underline-offset:3px; }

/* 按下反馈：小按钮缩一下，文字类淡一下 */
.icon-btn, .row-del, .style-btn, .add-chip, .cat-chip, .pal-add-btn, .act,
.text-link, .chain-fold, .menu-item, .pl-head, .night-row, .bed-today {
  transition: transform .12s ease, opacity .12s ease, background-color .15s, color .15s, border-color .15s;
}
.icon-btn:active, .row-del:active, .style-btn:active, .add-chip:active, .cat-chip:active, .pal-add-btn:active { transform:scale(0.9); }
.icon-btn:active { background:var(--surf); }
.text-link:active, .chain-fold:active, .menu-item:active, .pl-head:active, .night-row:active, .bed-today:active, .act:active { opacity:0.5; }

/* 完成页的链接：图标 + 文字，都在中线上 */
.all-done .icon-link, .all-done .undo-link { display:flex; align-items:center; justify-content:center; gap:6px; text-decoration:none; }
.all-done .icon-link span { text-decoration:underline; text-underline-offset:3px; }
.all-done .icon-link svg { flex-shrink:0; }

/* 日历翻月：黑色小三角 */
.cal-head .icon-btn svg { width:10px; height:11px; }
.cal-head .cal-prev svg { transform:scaleX(-1); }

/* ════ 点击范围：看起来小，手指能点的范围至少 44×44 ════
   用透明的 ::after 往外扩，不改变外观；相邻的按钮各让一半，不互相抢 */
.row-del, .drag-handle, .style-btn, .add-chip, .cat-chip, .tpl-del, #toast button { position:relative; }
.row-del::after, .drag-handle::after, .style-btn::after, .add-chip::after,
.cat-chip::after, .tpl-del::after, .pt-del::after, #toast button::after {
  content:''; position:absolute;
}
/* × 和 ≡ 中间只有 8px：× 往左多扩，≡ 往右多扩，在中间各占 4px */
.row-del::after     { inset:-6px -4px -6px -8px; }    /* 32 → 44 × 44 */
.drag-handle::after { inset:-4px -4px -4px -4px; }    /* 36 → 44 × 44 */
.style-btn::after   { inset:-6px 0; }                 /* 高 32 → 44 */
.add-chip::after    { inset:-5.5px -1.5px; }          /* 高 36 → 44（含 1.5px 边框） */
.cat-chip::after    { inset:-3.5px -1.5px; }          /* 高 40 → 44（含 1.5px 边框） */
.tpl-del::after     { inset:-4px; }                   /* 36 → 44 */
.pt-del::after      { inset:-8px; }                   /* 22 → 38，不盖住圆圈中间 */
#toast button::after { inset:-8px -6px; }
/* 点名字改名：文字只有 24 高，上下各加 10px 点击范围，外观不变 */
.row-title.editable, body.edit-mode .row-title, .tmr-title { padding:10px 0; margin:-10px 0; }
.text-link { min-height:44px; }
