:root {
  --bg: #fafafa;
  --bg-soft: #f4f4f5;
  --card: #ffffff;
  --ink: #18181b;
  --ink-soft: #52525b;
  --ink-faint: #a1a1aa;
  --line: #e4e4e7;
  --line-strong: #d4d4d8;
  --accent: #6d5df6;
  --accent-ink: #ffffff;
  --accent-soft: #f1effe;
  --star: #f59e0b;
  --star-soft: #fef3c7;
  --ok: #16a34a;
  --danger: #dc2626;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(24, 24, 27, .04), 0 4px 14px rgba(24, 24, 27, .05);
  --shadow-lg: 0 18px 48px rgba(24, 24, 27, .14);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  --tabbar-h: 72px;
}

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

html, body { height: 100%; }

body {
  font-family: var(--sans);
  color: var(--ink);
  background: var(--bg);
  display: flex;
  justify-content: center;
}

.phone {
  position: relative;
  width: 100%;
  max-width: 430px;
  height: 100dvh;
  overflow: hidden;
  background: var(--bg);
  display: flex;
  flex-direction: column;
}

@media (min-width: 480px) {
  .phone {
    margin: 18px auto;
    height: calc(100dvh - 36px);
    border-radius: 30px;
    box-shadow: var(--shadow-lg), 0 0 0 1px rgba(24, 24, 27, .06);
    overflow: hidden;
  }
}

.main {
  flex: 1;
  overflow-y: auto;
  padding: 22px 18px calc(var(--tabbar-h) + 22px);
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

.view { display: none; animation: viewIn .24s var(--ease-out) both; }
.view.is-active { display: block; }

@keyframes viewIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.star {
  color: var(--star);
  font-style: normal;
}

/* ---------- Hero / Today ---------- */
.hero { padding: 8px 2px 18px; }
.hero-greet {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.35;
  color: var(--ink);
}
.hero-date { margin-top: 6px; color: var(--ink-soft); font-size: 13.5px; letter-spacing: .01em; }
.hero-count {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--ink-soft);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 12px;
}
.hero-count b { color: var(--ink); font-size: 14px; font-weight: 700; }
.hero-count .star { font-size: 12px; }

/* ---------- Capture ---------- */
.capture {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
  box-shadow: var(--shadow);
}
.capture-input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 0 12px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.capture-input-wrap:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
  background: var(--card);
}
.capture-link-icon { font-size: 14px; color: var(--ink-faint); }
.capture-input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 14.5px;
  padding: 13px 2px;
  color: var(--ink);
  min-width: 0;
}
.capture-input::placeholder { color: var(--ink-faint); }
.capture-btn {
  margin-top: 12px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 14px;
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .01em;
  color: #fff;
  background: var(--ink);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(24, 24, 27, .18);
  transition: transform 160ms var(--ease-out), box-shadow .2s var(--ease-out), background .2s ease;
  position: relative;
}
.capture-btn:active { transform: scale(.97); box-shadow: 0 2px 6px rgba(24, 24, 27, .14); }
.capture-btn .star { color: var(--star); }
.capture-btn.is-busy { opacity: .7; pointer-events: none; }
.capture-hint {
  margin-top: 10px;
  font-size: 11.5px;
  color: var(--ink-faint);
  text-align: center;
}
.capture.shake { animation: shake .4s ease; }
@keyframes shake {
  20%, 60% { transform: translateX(-6px); }
  40%, 80% { transform: translateX(6px); }
}

/* ---------- Today flow ---------- */
.today-flow { margin-top: 24px; }
.flow-group { margin-bottom: 24px; }
.flow-cat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--accent);
  margin-bottom: 10px;
}
.flow-cat::after {
  content: "";
  height: 1px;
  width: 34px;
  background: var(--line-strong);
}

