/* ============ 小火苗 · 莫兰迪工作台 ============ */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { font-size:15px; }
body {
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--text);
  transition:background .35s,color .35s;
  min-height:100vh; overscroll-behavior-y:contain;
}

/* ============ 9套莫兰迪主题（色值严格按参考图，多色搭配） ============ */
/* 每套主题包含4个取色：c1主色/c2辅色/c3强调/c4深色，UI中交替使用 */
:root, [data-theme="mint"]{ /* 薄荷曼波 #CFE4DD #F5E1EA #F4A8B5 #8D6C63 */
  --c1:#CFE4DD; --c2:#F5E1EA; --c3:#F4A8B5; --c4:#8D6C63;
  --bg:#E9F3EF; --bg2:#DDECE6; --card:#F8FCFA; --card2:#EEF6F2;
  --primary:var(--c1); --primary-d:var(--c4); --accent:var(--c3); --highlight:var(--c2);
  --text:#4A5A55; --text2:#8A9E97; --line:#D3E4DD;
  --tag:color-mix(in srgb,var(--c1) 20%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 22%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 22%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 22%,var(--card));
  --danger:#D98A80; --ok:#7FAE97; --shadow:rgba(141,108,99,.14);
}
[data-theme="walden"]{ /* 瓦尔登湖 #C0E8ED #9FC7D0 #63BAD9 #B9DAE9 */
  --c1:#C0E8ED; --c2:#9FC7D0; --c3:#63BAD9; --c4:#B9DAE9;
  --bg:#E2F3F5; --bg2:#D3ECF0; --card:#F7FCFD; --card2:#EAF5F7;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#3A5359; --text2:#7B9AA1; --line:#C9E1E6;
  --tag:color-mix(in srgb,var(--c1) 22%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 24%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 22%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 24%,var(--card));
  --danger:#C99088; --ok:#7FB0A8; --shadow:rgba(99,186,217,.16);
}
[data-theme="retro"]{ /* 美式复古 #8CC7D8 #E7A09F #3B3A89 #F0D69F */
  --c1:#8CC7D8; --c2:#E7A09F; --c3:#3B3A89; --c4:#F0D69F;
  --bg:#E3F2F6; --bg2:#D5EBF1; --card:#F8FCFD; --card2:#EDF6F8;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#3A4E5C; --text2:#7A8FA0; --line:#C8DFE7;
  --tag:color-mix(in srgb,var(--c1) 20%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 22%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 18%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 22%,var(--card));
  --danger:#D18A80; --ok:#8E9B6C; --shadow:rgba(59,58,137,.16);
}
[data-theme="emperor"]{ /* 先帝最爱 #F5C7C9 #9FB7D4 #F58198 #A6C8E8 */
  --c1:#F5C7C9; --c2:#9FB7D4; --c3:#F58198; --c4:#A6C8E8;
  --bg:#FCEEF0; --bg2:#F9E2E4; --card:#FDF9FA; --card2:#F7EEF0;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#5A464A; --text2:#9B858A; --line:#EBD5D8;
  --tag:color-mix(in srgb,var(--c1) 22%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 22%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 20%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 20%,var(--card));
  --danger:#C77A72; --ok:#87A88E; --shadow:rgba(245,129,152,.15);
}
[data-theme="grape-guava"]{ /* 青提芭乐 #FED0D9 #C5E7A9 #F97BAA #B0DB93 */
  --c1:#FED0D9; --c2:#C5E7A9; --c3:#F97BAA; --c4:#B0DB93;
  --bg:#FFF0F3; --bg2:#FDE3E8; --card:#FFFAFB; --card2:#FDF2F5;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#5A4A4E; --text2:#9B888D; --line:#F1D4DA;
  --tag:color-mix(in srgb,var(--c1) 22%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 24%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 20%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 22%,var(--card));
  --danger:#C97A70; --ok:#8FBC7A; --shadow:rgba(249,123,170,.15);
}
[data-theme="coconut"]{ /* 椰风海岛 #95B4E9 #CAD6E3 #235DAB #D3AB95 */
  --c1:#95B4E9; --c2:#CAD6E3; --c3:#235DAB; --c4:#D3AB95;
  --bg:#E7EEF9; --bg2:#D7E3F5; --card:#F8FAFD; --card2:#EDF2FA;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#3A4660; --text2:#7A85A0; --line:#CDD8EB;
  --tag:color-mix(in srgb,var(--c1) 20%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 24%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 18%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 20%,var(--card));
  --danger:#C98A7A; --ok:#7FA99E; --shadow:rgba(35,93,171,.16);
}
[data-theme="gold-light"]{ /* 浮光跃金 #CDD4C0 #F1D9B6 #A89884 #868F6A */
  --c1:#CDD4C0; --c2:#F1D9B6; --c3:#A89884; --c4:#868F6A;
  --bg:#E9EBE4; --bg2:#DDE2D5; --card:#FAFAF7; --card2:#F0F2EC;
  --primary:var(--c1); --primary-d:var(--c4); --accent:var(--c3); --highlight:var(--c2);
  --text:#4A4F42; --text2:#8A8F7E; --line:#D8DCD3;
  --tag:color-mix(in srgb,var(--c1) 22%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 22%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 20%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 22%,var(--card));
  --danger:#C08A7E; --ok:#8E9B6C; --shadow:rgba(134,143,106,.15);
}
[data-theme="orange-soda"]{ /* 橘子汽水 #F7A85B #FAE593 #6B8E4F #C5863C */
  --c1:#F7A85B; --c2:#FAE593; --c3:#6B8E4F; --c4:#C5863C;
  --bg:#FEF3E8; --bg2:#FDE9D6; --card:#FFF9F3; --card2:#FDF0E5;
  --primary:var(--c1); --primary-d:var(--c4); --accent:var(--c3); --highlight:var(--c2);
  --text:#5A432E; --text2:#9B836D; --line:#F5D9C2;
  --tag:color-mix(in srgb,var(--c1) 22%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 28%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 22%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 20%,var(--card));
  --danger:#C96E64; --ok:#6B8E4F; --shadow:rgba(197,134,60,.18);
}
[data-theme="salt-grape"]{ /* 海盐葡萄 #B6A9C8 #EFE4D4 #302858 #907BAC */
  --c1:#B6A9C8; --c2:#EFE4D4; --c3:#302858; --c4:#907BAC;
  --bg:#EDEAF2; --bg2:#E2DEEB; --card:#FAF9FC; --card2:#F1EFF6;
  --primary:var(--c1); --primary-d:var(--c3); --accent:var(--c4); --highlight:var(--c2);
  --text:#443C5E; --text2:#867E9E; --line:#DAD5E6;
  --tag:color-mix(in srgb,var(--c1) 20%,var(--card)); --tag2:color-mix(in srgb,var(--c2) 24%,var(--card));
  --tag3:color-mix(in srgb,var(--c3) 16%,var(--card)); --tag4:color-mix(in srgb,var(--c4) 20%,var(--card));
  --danger:#BE8494; --ok:#87A996; --shadow:rgba(48,40,88,.16);
}

/* ============ 布局 ============ */
#app { position:relative; min-height:100vh; }

/* 可隐藏侧边栏 */
#sidebar {
  position:fixed; left:0; top:0; bottom:0; width:64px; z-index:50;
  background:var(--card); border-right:1px solid var(--line);
  display:flex; flex-direction:column; align-items:center;
  padding:calc(8px + env(safe-area-inset-top)) 0 calc(10px + env(safe-area-inset-bottom));
  transform:translateX(-100%);
  transition:transform .3s ease, background .35s;
}
body.nav-open #sidebar { transform:none; }
#sidebar .sb-head {
  width:100%; text-align:center; font-size:9px; color:var(--text2);
  font-weight:700; letter-spacing:2px; padding:6px 0 10px;
}
.nav-item {
  width:52px; padding:7px 0 5px; margin:3px 0; border-radius:14px;
  display:flex; flex-direction:column; align-items:center; gap:2px;
  cursor:pointer; color:var(--text2); border:none; background:transparent;
  transition:all .25s; font-family:inherit;
}
.nav-item .ni {
  font-size:18px; line-height:1; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--tag); margin-bottom:3px; box-shadow:0 2px 6px var(--shadow); transition:all .25s;
}
.nav-item .nt { font-size:10px; letter-spacing:.5px; }
.nav-item.active .ni { background:var(--primary-d); box-shadow:0 0 0 2.5px var(--card), 0 2px 8px var(--shadow); }
.nav-item.active { color:var(--primary-d); font-weight:700; }