/* ---------- Knowledge card ---------- */
.kc {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 16px 13px;
  box-shadow: var(--shadow);
  margin-bottom: 12px;
  animation: riseIn .3s var(--ease-out) both;
  transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out), border-color .25s ease;
  will-change: transform, opacity;
}
.kc:active { transform: scale(.988); }
.kc.is-new { animation: newIn .65s cubic-bezier(.22, 1, .36, 1) both; }
@keyframes newIn {
  0% { opacity: 0; transform: translateY(20px) scale(.98); }
  55% { opacity: 1; transform: translateY(-3px) scale(1.005); box-shadow: 0 12px 32px rgba(109, 93, 246, .18); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes riseIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.kc-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.kc-source {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--ink-soft);
}
.p-ico {
  width: 18px;
  height: 18px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  color: #fff;
  font-weight: 700;
  flex: none;
}
.kc-star-btn {
  border: 0;
  background: none;
  font-size: 17px;
  cursor: pointer;
  color: var(--line-strong);
  line-height: 1;
  padding: 2px;
  transition: transform .2s var(--ease-out), color .2s ease;
}
.kc-star-btn.is-starred { color: var(--star); transform: scale(1.08); }
.kc-star-btn:active { transform: scale(1.3); }

.kc-title {
  font-size: 16px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: -.01em;
  color: var(--ink);
}
.kc-summary {
  margin-top: 8px;
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--ink-soft);
}
.kc-points { margin-top: 12px; display: grid; gap: 7px; }
.kc-point {
  display: flex;
  gap: 9px;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--ink);
}
.kc-point .num {
  flex: none;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.kc-more { margin-top: 12px; }
.kc-value {
  margin-top: 12px;
  padding: 12px 13px;
  border-radius: var(--radius-sm);
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.kc-value .lab { font-size: 11.5px; font-weight: 600; margin-bottom: 6px; letter-spacing: .04em; color: var(--accent); }
.kc-value { background: var(--accent-soft); border-color: rgba(109, 93, 246, .18); }
.kc-value p { font-size: 13px; line-height: 1.7; color: var(--ink); }
.kc-tags { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
  border: 1px solid var(--line);
  background: var(--bg-soft);
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 500;
  padding: 5px 11px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 140ms var(--ease-out), background .2s ease, border-color .2s ease, color .2s ease;
}
.tag:active { transform: scale(.95); }
.tag.is-alt { background: var(--accent-soft); border-color: rgba(109, 93, 246, .22); color: var(--accent); }
.tag.is-grow { background: var(--star-soft); border-color: rgba(245, 158, 11, .28); color: #b45309; }
.tag.is-cold { background: #eff6ff; border-color: rgba(37, 99, 235, .2); color: #2563eb; }

.kc-foot {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.kc-expand {
  border: 0;
  background: none;
  color: var(--ink-faint);
  font-size: 12px;
  cursor: pointer;
  padding: 4px 2px;
  transition: transform 140ms var(--ease-out), color .2s ease;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.kc-expand:active { transform: scale(.96); }
.kc-expand .caret { transition: transform .25s var(--ease-in-out); display: inline-block; }
.kc.is-open .caret { transform: rotate(180deg); }
.kc-actions { display: flex; gap: 2px; }
.kc-act {
  border: 0;
  background: none;
  cursor: pointer;
  font-size: 14px;
  padding: 5px 7px;
  border-radius: 8px;
  color: var(--ink-faint);
  transition: background .2s ease, color .2s ease, transform 140ms var(--ease-out);
}
.kc-act:active { transform: scale(.9); }
@media (hover: hover) and (pointer: fine) {
  .kc-act:hover { background: var(--bg-soft); color: var(--ink); }
}
.kc-act[data-act="open"] { color: var(--accent); }

/* ---------- Empty state ---------- */
.empty {
  text-align: center;
  padding: 56px 24px;
  animation: riseIn .3s var(--ease-out) both;
}
.empty-star {
  font-size: 34px;
  color: var(--star);
  display: block;
  animation: floaty 3.2s ease-in-out infinite;
}
.empty-title { margin-top: 14px; font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.empty-sub { margin-top: 8px; font-size: 13px; color: var(--ink-soft); line-height: 1.7; }
.empty-btn {
  margin-top: 20px;
  border: 1px solid var(--line-strong);
  background: var(--card);
  color: var(--ink);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  padding: 11px 24px;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: var(--shadow);
  transition: transform 150ms var(--ease-out), background .2s ease, border-color .2s ease;
}
.empty-btn:active { transform: scale(.96); background: var(--bg-soft); }
@keyframes floaty {
  0%, 100% { transform: translateY(0) rotate(-4deg); }
  50% { transform: translateY(-8px) rotate(6deg); }
}

/* ---------- Page heads / Library ---------- */
.page-head { padding: 4px 2px 16px; }
.page-head h1 {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.page-sub { margin-top: 5px; font-size: 13px; color: var(--ink-soft); }
.page-sub b { color: var(--ink); font-weight: 600; }

.search-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 15px;
  box-shadow: var(--shadow);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.search-wrap:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.search-ico { font-size: 14px; color: var(--ink-faint); }
.search-input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  padding: 12px 2px;
  min-width: 0;
}
.search-input::placeholder { color: var(--ink-faint); }

.chip-row {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 14px 2px 6px;
  scrollbar-width: none;
}
.chip-row::-webkit-scrollbar { display: none; }
.chip {
  flex: none;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 500;
  padding: 7px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 150ms var(--ease-out), background .2s ease, color .2s ease, border-color .2s ease;
}
.chip:active { transform: scale(.96); }
.chip.is-active {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

.lib-list { margin-top: 14px; }
.lib-list .kc:last-child { margin-bottom: 0; }

/* ---------- Digest ---------- */
.digest-month {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 16px 15px;
}
.dm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.dm-month { font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.dm-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
  text-align: center;
}
.dm-dow { font-size: 11px; color: var(--ink-faint); padding: 5px 0; }
.dm-day {
  position: relative;
  min-width: 0;
  overflow: hidden;
  height: 58px;
  border: 0;
  background: none;
  border-radius: 13px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 7px 4px 8px;
  transition: background .2s ease, transform 150ms var(--ease-out);
}
.dm-day:active { transform: scale(.94); }
.dm-day .d-num { font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1; }
.dm-day.is-today {
  background: var(--ink);
  box-shadow: 0 4px 12px rgba(24, 24, 27, .2);
}
.dm-day.is-today .d-num { color: #fff; }
.dm-day.is-empty { opacity: .4; }
.d-bars { display: flex; gap: 3px; width: 100%; margin-top: auto; }
.db { flex: 1; height: 4px; border-radius: 2px; min-width: 2px; }
.db em { display: none; font-style: normal; }
.db-inspiration { background: var(--accent); }
.db-mood { background: #ec4899; }
.db-diary { background: #3b82f6; }
.db-idea { background: #f59e0b; }
.db-todo { background: #16a34a; }
.db-music { background: #f43f5e; }
.db-book { background: #b45309; }
.db-movie { background: #f97316; }
.db-series { background: #06b6d4; }
.db-documentary { background: #64748b; }
.d-mood {
  font-size: 13px;
  line-height: 1.15;
  margin-bottom: 1px;
}
.db-todo.has-text {
  flex: 0 0 auto;
  max-width: 100%;
  height: 13px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  overflow: hidden;
}
.db-todo.has-text em {
  display: inline-block;
  font-size: 7px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* ---------- Digest：TodoList ---------- */
.digest-todos {
  margin-top: 18px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 15px;
}
.dt-head { display: flex; align-items: baseline; gap: 8px; }
.dt-title { font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; }
.dt-meta { font-size: 11.5px; color: var(--ink-faint); }
.dt-list { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; }
.dt-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 4px;
  border-bottom: 1px dashed var(--line);
}
.dt-row:last-child { border-bottom: 0; }
.dt-check {
  flex: none;
  width: 24px; height: 24px;
  border: 1.5px solid var(--line-strong);
  border-radius: 999px;
  background: var(--card);
  color: var(--ok);
  font-size: 13px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: transform 150ms var(--ease-out), background .15s ease, border-color .15s ease;
}
.dt-check:active { transform: scale(.85); }
.dt-row.is-done .dt-check { background: var(--ok); border-color: var(--ok); color: #fff; }
.dt-body { flex: 1; min-width: 0; }
.dt-text { font-size: 13.5px; color: var(--ink); line-height: 1.45; }
.dt-row.is-done .dt-text { text-decoration: line-through; color: var(--ink-faint); }
.dt-date { margin-top: 1px; font-size: 10.5px; color: var(--ink-faint); }
.dt-empty { margin-top: 10px; font-size: 13px; color: var(--ink-faint); line-height: 1.6; text-align: center; padding: 8px 0; }

/* 页面放大时：色彩条变成带标签名的彩色标签 */
.digest-month.is-zoomed .dm-day { height: auto; min-height: 58px; padding: 7px 8px 9px; }
.digest-month.is-zoomed .d-bars { flex-direction: column; gap: 2px; margin-top: 2px; }
.digest-month.is-zoomed .db {
  flex: 0 0 auto;
  max-width: 100%;
  height: 14px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}
.digest-month.is-zoomed .db em {
  display: inline-block;
  font-size: 7px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* ---------- Digest day ---------- */
.back-btn {
  border: 0;
  background: none;
  font-size: 14px;
  color: var(--ink-soft);
  cursor: pointer;
  padding: 6px 2px 14px;
  font-weight: 600;
  transition: transform 140ms var(--ease-out), color .2s ease;
}
.back-btn:active { transform: scale(.97); }
.digest-hero {
  border-radius: var(--radius);
  padding: 20px 18px;
  background: linear-gradient(150deg, #1d1d22, #26262e);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 10px 26px rgba(24, 24, 27, .18);
  margin-bottom: 18px;
}
.digest-hero .d-title { font-size: 21px; font-weight: 700; letter-spacing: -.02em; }
.digest-hero .d-date { margin-top: 6px; font-size: 12.5px; color: rgba(255, 255, 255, .65); }
.digest-hero .d-meta { margin-top: 12px; font-size: 13px; line-height: 1.8; color: rgba(255, 255, 255, .85); }
.digest-hero .d-meta b { font-size: 16px; font-weight: 700; color: #fff; }
.digest-hero .d-meta .dot { opacity: .6; margin: 0 6px; }

.dg-section { margin-top: 22px; }
.dg-section h2 {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.dg-section h2 .sw { color: var(--star); font-size: 13px; }
.dg-highlight {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 13px 15px;
  margin-bottom: 9px;
  box-shadow: var(--shadow);
  animation: riseIn .3s var(--ease-out) both;
}
.dg-highlight .h-num {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--accent);
  margin-bottom: 5px;
}
.dg-highlight .h-title { font-size: 14px; font-weight: 650; line-height: 1.5; letter-spacing: -.01em; }
.dg-highlight .h-body { margin-top: 5px; font-size: 12.5px; line-height: 1.7; color: var(--ink-soft); }

.dg-sentence {
  margin-top: 6px;
  border-radius: var(--radius-sm);
  padding: 16px 16px;
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  box-shadow: var(--shadow);
}
.dg-sentence .s-lab { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--accent); }
.dg-sentence p {
  margin-top: 8px;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.7;
  letter-spacing: -.01em;
}

.dg-items { display: grid; gap: 9px; margin-top: 4px; }
.dg-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 12px 13px;
  cursor: pointer;
  box-shadow: var(--shadow);
  transition: transform 150ms var(--ease-out), border-color .2s ease;
  text-align: left;
  font: inherit;
}
.dg-item:active { transform: scale(.98); border-color: var(--line-strong); }
.dg-item .dg-item-title { font-size: 13.5px; font-weight: 600; line-height: 1.45; letter-spacing: -.01em; }
.dg-item .dg-item-src { font-size: 11px; color: var(--ink-faint); margin-top: 3px; }

/* ---------- Detail ---------- */
.detail-body .kc { box-shadow: var(--shadow-lg); }
.detail-original {
  margin-top: 4px;
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  background: var(--bg-soft);
  border: 1px dashed var(--line-strong);
  font-size: 12px;
  color: var(--ink-soft);
  word-break: break-all;
  line-height: 1.7;
}
.detail-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 14px; }
.detail-act {
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 12px 2px;
  font: inherit;
  font-size: 11.5px;
  color: var(--ink-soft);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  transition: transform 150ms var(--ease-out), border-color .2s ease, color .2s ease, background .2s ease;
}
.detail-act:active { transform: scale(.95); }
.detail-act .ia { font-size: 16px; }
.detail-act.is-starred { border-color: rgba(245, 158, 11, .4); color: var(--star); background: var(--star-soft); }
.detail-act.danger { color: var(--danger); border-color: rgba(220, 38, 38, .28); }

/* ---------- Tabbar ---------- */
.tabbar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
  background: rgba(255, 255, 255, .9);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-top: 1px solid var(--line);
  display: flex;
  align-items: stretch;
  z-index: 30;
}
.tab {
  flex: 1;
  border: 0;
  background: none;
  font: inherit;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  font-size: 11px;
  color: var(--ink-faint);
  cursor: pointer;
  transition: color .2s ease, transform 140ms var(--ease-out);
}
.tab:active { transform: scale(.96); }
.tab-ico { font-size: 18px; line-height: 1; transition: transform .2s var(--ease-out), color .2s ease; }
.tab.is-active { color: var(--ink); font-weight: 600; }
.tab.is-active .tab-ico { color: var(--accent); transform: translateY(-2px) scale(1.08); }
.tab::after {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: transparent;
  transition: background .2s ease;
}
.tab.is-active::after { background: var(--accent); }

/* ---------- Processing ---------- */
.processing {
  position: absolute;
  inset: 0;
  z-index: 60;
  background: rgba(250, 250, 250, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .22s var(--ease-out) both;
}
@keyframes fadeIn { from { opacity: 0; } }
.processing[hidden] { display: none; }
.processing-card {
  width: min(296px, 78vw);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow-lg);
  padding: 28px 24px 24px;
  text-align: center;
  animation: popIn .35s cubic-bezier(.22, 1.4, .36, 1) both;
}
@keyframes popIn {
  from { opacity: 0; transform: scale(.92) translateY(14px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
.proc-star {
  font-size: 30px;
  color: var(--star);
  animation: spinStar 2.6s linear infinite;
  display: inline-block;
}
@keyframes spinStar {
  0% { transform: rotate(0) scale(1); }
  50% { transform: rotate(180deg) scale(1.12); }
  100% { transform: rotate(360deg) scale(1); }
}
.proc-title { margin-top: 10px; font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.proc-steps {
  list-style: none;
  margin-top: 18px;
  display: grid;
  gap: 8px;
  text-align: left;
}
.proc-steps li {
  font-size: 13px;
  color: var(--ink-faint);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  background: var(--bg-soft);
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.proc-steps li::before {
  content: "○";
  font-size: 12px;
  color: var(--ink-faint);
  transition: color .2s ease, transform .2s ease;
}
.proc-steps li.is-active {
  color: var(--ink);
  background: var(--accent-soft);
  animation: stepPulse 1.1s var(--ease-in-out) infinite;
}
.proc-steps li.is-active::before { content: "◔"; color: var(--accent); }
.proc-steps li.is-done { color: var(--ink-soft); }
.proc-steps li.is-done::before { content: "✓"; color: var(--ok); font-weight: 800; }
@keyframes stepPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.015); }
}

/* ---------- Toast / milestone ---------- */
.toast {
  position: absolute;
  left: 50%;
  bottom: calc(var(--tabbar-h) + 24px);
  transform: translateX(-50%);
  z-index: 80;
  background: var(--ink);
  color: #fff;
  border-radius: 999px;
  padding: 12px 20px;
  font-size: 13.5px;
  font-weight: 600;
  box-shadow: 0 10px 28px rgba(24, 24, 27, .28);
  max-width: 86%;
  text-align: center;
  will-change: transform, opacity;
}
.toast[hidden] { display: none; }
.toast.fallback-in { animation: toastIn .28s var(--ease-out) both; }
.toast.is-milestone {
  background: var(--ink);
  font-size: 14.5px;
  padding: 14px 24px;
}
@keyframes toastIn {
  from { opacity: 0; transform: translate(-50%, 16px) scale(.94); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}

/* ---------- Modal / bottom sheet ---------- */
.modal-root { position: absolute; inset: 0; z-index: 70; pointer-events: none; }
.modal-root .sheet-mask {
  position: absolute;
  inset: 0;
  background: rgba(24, 24, 27, .4);
  backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity .25s var(--ease-out);
  pointer-events: auto;
}
.modal-root .sheet {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--card);
  border-radius: 22px 22px 0 0;
  border-top: 1px solid var(--line);
  padding: 18px 20px calc(22px + env(safe-area-inset-bottom));
  transform: translateY(105%);
  transition: transform .32s cubic-bezier(.32, .72, 0, 1);
  max-height: 86%;
  overflow-y: auto;
  pointer-events: auto;
  box-shadow: 0 -16px 48px rgba(24, 24, 27, .16);
}
.modal-root.is-open .sheet-mask { opacity: 1; }
.modal-root.is-open .sheet { transform: translateY(0); }
.sheet-handle {
  width: 40px;
  height: 4px;
  border-radius: 99px;
  background: var(--line-strong);
  margin: 0 auto 16px;
}
.sheet h3 { font-size: 18px; font-weight: 700; letter-spacing: -.01em; margin-bottom: 16px; }
.field { margin-bottom: 13px; }
.field label { display: block; font-size: 12px; font-weight: 600; color: var(--ink-soft); margin-bottom: 6px; }
.field input, .field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px 13px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  outline: 0;
  background: var(--bg-soft);
  resize: vertical;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.field input:focus, .field textarea:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.sheet-btns { display: flex; gap: 10px; margin-top: 18px; }
.btn {
  flex: 1;
  border: 0;
  border-radius: 999px;
  padding: 13px;
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 150ms var(--ease-out), background .2s ease, box-shadow .2s ease;
}
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--ink); color: #fff; box-shadow: 0 4px 12px rgba(24, 24, 27, .18); }
.btn-ghost { background: var(--bg-soft); color: var(--ink); border: 1px solid var(--line); }

/* ---------- Me ---------- */
.me-profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 4px 10px;
}
.me-avatar {
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: var(--accent-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: var(--shadow);
}
.me-name {
  margin-top: 14px;
  font-size: 17.5px;
  font-weight: 800;
  letter-spacing: -.01em;
}
.me-desc { margin-top: 4px; font-size: 12.5px; color: var(--ink-soft); }
.me-quote {
  margin-top: 12px;
  max-width: 90%;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.85;
  color: var(--ink);
  letter-spacing: .01em;
}
.me-quote .mq {
  font-weight: 800;
}

/* ---------- Me：笔记本 ---------- */
.me-notebook {
  margin-top: 16px;
}
.mn-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 12px;
}
.mn-title { font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; }
.mn-count { font-size: 11.5px; color: var(--ink-faint); }
.me-ideas { margin-top: 24px; }
.mn-page {
  position: relative;
  background: linear-gradient(180deg, #fffdf7 0%, #fdf9ee 100%);
  border: 1px solid #efe6d2;
  border-radius: 14px;
  padding: 14px 16px 15px;
  margin-bottom: 12px;
  box-shadow: 0 2px 10px rgba(120, 96, 40, .06);
}
.mn-page::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: 8px;
  width: 1px;
  background: rgba(214, 192, 148, .45);
}
.mn-date {
  font-size: 11px;
  font-weight: 700;
  color: #a58a55;
  letter-spacing: .08em;
  margin-bottom: 6px;
}
.mn-text {
  font-family: "Kaiti SC", "STKaiti", "Snell Roundhand", "Noteworthy", "Hannotate SC", cursive;
  font-size: 15px;
  line-height: 1.85;
  color: #4b3d28;
  white-space: pre-wrap;
}
.mn-empty {
  background: var(--card);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius);
  padding: 28px 18px;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink-soft);
  line-height: 2;
}
.mn-empty span { font-size: 12px; font-weight: 400; color: var(--ink-faint); }

.setting-group {
  margin-top: 16px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 4px 15px;
  box-shadow: var(--shadow);
}
.setting-group h3 {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--accent);
  padding: 14px 0 4px;
}
.setting-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  font-size: 14px;
  border-top: 1px solid var(--line);
}
.setting-row:first-of-type { border-top: 0; }
.setting-row input[type="time"] {
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 7px 9px;
  font: inherit;
  font-size: 13.5px;
  color: var(--ink);
  background: var(--bg-soft);
  outline: 0;
}
.setting-row.is-soon { color: var(--ink-faint); }
.soon {
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-faint);
  background: var(--bg-soft);
  border: 1px solid var(--line);
  padding: 3px 10px;
  border-radius: 999px;
}
.switch { position: relative; width: 44px; height: 26px; flex: none; cursor: pointer; }
.switch input { opacity: 0; width: 0; height: 0; }
.switch i {
  position: absolute;
  inset: 0;
  background: var(--line-strong);
  border-radius: 999px;
  transition: background .25s ease;
}
.switch i::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  top: 3px;
  left: 3px;
  transition: transform .25s var(--ease-out);
  box-shadow: 0 1px 3px rgba(24, 24, 27, .25);
}
.switch input:checked + i { background: var(--accent); }
.switch input:checked + i::after { transform: translateX(18px); }

.ghost-btn {
  width: 100%;
  margin-top: 13px;
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 13px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  box-shadow: var(--shadow);
  transition: transform 150ms var(--ease-out), border-color .2s ease, background .2s ease;
}
.ghost-btn:active { transform: scale(.98); background: var(--bg-soft); }
.ghost-btn.danger { color: var(--danger); border-color: rgba(220, 38, 38, .3); }
.me-foot {
  margin: 18px 0 6px;
  text-align: center;
  font-size: 11.5px;
  color: var(--ink-faint);
  line-height: 1.8;
}
.backup-group {
  margin-top: 22px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow);
}
.backup-group h3 { font-size: 14.5px; font-weight: 800; letter-spacing: -.01em; }
.backup-hint { margin-top: 6px; font-size: 12px; color: var(--ink-faint); line-height: 1.7; }
.backup-btns { margin-top: 13px; display: flex; gap: 10px; }
.backup-btns .ghost-btn { flex: 1; margin: 0; padding: 11px 8px; font-size: 13px; }
.sync-group { margin-top: 14px; }
.sync-input {
  width: 100%;
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg-soft);
  padding: 12px 14px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  outline: 0;
}
.sync-input:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.import-area {
  width: 100%;
  min-height: 130px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg-soft);
  padding: 12px 14px;
  font: inherit;
  font-size: 12px;
  line-height: 1.6;
  color: var(--ink);
  outline: 0;
  resize: vertical;
}
.import-area:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}

/* ---------- Learning layer ---------- */
.status-chip {
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--ink-faint);
  font-size: 10.5px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 140ms var(--ease-out), border-color .2s ease, color .2s ease, background .2s ease;
}
.status-chip:active { transform: scale(.94); }
.status-chip.st-learning {
  color: var(--accent);
  border-color: rgba(109, 93, 246, .35);
  background: var(--accent-soft);
}
.status-chip.st-done {
  color: var(--ok);
  border-color: rgba(22, 163, 74, .3);
  background: #f0fdf4;
}
.kc-top-right { display: flex; align-items: center; gap: 7px; }

.learn-now {
  margin-top: 16px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow);
}
.ln-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--accent);
}
.learn-now h3 { margin-top: 5px; font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.ln-copy { margin-top: 6px; font-size: 13px; color: var(--ink-soft); line-height: 1.7; }
.ln-stats { margin-top: 10px; display: flex; gap: 14px; font-size: 12px; color: var(--ink-faint); }
.ln-stats b { color: var(--ink); font-weight: 700; }
.ln-btn {
  margin-top: 13px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 13px;
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  color: #fff;
  background: var(--ink);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(24, 24, 27, .16);
  transition: transform 160ms var(--ease-out), box-shadow .2s var(--ease-out), background .2s ease;
}
.ln-btn:active { transform: scale(.97); }

/* ---------- 产品搭子（Buddy） ---------- */
.buddy-card {
  margin-top: 16px;
  background: linear-gradient(160deg, #ffffff 0%, #fbfaff 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow);
}
.buddy-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--accent);
}
.buddy-card h3 { margin-top: 5px; font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.buddy-sub { margin-top: 5px; font-size: 12.5px; color: var(--ink-soft); line-height: 1.7; }
.buddy-input-wrap {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  align-items: center;
}
.buddy-home-input {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--bg-soft);
  border-radius: 12px;
  padding: 11px 13px;
  font: inherit;
  font-size: 13.5px;
  color: var(--ink);
  outline: 0;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.buddy-home-input::placeholder { color: var(--ink-faint); }
.buddy-home-input:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.buddy-go {
  flex: none;
  border: 0;
  border-radius: 999px;
  padding: 12px 15px;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  background: var(--accent);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(109, 93, 246, .24);
  transition: transform 150ms var(--ease-out), box-shadow .2s var(--ease-out);
}
.buddy-go:active { transform: scale(.96); }

.buddy-overlay {
  position: absolute;
  inset: 0;
  z-index: 56;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  animation: viewIn .24s var(--ease-out) both;
}
.buddy-overlay[hidden] { display: none; }
.buddy-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 16px 16px 0;
  flex: none;
}
.buddy-head-title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.b-head-star { color: var(--accent); }
.buddy-harvest {
  border: 1px solid rgba(109, 93, 246, .35);
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: 999px;
  padding: 8px 13px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  opacity: .55;
  transition: transform 150ms var(--ease-out), opacity .2s ease, background .2s ease;
}
.buddy-harvest.is-ready { opacity: 1; }
.buddy-harvest:active { transform: scale(.95); }
.buddy-body {
  flex: 1;
  overflow-y: auto;
  padding: 18px 16px 12px;
  -webkit-overflow-scrolling: touch;
}
.b-msg {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  animation: riseIn .28s var(--ease-out) both;
}
.b-msg.b-user { justify-content: flex-end; }
.b-ava {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: var(--accent-soft);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}
.b-bubble {
  max-width: 86%;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  box-shadow: var(--shadow);
}
.b-user .b-bubble {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
  border-bottom-right-radius: 5px;
  font-size: 14px;
  line-height: 1.65;
}
.b-agent .b-bubble { border-bottom-left-radius: 5px; }
.b-lab {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--accent);
  margin-bottom: 6px;
}
.b-text { font-size: 13.5px; line-height: 1.7; color: var(--ink); }
.b-list {
  list-style: none;
  margin: 9px 0 0;
  display: grid;
  gap: 7px;
}
.b-list li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.65;
  color: var(--ink-soft);
}
.b-num {
  flex: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}
.b-take {
  margin-top: 10px;
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--accent-soft);
  border: 1px solid rgba(109, 93, 246, .2);
}
.b-ask {
  margin-top: 10px;
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--star-soft);
  border: 1px solid rgba(245, 158, 11, .28);
}
.b-tag {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  margin-bottom: 4px;
}
.b-take .b-tag { color: var(--accent); }
.b-ask .b-tag { color: #b45309; }
.b-take p, .b-ask p { font-size: 13px; line-height: 1.7; color: var(--ink); }
.b-act {
  margin-top: 11px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 11px;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  background: var(--accent);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(109, 93, 246, .22);
  transition: transform 150ms var(--ease-out);
}
.b-act:active { transform: scale(.97); }

.buddy-inputbar {
  flex: none;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom));
  background: var(--card);
  border-top: 1px solid var(--line);
}
.buddy-quick {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 9px;
  scrollbar-width: none;
}
.buddy-quick::-webkit-scrollbar { display: none; }
.bquick {
  flex: none;
  border: 1px solid var(--line);
  background: var(--bg-soft);
  border-radius: 999px;
  padding: 6px 12px;
  font: inherit;
  font-size: 12px;
  color: var(--ink-soft);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), color .2s ease, border-color .2s ease;
}
.bquick:active { transform: scale(.95); }
.bquick:hover { border-color: rgba(109, 93, 246, .45); color: var(--accent); }
.buddy-input-row { display: flex; gap: 8px; align-items: center; }
.buddy-input {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--bg-soft);
  border-radius: 999px;
  padding: 11px 15px;
  font: inherit;
  font-size: 13.5px;
  color: var(--ink);
  outline: 0;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.buddy-input::placeholder { color: var(--ink-faint); }