/* 侧边栏遮罩（仅移动端） */
#scrim {
  position:fixed; inset:0; z-index:45; background:rgba(40,40,40,.22);
  display:none; opacity:0; transition:opacity .25s;
}
body.nav-open #scrim { display:block; opacity:1; }

/* 主区域 */
#main { padding:0 12px calc(30px + env(safe-area-inset-bottom)); max-width:860px; margin:0 auto; }

/* 顶栏 */
#topbar {
  position:sticky; top:0; z-index:40; margin:0 -12px; padding:calc(10px + env(safe-area-inset-top)) 12px 10px;
  background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line);
}
#brand-btn {
  display:flex; align-items:center; gap:5px; flex-shrink:0;
  border:none; background:transparent; cursor:pointer; font-family:inherit;
  color:var(--primary-d); padding:4px 5px; border-radius:12px;
}
#brand-btn .b-ic { font-size:21px; line-height:1; }
#brand-btn .b-txt { font-size:16px; font-weight:800; letter-spacing:1px; }
#brand-btn:active { background:var(--tag); }
#topbar h1 { flex:1; min-width:0; font-size:16px; font-weight:800; letter-spacing:.5px; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tb-tools { display:flex; align-items:center; gap:8px; flex-shrink:0; }
#theme-btn {
  border:1px solid var(--line); background:var(--card); color:var(--text);
  border-radius:20px; padding:6px 11px; font-size:12.5px; cursor:pointer;
  display:flex; align-items:center; gap:6px; box-shadow:0 2px 8px var(--shadow); font-family:inherit;
}
#theme-btn .dot { width:14px; height:14px; border-radius:50%; background:linear-gradient(135deg,var(--c1),var(--c3)); border:2px solid var(--card); box-shadow:0 0 0 1.5px var(--primary-d); }
#backup-btn {
  border:1px solid var(--line); background:var(--card); color:var(--text);
  border-radius:50%; width:34px; height:34px; font-size:16px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; box-shadow:0 2px 8px var(--shadow); font-family:inherit; flex-shrink:0;
}

/* 数据备份弹层 */
.bk-tip { font-size:13px; color:var(--text2); line-height:1.6; margin:4px 0 14px; }
.bk-btn {
  display:block; width:100%; margin:8px 0; padding:13px; border-radius:14px;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; box-shadow:0 2px 8px var(--shadow);
}
.bk-btn:active { transform:scale(.98); }
.bk-btn.sm { width:auto; display:inline-block; padding:9px 16px; font-size:13px; margin-top:8px; }
.bk-more { margin-top:6px; font-size:13px; color:var(--text2); }
.bk-more summary { cursor:pointer; padding:6px 0; }
.bk-more textarea { width:100%; height:160px; border:1px solid var(--line); border-radius:12px; padding:10px; font-size:12px; font-family:monospace; background:var(--bg); color:var(--text); box-sizing:border-box; resize:vertical; }

/* 主题面板 */
#theme-panel {
  position:fixed; inset:0; z-index:99; background:rgba(40,40,40,.28); display:none;
}
#theme-panel.show { display:block; }
#theme-sheet {
  position:absolute; left:0; right:0; bottom:0; background:var(--card);
  border-radius:22px 22px 0 0; padding:18px 18px calc(26px + env(safe-area-inset-bottom));
  animation:up .25s ease;
}
@keyframes up { from{transform:translateY(40%);opacity:.4} to{transform:none;opacity:1} }
#theme-sheet h3 { font-size:15px; margin-bottom:14px; }
.theme-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.theme-opt {
  border:2px solid var(--line); border-radius:14px; padding:10px 6px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:6px; background:var(--card2); font-family:inherit;
}
.theme-opt.cur { border-color:var(--primary-d); box-shadow:0 3px 10px var(--shadow); }
.theme-opt .sw { display:flex; gap:3px; }
.theme-opt .sw i { width:14px; height:14px; border-radius:50%; display:block; }
.theme-opt span { font-size:11.5px; color:var(--text); font-weight:600; }

/* ============ 通用组件 ============ */
.page { display:none; padding-top:14px; animation:fade .3s ease; }
.page.active { display:block; }
@keyframes fade { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

.card {
  background:var(--card); border-radius:18px; padding:14px;
  box-shadow:0 3px 14px var(--shadow); margin-bottom:12px; border:1px solid var(--line);
}
.card.h-accent { border-left:5px solid var(--accent); }
.card.h-highlight { border-left:5px solid var(--highlight); }
.card.h-c3 { border-left:5px solid var(--c3); }
.card h3 { font-size:14.5px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.card h3 .sub { font-size:11px; color:var(--text2); font-weight:400; }

.btn {
  border:none; border-radius:12px; padding:9px 16px; font-size:13.5px; cursor:pointer;
  background:var(--primary); color:#fff; font-weight:600; font-family:inherit;
  box-shadow:0 3px 10px var(--shadow); transition:transform .15s;
}
.btn:active { transform:scale(.96); }
.btn.ghost { background:var(--tag); color:var(--primary-d); box-shadow:none; }
.btn.accent { background:var(--accent); }
.btn.highlight { background:var(--highlight); color:color-mix(in srgb,var(--highlight) 40%,#222); }
.btn.c3 { background:var(--c3); color:#fff; }
.btn.sm { padding:6px 11px; font-size:12px; border-radius:10px; }
.btn.danger { background:var(--danger); }
.btn.block { width:100%; display:block; }

input, select, textarea {
  width:100%; border:1.5px solid var(--line); border-radius:12px; padding:10px 12px;
  font-size:14px; background:var(--card2); color:var(--text); font-family:inherit; outline:none;
  transition:border .2s;
}
input:focus, select:focus, textarea:focus { border-color:var(--primary); }
textarea { resize:vertical; min-height:70px; }
label.fl { display:block; font-size:12px; color:var(--text2); margin:9px 0 4px; font-weight:600; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.row3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }

.tabs { display:flex; gap:7px; margin-bottom:12px; overflow-x:auto; padding-bottom:2px; scrollbar-width:none; }
.tabs::-webkit-scrollbar{display:none}
.tab {
  flex-shrink:0; border:none; background:var(--card); color:var(--text2); padding:8px 15px;
  border-radius:20px; font-size:13px; cursor:pointer; border:1px solid var(--line); font-family:inherit; font-weight:600;
}
.tab.active { background:var(--primary); color:#fff; border-color:var(--primary); box-shadow:0 3px 8px var(--shadow); }

.chip {
  display:inline-flex; align-items:center; background:var(--tag); color:var(--primary-d);
  border-radius:8px; padding:2.5px 8px; font-size:10.5px; font-weight:700; margin-right:5px; margin-bottom:3px;
}
.chip.warm { background:color-mix(in srgb,var(--danger) 16%,var(--card)); color:var(--danger); }
.chip.gold { background:var(--tag2); color:color-mix(in srgb,var(--c2) 55%,#222); }
.chip.c3 { background:var(--tag3); color:color-mix(in srgb,var(--c3) 55%,#222); }
.chip.dark { background:var(--tag4); color:var(--card); }

.empty { text-align:center; color:var(--text2); font-size:13px; padding:26px 0; }
.empty .e { font-size:30px; display:block; margin-bottom:8px; opacity:.7; }

.stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }
.stat {
  background:var(--card); border:1px solid var(--line); border-radius:16px; padding:12px 8px; text-align:center;
  box-shadow:0 3px 10px var(--shadow);
}
.stat .v { font-size:19px; font-weight:800; color:var(--primary-d); }
.stat .k { font-size:11px; color:var(--text2); margin-top:3px; }

.del-x { border:none; background:transparent; color:var(--text2); font-size:16px; cursor:pointer; padding:4px 6px; line-height:1; }
.del-x:active { color:var(--danger); }

/* ============ 每日计划 ============ */
.todo-item {
  display:flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:11px 12px; margin-bottom:8px; box-shadow:0 2px 8px var(--shadow);
}
.todo-item .ck {
  width:22px; height:22px; border-radius:7px; border:2px solid var(--primary); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; cursor:pointer; color:#fff; font-size:13px; background:transparent; transition:all .2s;
}
.todo-item.done .ck { background:var(--primary); }
.todo-item .tx { flex:1; font-size:14px; word-break:break-all; }
.todo-item.done .tx { text-decoration:line-through; color:var(--text2); }
.add-inline { display:flex; gap:8px; margin-bottom:14px; }
.add-inline input { flex:1; }
.add-inline .btn { flex-shrink:0; }
.sec-t { font-size:12.5px; color:var(--text2); font-weight:700; margin:14px 2px 8px; }

/* ============ 运动 ============ */
.search-portal { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-bottom:10px; }
.portal-btn {
  border:none; border-radius:14px; padding:11px 4px; color:#fff; font-size:12.5px; font-weight:700;
  cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:4px; font-family:inherit;
  box-shadow:0 3px 10px var(--shadow);
}
.portal-btn .pi { font-size:18px; }
.portal-bili { background:#8CA8C9; }
.portal-douyin { background:#8B8B99; }
.portal-xhs { background:#CE9191; }
.video-card {
  background:var(--card); border:1px solid var(--line); border-radius:15px; padding:12px; margin-bottom:9px;
  box-shadow:0 2px 8px var(--shadow);
}
.video-card .vt { font-size:13.5px; font-weight:700; margin-bottom:6px; line-height:1.45; }
.video-card .vm { font-size:11px; color:var(--text2); margin-bottom:8px; }
.video-card .va { display:flex; gap:7px; align-items:center; }
.link-btn {
  flex:1; text-align:center; text-decoration:none; background:var(--tag); color:var(--primary-d);
  border-radius:10px; padding:7px 0; font-size:12px; font-weight:700;
}
.fav-btn { border:1px solid var(--line); background:var(--card2); border-radius:10px; padding:6px 10px; font-size:13px; cursor:pointer; font-family:inherit; }
.fav-btn.on { background:color-mix(in srgb,var(--accent) 18%,var(--card)); border-color:var(--accent); }

/* ============ 学习 - 题目 ============ */
.q-card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; margin-bottom:11px; box-shadow:0 3px 10px var(--shadow); }
.q-card .qt { font-size:14px; font-weight:700; line-height:1.6; margin:7px 0 9px; }
.q-opt { padding:9px 12px; border:1.5px solid var(--line); border-radius:11px; margin-bottom:7px; font-size:13.5px; cursor:pointer; background:var(--card2); transition:all .2s; }
.q-opt.pick-right { border-color:var(--ok); background:color-mix(in srgb,var(--ok) 14%,var(--card)); font-weight:700; }
.q-opt.pick-wrong { border-color:var(--danger); background:color-mix(in srgb,var(--danger) 12%,var(--card)); }
.answer-box { background:var(--card2); border-left:3.5px solid var(--primary); border-radius:0 12px 12px 0; padding:10px 12px; font-size:13px; line-height:1.7; margin-top:9px; color:var(--text); }
.answer-box b { color:var(--primary-d); }

/* 学习 - 摘抄与咨询卡片 */
.excerpt-card {
  background:var(--card); border:1px solid var(--line); border-radius:16px; padding:13px; margin-bottom:10px;
  box-shadow:0 2px 8px var(--shadow);
}
.excerpt-card .ex-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; margin-bottom:7px; }
.excerpt-card .ex-title { font-size:13.5px; font-weight:800; line-height:1.45; flex:1; }
.excerpt-card .ex-source { font-size:11px; color:var(--text2); margin-top:4px; }
.excerpt-card .ex-body {
  background:var(--card2); border-radius:12px; padding:10px 12px; font-size:13px; line-height:1.75; color:var(--text);
  border-left:3px solid var(--accent); margin:8px 0;
}
.excerpt-card .ex-keys { margin:8px 0 4px; }
.excerpt-card .ex-key {
  display:inline-block; background:var(--tag3); color:color-mix(in srgb,var(--c3) 55%,#222);
  border-radius:8px; padding:3px 8px; font-size:11px; font-weight:700; margin:0 5px 5px 0;
}
.excerpt-card .ex-actions { display:flex; gap:7px; margin-top:9px; flex-wrap:wrap; }

/* 教案全文 */
.plan-body { font-size:13.5px; line-height:1.85; white-space:pre-wrap; color:var(--text); }
.plan-body::first-line { font-weight:700; }
details.doc { background:var(--card); border:1px solid var(--line); border-radius:15px; padding:12px 14px; margin-bottom:10px; box-shadow:0 2px 8px var(--shadow); }
details.doc summary { font-size:13.5px; font-weight:700; cursor:pointer; line-height:1.5; list-style:none; position:relative; padding-right:18px; }
details.doc summary::after { content:"▾"; position:absolute; right:0; top:2px; color:var(--text2); transition:transform .2s; }
details.doc[open] summary::after { transform:rotate(180deg); }
details.doc .meta { font-size:11px; color:var(--text2); margin-top:5px; }

/* ============ 纪念日 ============ */
.anniv-card {
  border-radius:18px; padding:16px; margin-bottom:11px; color:#fff; position:relative; overflow:hidden;
  background:linear-gradient(135deg,var(--primary),var(--primary-d)); box-shadow:0 5px 16px var(--shadow);
}
.anniv-card.alt { background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 70%,var(--primary)),var(--accent)); }
.anniv-card .an { font-size:14.5px; font-weight:800; display:flex; justify-content:space-between; }
.anniv-card .ad { font-size:11.5px; opacity:.85; margin-top:3px; }
.anniv-nums { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.anniv-nums .bloc { background:rgba(255,255,255,.2); border-radius:11px; padding:7px 11px; text-align:center; backdrop-filter:blur(4px); }
.anniv-nums .bloc b { font-size:17px; display:block; }
.anniv-nums .bloc s { font-size:10px; text-decoration:none; opacity:.9; }
.anniv-card .del-x { position:absolute; top:8px; right:8px; color:rgba(255,255,255,.85); }

/* ============ 备忘录 ============ */
.memo-item { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 13px; margin-bottom:9px; box-shadow:0 2px 8px var(--shadow); cursor:pointer; }
.memo-item .mt { font-size:14px; font-weight:700; margin-bottom:4px; word-break:break-all; }
.memo-item .mp { font-size:12.5px; color:var(--text2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-all; }
.memo-item .md { font-size:10.5px; color:var(--text2); margin-top:6px; opacity:.8; }

/* ============ 旅行 ============ */
.trip-card {
  border-radius:18px; overflow:hidden; margin-bottom:13px; background:var(--card); border:1px solid var(--line);
  box-shadow:0 4px 14px var(--shadow); cursor:pointer;
}
.trip-card .th {
  background:linear-gradient(120deg,var(--primary),var(--primary-d)); color:#fff; padding:15px 15px 13px;
}
.trip-card .th .dst { font-size:17px; font-weight:800; }
.trip-card .th .dt { font-size:11.5px; opacity:.88; margin-top:3px; }
.trip-card .tb { padding:11px 14px; display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--text2); }
.trip-card .tb b { color:var(--accent); font-size:15px; }

/* 弹层 */
.modal { position:fixed; inset:0; z-index:90; background:rgba(40,40,40,.3); display:none; align-items:flex-end; }
.modal.show { display:flex; }
.modal .m-body {
  background:var(--bg); width:100%; max-height:92vh; overflow-y:auto; border-radius:22px 22px 0 0;
  padding:16px 15px calc(28px + env(safe-area-inset-bottom)); animation:up .25s ease;
}
.m-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:13px; }
.m-head h3 { font-size:16px; }
.m-close { border:none; background:var(--card); border-radius:50%; width:30px; height:30px; font-size:15px; cursor:pointer; color:var(--text2); }

/* 账目列表 */
.acc-item { display:flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:13px; padding:10px 12px; margin-bottom:7px; }
.acc-item .ai { flex:1; min-width:0; }
.acc-item .a1 { font-size:13.5px; font-weight:700; }
.acc-item .a2 { font-size:11px; color:var(--text2); margin-top:2px; word-break:break-all; }
.acc-item .amt { font-size:14.5px; font-weight:800; flex-shrink:0; }
.amt.in { color:var(--danger); }   /* 收入红 */
.amt.out { color:var(--ok); }      /* 支出绿 */
.bar-row { display:flex; align-items:center; gap:8px; font-size:11.5px; margin-bottom:7px; }
.bar-row .bl { width:52px; color:var(--text2); flex-shrink:0; }
.bar-row .bt { flex:1; height:9px; background:var(--bg2); border-radius:5px; overflow:hidden; }
.bar-row .bt i { display:block; height:100%; background:linear-gradient(90deg,var(--primary),var(--primary-d)); border-radius:5px; }
.bar-row .bv { width:74px; text-align:right; color:var(--text2); flex-shrink:0; }

/* 逐日行程轴（参考圆周旅迹） */
.timeline { position:relative; padding:2px 0; }
.tl-day { position:relative; margin-bottom:14px; padding:6px 0 6px 18px; border-left:2px solid var(--primary); border-radius:3px; }
.tl-day::before { content:""; position:absolute; left:-7px; top:9px; width:12px; height:12px; border-radius:50%; background:var(--primary); border:2px solid var(--card); box-sizing:border-box; }
.tl-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap; }
.tl-label { font-weight:800; font-size:13.5px; color:var(--accent); border:none; background:transparent; width:96px; padding:2px 0; }
.tl-label:focus { outline:none; border-bottom:1px dashed var(--primary); }
.tl-place { display:flex; align-items:center; gap:6px; margin:6px 0; flex-wrap:wrap; }
.grip { cursor:grab; color:var(--text2); font-size:15px; line-height:1; padding:2px 3px; border-radius:6px; touch-action:none; user-select:none; }
.grip:active { cursor:grabbing; background:var(--tag); }
.tl-place.dragging { opacity:.4; }
.tl-day.drop-active { background:var(--tag); border-radius:10px; box-shadow:0 0 0 2px var(--primary) inset; }
.drag-ghost { position:fixed; z-index:9999; pointer-events:none; transform:translate(-50%,-50%);
  background:var(--primary); color:#fff; padding:6px 11px; border-radius:12px; font-size:12.5px; font-weight:700;
  box-shadow:0 6px 18px var(--shadow); max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-time { width:60px; flex-shrink:0; }
.tl-name { flex:1 1 120px; min-width:100px; }
.tl-note { flex:1 1 100px; min-width:90px; }
.tl-empty { font-size:12px; color:var(--text2); padding:4px 0 4px 6px; }
/* 运动类型选择 + 卡路里预览 */
.row-wrap { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:9px; }
.chip-btn { font-size:12.5px; padding:8px 12px; border-radius:13px; border:1.5px solid var(--line);
  background:var(--card2); color:var(--text); cursor:pointer; transition:.18s; font-weight:600; }
.chip-btn.on { background:var(--primary); color:#fff; border-color:var(--primary); box-shadow:0 4px 12px var(--shadow); }
.cal-prev { margin-top:11px; padding:11px 13px; border-radius:13px; background:linear-gradient(100deg,var(--tag),var(--tag2));
  color:var(--text); font-size:13px; display:flex; align-items:center; gap:6px; }
.cal-prev b { font-size:19px; color:var(--primary-d); margin:0 2px; }
/* 安装引导条 */
.install-tip { position:fixed; left:10px; right:10px; bottom:14px; z-index:60; display:flex; align-items:center; gap:9px;
  background:var(--card); border:1px solid var(--line); border-radius:16px; padding:10px 12px; box-shadow:0 8px 26px var(--shadow); }
.it-ic { font-size:20px; }
.it-b { flex:1; min-width:0; }
.it-t { font-size:13px; font-weight:700; color:var(--text); }
.it-s { font-size:11px; color:var(--text2); margin-top:2px; line-height:1.45; }
.it-btn { flex:0 0 auto; border:none; background:var(--primary); color:#fff; font-weight:700; font-size:12.5px;
  padding:7px 13px; border-radius:11px; cursor:pointer; }
.it-x { flex:0 0 auto; border:none; background:transparent; color:var(--text2); font-size:15px; cursor:pointer; padding:2px 4px; }

/* 读书书架 / 进度条 / 他人笔记 */
.pbar { height:8px; border-radius:6px; background:var(--tag); overflow:hidden; margin:6px 0; }
.pbar i { display:block; height:100%; background:linear-gradient(90deg,var(--primary),var(--primary-d)); border-radius:6px; transition:width .3s; }
.pbar.big { height:12px; }
.book-card { background:var(--card2); border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin-bottom:10px; }
.bc-top { display:flex; justify-content:space-between; align-items:center; }
.bc-title { font-weight:700; font-size:14px; color:var(--text); }
.bc-meta { font-size:11.5px; color:var(--text2); margin:6px 0; }
.bc-actions { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }
.others-note { background:var(--card2); border:1px solid var(--line); border-radius:12px; padding:11px 12px; margin-bottom:9px; }
.on-quote { font-size:13px; font-weight:600; color:var(--text); line-height:1.6; margin:6px 0; }
.on-note { font-size:12px; color:var(--text2); line-height:1.7; margin-bottom:8px; }

.toast {
  position:fixed; bottom:80px; left:50%; transform:translateX(-50%); z-index:200;
  background:var(--text); color:var(--bg); border-radius:20px; padding:9px 18px; font-size:13px;
  opacity:0; pointer-events:none; transition:opacity .25s; max-width:80vw; text-align:center;
}
.toast.show { opacity:.94; }

/* 小屏精简顶栏 */
@media (max-width:420px){
  #theme-btn { padding:6px 9px; }
  #theme-name { display:none; }
  #brand-btn .b-txt { font-size:15px; }
  #topbar h1 { font-size:15px; }
}

@media (min-width:640px){
  #sidebar { width:76px; }
  .nav-item { width:62px; }
  .theme-grid { grid-template-columns:repeat(4,1fr); }
  /* 桌面端展开侧边栏时主内容让出位置 */
  body.nav-open #main { margin-left:76px; margin-right:auto; }
}
@media (min-width:900px){
  #main { max-width:920px; }
}