.buddy-input:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.buddy-send {
  flex: none;
  border: 0;
  border-radius: 999px;
  padding: 11px 18px;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  background: var(--ink);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), background .2s ease;
}
.buddy-send:active { transform: scale(.96); }

.sheet-sub {
  font-size: 12.5px;
  color: var(--ink-soft);
  line-height: 1.7;
  margin: -8px 0 14px;
}
.sheet-btns-3 { display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 8px; }
.field select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px 13px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  outline: 0;
  background: var(--bg-soft);
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.field select:focus {
  border-color: var(--accent);
  background: var(--card);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
}
.h-newtag { margin-top: 8px; }

.chip-row-status { padding-top: 6px; }
.chip-sm { font-size: 12px; padding: 6px 12px; }

.digest-todo {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 14px 15px;
  box-shadow: var(--shadow);
}
.digest-todo p { font-size: 13px; line-height: 1.75; color: var(--ink-soft); }
.digest-todo b { color: var(--ink); }

.me-stats { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.me-stat {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 14px 15px;
  box-shadow: var(--shadow);
}
.me-stat .ms-num { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.me-stat .ms-lab { margin-top: 3px; font-size: 11.5px; color: var(--ink-faint); }
.star-map-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
.star-map-row:first-child { border-top: 0; }
.star-map-row .sm-name { font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.star-map-row .sm-stars { font-size: 12px; color: var(--star); letter-spacing: 2px; }
.star-map-row .sm-count { font-size: 11px; color: var(--ink-faint); margin-left: 8px; }

.learn-overlay {
  position: absolute;
  inset: 0;
  z-index: 55;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  animation: viewIn .24s var(--ease-out) both;
}
.learn-overlay[hidden] { display: none; }
.learn-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 18px 0;
  flex: none;
}
.learn-progress { display: flex; gap: 5px; }
.learn-progress .lp-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--line-strong);
  transition: background .25s ease, transform .25s var(--ease-out);
}
.learn-progress .lp-dot.is-active { background: var(--accent); transform: scale(1.3); }
.learn-body { flex: 1; overflow-y: auto; padding: 18px 20px 42px; -webkit-overflow-scrolling: touch; }
.learn-step { animation: riseIn .3s var(--ease-out) both; }
.learn-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--accent);
}
.learn-title { margin-top: 7px; font-size: 20px; font-weight: 700; letter-spacing: -.02em; line-height: 1.5; }
.learn-sub { margin-top: 10px; font-size: 13.5px; line-height: 1.8; color: var(--ink-soft); }
.learn-options { margin-top: 20px; display: grid; gap: 9px; }
.learn-opt {
  width: 100%;
  text-align: left;
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 13px 15px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  cursor: pointer;
  box-shadow: var(--shadow);
  transition: transform 150ms var(--ease-out), border-color .2s ease, background .2s ease, color .2s ease;
}
.learn-opt:active { transform: scale(.98); }
.learn-reveal {
  margin-top: 14px;
  border-radius: var(--radius-sm);
  padding: 14px 15px;
  background: var(--accent-soft);
  border: 1px solid rgba(109, 93, 246, .2);
  animation: riseIn .3s var(--ease-out) both;
}
.learn-reveal .rv-lab { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--accent); margin-bottom: 6px; }
.learn-reveal p { font-size: 14px; line-height: 1.75; color: var(--ink); }
.learn-points { margin-top: 14px; display: grid; gap: 8px; }
.learn-point {
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 12px 13px;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-shadow: var(--shadow);
  transition: transform 150ms var(--ease-out), border-color .2s ease;
}
.learn-point:active { transform: scale(.98); }
.learn-point .pt-q { font-size: 13px; font-weight: 600; color: var(--ink); }
.learn-point .pt-a {
  margin-top: 7px;
  font-size: 12.5px;
  color: var(--ink-soft);
  line-height: 1.7;
  display: none;
}
.learn-point.is-open { border-color: var(--line-strong); }
.learn-point.is-open .pt-a { display: block; }
.learn-next {
  margin-top: 18px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 13px;
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  color: #fff;
  background: var(--ink);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(24, 24, 27, .16);
  transition: transform 160ms var(--ease-out), box-shadow .2s var(--ease-out), background .2s ease;
}
.learn-next:active { transform: scale(.97); }
.learn-next.is-violet { background: var(--accent); box-shadow: 0 4px 12px rgba(109, 93, 246, .3); }
.quiz-opt.is-correct {
  border-color: rgba(22, 163, 74, .45);
  background: #f0fdf4;
  color: var(--ok);
  font-weight: 600;
}
.quiz-opt.is-correct::after { content: " ✓"; font-weight: 800; }
.quiz-opt.is-wrong {
  border-color: rgba(245, 158, 11, .35);
  background: var(--star-soft);
  color: #b45309;
}
.quiz-opt.is-disabled { pointer-events: none; opacity: .55; }
.quiz-feedback {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  font-size: 13.5px;
  line-height: 1.7;
  animation: riseIn .25s var(--ease-out) both;
}
.quiz-feedback.is-right { background: #f0fdf4; border: 1px solid rgba(22, 163, 74, .25); color: var(--ok); }
.quiz-feedback.is-wrong { background: var(--star-soft); border: 1px solid rgba(245, 158, 11, .25); color: #b45309; }
.learn-star { text-align: center; padding: 26px 0 6px; }
.learn-star .big-star {
  font-size: 44px;
  color: var(--star);
  display: inline-block;
  animation: starPop .9s cubic-bezier(.22, 1.4, .36, 1) both;
}
@keyframes starPop {
  0% { opacity: 0; transform: scale(.2) rotate(-30deg); }
  60% { opacity: 1; transform: scale(1.25) rotate(8deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

/* ---------- Misc ---------- */
.hidden { display: none !important; }
::selection { background: rgba(109, 93, 246, .18); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ================= Personal OS：新增样式 ================= */

/* ---------- Today：心情 ---------- */
.hm-opts { display: flex; gap: 4px; }
.hm-opt {
  border: 1px solid transparent;
  background: transparent;
  border-radius: 999px;
  padding: 5px 7px;
  font-size: 19px;
  line-height: 1;
  cursor: pointer;
  transition: transform 150ms var(--ease-out), background .2s ease, border-color .2s ease;
}
.hm-opt:active { transform: scale(.88); }
.hm-opt.is-active { background: var(--star-soft); border-color: rgba(245, 158, 11, .35); }

/* ---------- Today：＋记一下 ---------- */
.quick-capture { margin-top: 10px; }
.quick-add-btn {
  width: 100%;
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius);
  background: var(--card);
  padding: 13px 16px;
  font: inherit;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), border-color .2s ease, box-shadow .2s ease;
}
.quick-add-btn:active { transform: scale(.98); }
.quick-add-btn:hover { border-color: rgba(109, 93, 246, .45); box-shadow: var(--shadow); }
.qa-plus {
  width: 26px; height: 26px;
  border-radius: 9px;
  background: var(--accent-soft);
  color: var(--accent);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
}
.qa-sub { margin-left: auto; font-size: 11.5px; font-weight: 500; color: var(--ink-faint); }

/* ---------- Daily Stream ---------- */
.daily-stream { margin-top: 22px; }
.stream-head {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 0 2px 10px;
}
.stream-head-label { font-size: 13px; font-weight: 700; letter-spacing: .02em; color: var(--ink-soft); }
.stream-count { font-size: 11.5px; color: var(--ink-faint); }
.stream-item {
  display: flex; gap: 12px;
  padding: 13px 2px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}
.stream-item:last-child { border-bottom: 0; }
.stream-item.is-new { animation: viewIn .4s var(--ease-out) both; }
.stream-time {
  flex: none;
  width: 44px;
  font-size: 11.5px;
  color: var(--ink-faint);
  font-variant-numeric: tabular-nums;
  padding-top: 2px;
}
.stream-body { flex: 1; min-width: 0; }
.stream-head { display: flex; align-items: center; gap: 7px; padding: 0; }
.stream-ico { font-size: 14px; }
.stream-type { font-size: 11.5px; font-weight: 700; color: var(--ink-soft); letter-spacing: .02em; }
.stream-status { margin-left: auto; font-size: 12px; color: var(--ink-faint); }
.stream-status.st-learning { color: var(--star); }
.stream-status.st-done { color: var(--ok); }
.stream-title { margin-top: 5px; font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1.45; }
.stream-title.is-done { text-decoration: line-through; color: var(--ink-faint); }
.stream-src { margin-top: 4px; font-size: 12px; color: var(--ink-faint); }
.stream-summary {
  margin-top: 6px;
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.stream-tags { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 6px; }
.stream-note, .stream-text { margin-top: 6px; font-size: 13.5px; color: var(--ink-soft); line-height: 1.65; white-space: pre-wrap; }
.stream-mini {
  margin-top: 8px;
  border: 0;
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: 999px;
  padding: 6px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.stream-mini:active { transform: scale(.96); }
.todo-due { margin-left: auto; font-size: 11px; color: var(--ink-faint); }

/* ---------- 快速记录 Sheet ---------- */
.quick-sheet { position: absolute; inset: 0; z-index: 90; }
.qs-backdrop { position: absolute; inset: 0; background: rgba(24, 24, 27, .4); backdrop-filter: blur(3px); }
.qs-sheet {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: var(--card);
  border-radius: 22px 22px 0 0;
  border-top: 1px solid var(--line);
  padding: 20px 20px calc(24px + env(safe-area-inset-bottom));
  max-height: 80%;
  overflow-y: auto;
  box-shadow: 0 -16px 48px rgba(24, 24, 27, .16);
}
.quick-sheet:not([hidden]) .qs-sheet { animation: qsIn .32s cubic-bezier(.32, .72, 0, 1) both; }
@keyframes qsIn {
  from { transform: translateY(105%); }
  to { transform: translateY(0); }
}
.qs-x {
  position: absolute; top: 16px; right: 16px;
  width: 30px; height: 30px;
  border: 0; border-radius: 999px;
  background: var(--bg-soft); color: var(--ink-soft);
  font-size: 13px; cursor: pointer;
  z-index: 2;
}
.qs-title { font-size: 18px; font-weight: 800; letter-spacing: -.01em; padding-right: 34px; }
.qs-draft {
  margin-top: 10px;
  border-radius: 12px;
  background: var(--star-soft);
  color: var(--ink);
  padding: 10px 13px;
  font-size: 13px;
  line-height: 1.6;
}
.qs-sub { margin-top: 8px; font-size: 13px; color: var(--ink-soft); line-height: 1.7; }
.qs-grid { margin-top: 18px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.qs-opt {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  padding: 15px 8px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  font: inherit; font-size: 12.5px; font-weight: 600; color: var(--ink);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), border-color .2s ease, background .2s ease;
}
.qs-opt span { font-size: 21px; }
.qs-opt:active { transform: scale(.95); }
.qs-opt:hover { border-color: rgba(109, 93, 246, .4); background: var(--accent-soft); }
.qs-emoji-scroll {
  margin-top: 14px;
  max-height: 46vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 2px 2px 8px;
}
.qe-group { margin-bottom: 12px; }
.qe-name { font-size: 11.5px; font-weight: 700; color: var(--ink-faint); letter-spacing: .05em; margin-bottom: 7px; }
.qe-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; }
.qe {
  border: 0;
  background: var(--bg-soft);
  border-radius: 10px;
  font-size: 21px;
  line-height: 1;
  padding: 7px 0;
  cursor: pointer;
  transition: transform 120ms var(--ease-out), background .15s ease;
}
.qe:active { transform: scale(.85); }
.qe.is-active { background: var(--accent-soft); box-shadow: inset 0 0 0 1.5px var(--accent); }
.qs-input, .qs-textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg-soft);
  padding: 12px 14px;
  font: inherit; font-size: 14px; color: var(--ink);
  outline: 0; resize: vertical;
  margin-top: 12px;
}
.qs-textarea { min-height: 110px; line-height: 1.65; }
.qs-input:focus, .qs-textarea:focus { border-color: var(--accent); background: var(--card); box-shadow: 0 0 0 3px rgba(109, 93, 246, .12); }
.qs-primary, .qs-secondary {
  width: 100%;
  margin-top: 12px;
  border: 0; border-radius: 999px;
  padding: 13px;
  font: inherit; font-size: 14px; font-weight: 700;
  cursor: pointer;
}
.qs-primary { background: var(--accent); color: #fff; }
.qs-secondary { background: var(--accent-soft); color: var(--accent); }
.qs-primary:active, .qs-secondary:active { transform: scale(.98); }
.qs-due { margin-top: 12px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.qs-due input[type="date"] {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--bg-soft);
  padding: 7px 12px;
  font: inherit; font-size: 12.5px; color: var(--ink);
}
.qs-todos { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 8px; }
.qs-todo-row { display: flex; align-items: center; gap: 9px; padding: 8px 0; font-size: 13.5px; color: var(--ink); }
.qs-todo-row.is-done span { text-decoration: line-through; color: var(--ink-faint); }
.qs-todo-check {
  border: 1px solid var(--line-strong);
  background: var(--card);
  width: 21px; height: 21px;
  border-radius: 999px;
  font-size: 11px; color: var(--ok);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.qs-subtabs { margin-top: 14px; display: flex; gap: 7px; overflow-x: auto; padding-bottom: 4px; }
.qs-subtab {
  flex: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  padding: 7px 13px;
  font: inherit; font-size: 12.5px; color: var(--ink-soft);
  cursor: pointer;
}
.qs-subtab.is-active { background: var(--accent-soft); border-color: rgba(109, 93, 246, .4); color: var(--accent); font-weight: 600; }
.qs-fields { margin-top: 4px; }
.qs-status { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.qs-rate { margin-top: 12px; display: flex; gap: 4px; }
.rate-star {
  border: 0; background: transparent;
  font-size: 21px; color: var(--line-strong);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), color .2s ease;
}
.rate-star.is-active { color: var(--star); }
.rate-star:active { transform: scale(.85); }

/* ---------- Library：类型 ---------- */
.lib-types { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 4px; }
.lib-types::-webkit-scrollbar { display: none; }

.coll-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  padding: 14px 16px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: transform 150ms var(--ease-out), box-shadow .2s ease;
  animation: viewIn .3s var(--ease-out) both;
}
.coll-card:active { transform: scale(.985); }
.coll-card:hover { box-shadow: var(--shadow); }
.coll-head { display: flex; align-items: center; gap: 7px; }
.coll-ico { font-size: 15px; }
.coll-type { font-size: 11.5px; font-weight: 700; color: var(--ink-soft); letter-spacing: .02em; }
.coll-date { margin-left: auto; font-size: 11px; color: var(--ink-faint); }
.coll-title { margin-top: 8px; font-size: 15.5px; font-weight: 700; letter-spacing: -.01em; line-height: 1.5; }
.coll-meta { margin-top: 4px; font-size: 12px; color: var(--ink-faint); }
.coll-note { margin-top: 7px; font-size: 13px; color: var(--ink-soft); line-height: 1.65; }
.coll-text { margin-top: 8px; font-size: 13.5px; color: var(--ink); line-height: 1.7; white-space: pre-wrap; }
.coll-expand {
  margin-top: 9px;
  border: 0;
  background: none;
  padding: 2px 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  transition: opacity .15s ease;
}
.coll-expand:hover { opacity: .75; }
.coll-more { animation: viewIn .24s var(--ease-out) both; }

/* Library 折叠卡片：默认只显示标题，展开后显示完整内容 */
.kc-compact .kc-fold { display: none; }
.kc-compact.is-open .kc-fold { display: block; }
.kc-compact .kc-expand { color: var(--accent); font-weight: 600; }

/* ---------- Digest：额外总结 ---------- */
.dg-card {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  padding: 16px;
}
.dg-card h2 { font-size: 14px; font-weight: 800; letter-spacing: -.01em; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.dg-card h2 .sw { color: var(--accent); }
.wk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.wk-cell {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg-soft);
  padding: 10px 6px;
  text-align: center;
}
.wk-cell b { display: block; font-size: 17px; font-weight: 800; }
.wk-cell span { display: block; margin-top: 3px; font-size: 11px; color: var(--ink-soft); }
.dg-ai {
  margin-top: 12px;
  border-radius: 12px;
  background: var(--accent-soft);
  color: var(--ink-soft);
  padding: 11px 13px;
  font-size: 12.5px;
  line-height: 1.7;
}
.dg-moodline { margin-top: 10px; font-size: 13px; color: var(--ink-soft); letter-spacing: 2px; }
.lj-bars { display: flex; flex-direction: column; gap: 9px; }
.lj-row { display: flex; align-items: center; gap: 10px; }
.lj-name { flex: none; width: 58px; font-size: 12px; color: var(--ink-soft); }
.lj-bar { flex: 1; height: 8px; border-radius: 99px; background: var(--bg-soft); overflow: hidden; }
.lj-bar i { display: block; height: 100%; border-radius: 99px; background: var(--accent); transition: width .5s var(--ease-out); }
.lj-num { flex: none; width: 20px; text-align: right; font-size: 12px; font-weight: 700; color: var(--ink-soft); }
.dg-mood { font-size: 17px; font-weight: 700; }
.dg-note { margin-top: 8px; font-size: 13.5px; color: var(--ink-soft); line-height: 1.7; white-space: pre-wrap; }
.dg-todo { display: flex; align-items: center; gap: 9px; padding: 7px 0; font-size: 13.5px; }
.dg-todo.is-done span { text-decoration: line-through; color: var(--ink-faint); }
.dg-life { padding: 6px 0; font-size: 13.5px; color: var(--ink); }

/* ---------- Digest：这一天（简化视图） ---------- */
.day-head { padding: 4px 2px 14px; }
.day-title { font-size: 19px; font-weight: 800; letter-spacing: -.01em; }
.day-date { margin-top: 4px; font-size: 12.5px; color: var(--ink-soft); }
.day-card { margin-top: 12px; padding: 14px 16px; }
.day-card h2 { margin-bottom: 6px; font-size: 13px; }
.day-row {
  display: flex; align-items: center; gap: 10px;
  width: 100%;
  border: 0; background: none;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font: inherit; font-size: 13.5px; color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.day-row:last-child { border-bottom: 0; }
.day-row.is-done .day-text { text-decoration: line-through; color: var(--ink-faint); }
.day-ico { flex: none; font-size: 14px; }
.day-text { flex: 1; min-width: 0; line-height: 1.5; }
.day-status { flex: none; font-size: 12px; color: var(--ink-faint); }
.day-status.st-learning { color: var(--star); }
.day-status.st-done { color: var(--ok); }

/* ---------- Digest：本月注意力大标签 ---------- */
.lj-tags { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 2px; }
.lj-tag {
  display: inline-flex; align-items: baseline; gap: 8px;
  border: 1px solid rgba(109, 93, 246, .22);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  padding: 10px 18px;
  font-weight: 800;
  letter-spacing: .01em;
}
.lj-tag em { font-style: normal; font-size: 12px; opacity: .7; font-weight: 700; }
.lj-empty { font-size: 13px; color: var(--ink-faint); }

/* ---------- Me：最近的我 / 状态 / 兴趣 ---------- */
.me-recent-text { font-size: 13.5px; line-height: 1.8; color: var(--ink); }
.me-recent-toggle {
  margin-top: 10px;
  border: 0; background: none;
  font: inherit; font-size: 12.5px; font-weight: 600;
  color: var(--accent); cursor: pointer; padding: 0;
}
.me-recent-data { margin-top: 10px; border-top: 1px solid var(--line); padding-top: 10px; }
.me-rp { font-size: 12.5px; color: var(--ink-soft); line-height: 2; }
.me-30d-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.m30 { border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); padding: 11px 4px; text-align: center; }
.m30 b { display: block; font-size: 17px; font-weight: 800; }
.m30 span { display: block; margin-top: 3px; font-size: 10.5px; color: var(--ink-soft); line-height: 1.35; }
.interest-span { display: flex; gap: 8px; margin-bottom: 12px; }
.interest-map { display: flex; flex-wrap: wrap; gap: 10px; }
.interest-bubble {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--accent-soft);
  padding: 9px 14px;
  display: inline-flex; align-items: baseline; gap: 6px;
  color: var(--accent);
  min-width: 64px;
  justify-content: center;
}
.ib-label { font-weight: 700; }
.ib-num { color: var(--accent); opacity: .7; font-size: 11px; }
.me-life-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.me-life-row:last-child { border-bottom: 0; }
.me-life-row b { font-size: 15px; }
.me-life-fav { margin-top: 10px; font-size: 12.5px; color: var(--ink-soft); }

/* ---------- 通用小件 ---------- */
.switch-row { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--ink-soft); margin-top: 4px; }
.switch-row input { width: 18px; height: 18px; accent-color: var(--accent); }
.field select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px 13px;
  font: inherit; font-size: 14px; color: var(--ink);
  background: var(--bg-soft);
  outline: 0;
}
.btn.danger { color: var(--danger); border-color: rgba(220, 38, 38, .35); }
.empty-btn.ghost { border: 1px solid var(--line-strong); background: var(--card); color: var(--ink-soft); margin-left: 8px; }

/* ---------- 捕捉 + 记一下：左右一体 ---------- */
.split-capture {
  display: flex;
  align-items: stretch;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 13px 12px;
  box-shadow: var(--shadow);
}
.split-capture.shake { animation: shake .4s ease; }
.sc-col { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sc-divider { flex: none; width: 1px; background: var(--line); margin: 4px 12px; }
.sc-head { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 800; letter-spacing: .01em; }
.sc-ico { font-size: 13px; }
.sc-input-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 0 9px;
  margin-top: 9px;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.sc-input-wrap:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(109, 93, 246, .12);
  background: var(--card);
}
.sc-input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 12.5px;
  padding: 10px 0;
  color: var(--ink);
}
.sc-input::placeholder { color: var(--ink-faint); }
.sc-btn {
  margin-top: 8px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 9px 6px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 4px 12px rgba(24, 24, 27, .18);
  cursor: pointer;
  transition: transform 150ms var(--ease-out), box-shadow .2s ease, opacity .2s ease, background .2s ease;
}
.sc-btn .star { color: var(--star); font-size: 10px; }
.sc-btn:active { transform: scale(.97); box-shadow: 0 2px 6px rgba(24, 24, 27, .14); }
.sc-btn.is-busy { opacity: .7; pointer-events: none; }
.today-empty { margin-top: 22px; }
