/* ============ 瑾记 · 马卡龙轻设计 ============ */
:root{
  --bg:#FAF5F0;            /* 奶油米白背景 */
  --card:#FFFFFF;
  --ink:#4B3F5A;           /* 主文字 */
  --ink2:#9B8FA8;          /* 次要文字 */
  --line:#F1E9E2;          /* 分隔线 */
  --pri:#A78BFA;           /* 主紫 */
  --pri-d:#8B6FE8;
  --pink:#F9B8D4; --pink-bg:#FDF0F6;
  --blue:#8CC2E8; --blue-bg:#EAF4FC;
  --mint:#8FD0A2; --mint-bg:#EDF8F0;
  --grape:#AC8FE0; --grape-bg:#F3EDFB;
  --cream:#EDC46E; --cream-bg:#FDF6E6;
  --peach:#F2AE7E; --peach-bg:#FDF0E6;
  --danger:#E08A9C;
  --r:18px;
  --shadow:0 6px 22px rgba(166,138,190,.14);
  --shadow-sm:0 3px 10px rgba(166,138,190,.12);
  --serif:"Georgia","Songti SC","STSong","SimSun","Noto Serif SC",serif;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Segoe UI",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{
  font-family:var(--sans);
  background:linear-gradient(180deg,#FDF6F2 0%,#F7F1FB 100%);
  color:var(--ink);
  font-size:15px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit}
input,textarea,select{font-family:inherit;font-size:15px;color:var(--ink)}
img{max-width:100%}

/* 手机壳式居中（桌面端） */
#app{max-width:440px;margin:0 auto;min-height:100vh;position:relative;background:var(--bg);box-shadow:0 0 40px rgba(166,138,190,.16)}
@media (min-width:560px){
  body{background:linear-gradient(135deg,#FBE7F0 0%,#EDE6FB 50%,#E4F0F8 100%)}
  #app{min-height:100vh}
}
#view-root{padding-bottom:96px;min-height:100vh}

/* ============ 顶部导航 ============ */
.hdr{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;gap:10px;
  padding:14px 18px 12px;
  background:rgba(250,245,240,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.hdr .back{width:36px;height:36px;border-radius:12px;background:var(--card);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;font-size:17px;flex:none}
.hdr-title{flex:1;font-size:19px;font-weight:700;letter-spacing:.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdr-sub{font-size:11px;color:var(--ink2);font-weight:400;display:block;margin-top:-2px}
.hdr .hbtn{width:36px;height:36px;border-radius:12px;background:var(--card);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;font-size:17px;flex:none}

/* ============ 卡片 / 通用 ============ */
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow-sm);padding:16px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:6px 13px;border-radius:999px;background:var(--card);box-shadow:var(--shadow-sm);font-size:12.5px;font-weight:600;color:var(--ink2)}
.chip.on{background:var(--pri);color:#fff}
.chip.pink{background:var(--pink-bg);color:#C0699B}
.chip.grape{background:var(--grape-bg);color:#7A5CB8}
.chip.mint{background:var(--mint-bg);color:#4E9A66}
.chip.blue{background:var(--blue-bg);color:#3E7CB1}
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:700}
.badge.doing{background:var(--peach-bg);color:#C07A44}
.badge.done{background:var(--mint-bg);color:#3E8E5A}
.badge.doing .dot{width:6px;height:6px;border-radius:50%;background:#E89A5B;animation:pulse 1.4s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ============ 底部导航 ============ */
#bottom-nav{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;z-index:40;
  width:100%;max-width:440px;
  display:flex;justify-content:space-around;align-items:center;
  background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  padding:8px 6px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -4px 20px rgba(166,138,190,.10);
}
.bn-item{display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 14px;border-radius:14px;color:var(--ink2);font-size:11px;transition:.2s}
.bn-item .bn-ico{font-size:21px;line-height:1;filter:grayscale(.25);transition:.2s}
.bn-item.active{color:var(--pri-d)}
.bn-item.active .bn-ico{filter:none;transform:translateY(-1px)}
.bn-item.active{background:var(--grape-bg)}

/* ============ 悬浮按钮 ============ */
.fab{
  position:fixed;left:50%;transform:translateX(-50%);bottom:86px;z-index:35;
  width:56px;height:56px;border-radius:20px;
  background:linear-gradient(135deg,#F9B8D4,#B9A7F5);
  color:#fff;font-size:28px;font-weight:300;
  box-shadow:0 10px 24px rgba(185,167,245,.5);
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s;
}
.fab:active{transform:translateX(-50%) scale(.92)}

/* ============ 按钮 ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:11px 18px;border-radius:14px;font-weight:700;font-size:14px;transition:.15s}
.btn:active{transform:scale(.97)}
.btn-primary{background:linear-gradient(135deg,#B9A7F5,#F9B8D4);color:#fff;box-shadow:0 6px 16px rgba(185,167,245,.4)}
.btn-ghost{background:var(--card);box-shadow:var(--shadow-sm);color:var(--ink)}
.btn-soft{background:var(--grape-bg);color:var(--pri-d)}
.btn-danger{background:var(--pink-bg);color:var(--danger)}
.btn-block{width:100%}
.btn.sm{padding:7px 13px;font-size:12.5px;border-radius:11px}

/* ============ 表单 ============ */
.field{margin-bottom:14px}
.field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink2);margin-bottom:6px;letter-spacing:.3px}
.field label .opt{color:#C9BFD4;font-weight:400}
.inp{
  width:100%;padding:12px 14px;border-radius:14px;border:1.5px solid var(--line);
  background:#FDFBF8;outline:none;transition:.15s;
}
.inp:focus{border-color:var(--pri);background:#fff;box-shadow:0 0 0 3px rgba(167,139,250,.12)}
textarea.inp{resize:vertical;min-height:84px}
input[type=date].inp,input[type=time].inp{-webkit-appearance:none}

/* ============ 读书首页 ============ */
.hero{
  margin:8px 18px 6px;padding:22px 20px 20px;border-radius:24px;color:#5A4660;
  background:linear-gradient(120deg,#FDE7F0 0%,#F1E9FD 52%,#E4F0FB 100%);
  position:relative;overflow:hidden;
}
.hero h2{font-size:22px;font-weight:800;letter-spacing:.5px;font-family:var(--serif)}
.hero p{font-size:12.5px;color:#8A7590;margin-top:3px}
.hero .hero-deco{position:absolute;right:-14px;top:-14px;font-size:74px;opacity:.5;transform:rotate(12deg)}
.stat-row{display:flex;gap:10px;margin:12px 18px 14px}
.stat-mini{flex:1;background:var(--card);border-radius:16px;box-shadow:var(--shadow-sm);padding:12px 8px;text-align:center}
.stat-mini .n{font-size:20px;font-weight:800;color:var(--pri-d)}
.stat-mini .t{font-size:11px;color:var(--ink2);margin-top:1px}

.seg{display:flex;margin:0 18px 14px;background:var(--card);border-radius:14px;box-shadow:var(--shadow-sm);padding:4px;gap:4px}
.seg button{flex:1;padding:9px 0;border-radius:11px;font-weight:700;font-size:13.5px;color:var(--ink2)}
.seg button.on{background:linear-gradient(135deg,#B9A7F5,#F9B8D4);color:#fff;box-shadow:0 4px 10px rgba(185,167,245,.35)}

.book-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:0 18px 20px}
.book-card{background:var(--card);border-radius:20px;box-shadow:var(--shadow-sm);overflow:hidden;transition:.15s;position:relative}
.book-card:active{transform:scale(.97)}
.book-cover{height:118px;display:flex;align-items:center;justify-content:center;position:relative}
.book-cover .emoji{font-size:52px;filter:drop-shadow(0 6px 8px rgba(0,0,0,.10));transform:translateY(-2px)}
.book-cover .status-pos{position:absolute;top:10px;right:10px}
.book-body{padding:12px 14px 14px}
.book-title{font-weight:800;font-size:15.5px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.book-author{font-size:12px;color:var(--ink2);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.book-meta{display:flex;align-items:center;justify-content:space-between;margin-top:9px;font-size:11px;color:var(--ink2)}
.book-meta .cnt{font-weight:700;color:var(--pri-d)}

/* ============ 书目编辑弹层 ============ */
.sheet-backdrop{position:fixed;inset:0;z-index:60;background:rgba(75,63,90,.35);display:flex;align-items:flex-end;justify-content:center;animation:fade .2s}
.sheet{
  width:100%;max-width:440px;max-height:88vh;overflow-y:auto;
  background:var(--bg);border-radius:26px 26px 0 0;padding:8px 20px calc(24px + env(safe-area-inset-bottom));
  animation:up .28s cubic-bezier(.2,.9,.3,1.2);
}
.sheet .sheet-grip{width:42px;height:5px;border-radius:99px;background:#E5D9E8;margin:8px auto 16px}
.sheet h3{font-size:17px;font-weight:800;margin-bottom:16px;text-align:center}
@keyframes up{from{transform:translateY(60px);opacity:.4}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}

.emoji-row,.color-row{display:flex;gap:8px;flex-wrap:wrap}
.emoji-pick{width:42px;height:42px;border-radius:13px;background:var(--card);box-shadow:var(--shadow-sm);font-size:21px;display:flex;align-items:center;justify-content:center}
.emoji-pick.on{outline:2.5px solid var(--pri);background:var(--grape-bg)}
.color-pick{width:30px;height:30px;border-radius:10px;border:3px solid var(--card);box-shadow:var(--shadow-sm)}
.color-pick.on{outline:2.5px solid var(--pri)}
.switch-row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--card);border-radius:14px;box-shadow:var(--shadow-sm)}
.switch{width:48px;height:28px;border-radius:99px;background:#E4DBE6;position:relative;transition:.2s;flex:none}
.switch::after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:#fff;top:3px;left:3px;transition:.2s;box-shadow:0 2px 4px rgba(0,0,0,.15)}
.switch.on{background:var(--mint)}
.switch.on::after{left:23px}

/* ============ 书目详情 ============ */
.book-banner{border-radius:24px;margin:8px 18px 14px;padding:26px 22px 20px;position:relative;overflow:hidden;color:#fff}
.book-banner .bb-emoji{font-size:58px;margin-bottom:8px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.18))}
.book-banner h1{font-size:24px;font-weight:800;font-family:var(--serif);letter-spacing:1px}
.book-banner .bb-author{font-size:13px;opacity:.92;margin-top:3px}
.book-banner .bb-tools{display:flex;gap:8px;margin-top:16px}
.book-banner .bb-tools .btn{background:rgba(255,255,255,.92);color:#5A4660;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.note-list{padding:0 18px 24px;display:flex;flex-direction:column;gap:12px}
.note-card{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);padding:15px 16px;position:relative;transition:.15s}
.note-card:active{transform:scale(.98)}
.note-card .nc-top{display:flex;align-items:center;gap:8px}
.note-card .nc-chapter{font-weight:800;font-size:15px;flex:1;line-height:1.4}
.note-card .nc-date{font-size:11px;color:var(--ink2);background:var(--cream-bg);color:#A97A1E;padding:3px 9px;border-radius:99px;white-space:nowrap}
.note-card .nc-preview{margin-top:8px;font-size:13px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.note-card .nc-remark{margin-top:8px;font-size:12px;color:#B06A2E;background:var(--peach-bg);border-radius:10px;padding:6px 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.note-card .nc-preview img{display:none}

/* ============ 富文本编辑器 ============ */
.rte{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden}
.rte-bar{display:flex;align-items:center;gap:2px;padding:8px 10px;background:#FDFBF8;border-bottom:1px solid var(--line);overflow-x:auto;flex-wrap:nowrap}
.rte-bar::-webkit-scrollbar{display:none}
.rb{min-width:36px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--ink);flex:none}
.rb:active{background:var(--grape-bg)}
.rb.sep{margin:0 4px;min-width:1px;width:1px;background:var(--line);height:20px}
.rb b{font-weight:800}
.rb i{font-style:italic}
.rb u{text-decoration:underline}
.rte-editor{min-height:210px;padding:14px 16px;outline:none;font-size:15px;line-height:1.8}
.rte-editor:empty::before{content:attr(data-placeholder);color:#C9BFD4;pointer-events:none}
.rte-editor img.note-img{max-width:100%;border-radius:14px;margin:10px 0;display:block;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.rte-editor .rte-cap{font-size:11px;color:var(--ink2);text-align:center;margin:-4px 0 8px}
.rte-editor .key{font-weight:800;color:#C05B8E;background:linear-gradient(transparent 62%,#FFE3B8 62%)}
.rte-editor .hl{background:#FFE9A8;padding:0 2px;border-radius:4px}
.rte-editor .cl-red{color:#D05A6E}.rte-editor .cl-blue{color:#3E7CB1}.rte-editor .cl-purple{color:#7A5CB8}.rte-editor .cl-green{color:#3E8E5A}.rte-editor .cl-orange{color:#C07A44}
.rte-editor .f1{font-size:11px}.rte-editor .f2{font-size:15px}.rte-editor .f3{font-size:19px}.rte-editor .f4{font-size:24px}
.rte-editor ul{padding-left:22px}
.rte-editor .rte-img-wrap{position:relative;display:block}
.rte-editor .rte-img-wrap .del-img{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(60,40,60,.55);color:#fff;font-size:14px;display:flex;align-items:center;justify-content:center;opacity:0;transition:.15s}
.rte-editor .rte-img-wrap:hover .del-img,.rte-editor .rte-img-wrap.selected .del-img{opacity:1}
/* 显示模式（非编辑） */
.rich-body{font-size:15px;line-height:1.85;word-break:break-word}
.rich-body img{max-width:100%;border-radius:14px;margin:10px 0;display:block;box-shadow:var(--shadow-sm)}
.rich-body .rte-cap{font-size:11px;color:var(--ink2);text-align:center;margin:-4px 0 8px}
.rich-body b{font-weight:800;color:#C05B8E}
.rich-body i{font-style:italic;color:#3E7CB1}
.rich-body u{text-decoration:underline;text-decoration-color:#F9B8D4;text-decoration-thickness:2px}
.rich-body .hl{background:#FFE9A8;padding:0 2px;border-radius:4px}
.rich-body .key{font-weight:800;color:#C05B8E}
.rich-body .cl-red{color:#D05A6E}.rich-body .cl-blue{color:#3E7CB1}.rich-body .cl-purple{color:#7A5CB8}.rich-body .cl-green{color:#3E8E5A}.rich-body .cl-orange{color:#C07A44}
.rich-body .f1{font-size:11px}.rich-body .f2{font-size:15px}.rich-body .f3{font-size:19px}.rich-body .f4{font-size:24px}
.rich-body .del-img{display:none!important}

/* ============ 笔记编辑页 ============ */
.editor-page{padding:6px 18px 30px}
.editor-page .field-card{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);padding:16px;margin-bottom:14px}
.save-tip{text-align:center;font-size:11.5px;color:var(--ink2);margin:6px 0 4px}
.editor-page .del-note{display:flex;justify-content:center;margin-top:18px}

/* ============ 时间轴 ============ */
.tl-wrap{padding:10px 22px 30px;position:relative}
.tl-line{position:absolute;left:31px;top:16px;bottom:16px;width:3px;border-radius:99px;background:linear-gradient(180deg,#F9B8D4,#B9A7F5,#8CC2E8)}
.tl-item{position:relative;padding:0 0 22px 58px}
.tl-dot{position:absolute;left:15px;top:8px;width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:var(--shadow-sm)}
.tl-dot.done{background:var(--mint-bg);border:2.5px solid #8FD0A2}
.tl-dot.doing{background:var(--peach-bg);border:2.5px solid #F2AE7E;animation:pulse 1.8s infinite}
.tl-card{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);padding:14px 16px}
.tl-card .tc-title{font-weight:800;font-size:15px}
.tl-card .tc-range{margin-top:7px;font-size:12.5px;color:var(--ink2);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tl-card .tc-range .arrow{color:var(--pri)}
.tl-card .tc-cnt{margin-top:6px;font-size:11.5px;color:var(--pri-d);font-weight:700}

/* ============ 日记 ============ */
.diary-head{margin:8px 18px 12px}
.diary-head h2{font-size:20px;font-weight:800;font-family:var(--serif)}
.d-stats{display:flex;gap:10px;margin:12px 18px 14px}
.d-group{margin:0 18px 22px}
.d-group-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.d-group-h .gh{font-weight:800;font-size:14.5px;color:var(--pri-d)}
.d-group-h .gc{font-size:11.5px;color:var(--ink2);background:var(--grape-bg);padding:2px 10px;border-radius:99px;font-weight:700}
.d-entry{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);padding:15px 16px;margin-bottom:12px;transition:.15s}
.d-entry:active{transform:scale(.98)}
.d-entry .de-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:7px}
.de-date{font-size:11px;font-weight:700;background:var(--blue-bg);color:#3E7CB1;padding:3px 10px;border-radius:99px}
.de-time{font-size:11px;color:var(--ink2)}
.de-theme{font-weight:800;font-size:15px}
.de-preview{margin-top:6px;font-size:13px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.de-preview img{display:none}
.d-entry .de-num{margin-left:auto;font-size:11px;color:#C9BFD4}

/* ============ 统计 ============ */
.stats-wrap{padding:8px 18px 30px}
.stat-card{background:var(--card);border-radius:20px;box-shadow:var(--shadow-sm);padding:18px;margin-bottom:16px}
.stat-card h4{font-size:15px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:7px}
.big-num{display:flex;gap:10px}
.big-num .bn{flex:1;text-align:center;background:var(--grape-bg);border-radius:16px;padding:14px 6px}
.big-num .bn .v{font-size:24px;font-weight:800;color:var(--pri-d)}
.big-num .bn .k{font-size:11px;color:var(--ink2);margin-top:2px}
.bar-row{display:flex;align-items:flex-end;gap:8px;height:110px;padding-top:6px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;height:100%;justify-content:flex-end}
.bar-col .bar{width:100%;max-width:30px;border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,#B9A7F5,#F9B8D4);min-height:3px;position:relative}
.bar-col .bar .bar-n{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:10.5px;font-weight:700;color:var(--pri-d);white-space:nowrap}
.bar-col .bar-label{font-size:10.5px;color:var(--ink2)}

/* ============ 我的 ============ */
.profile-card{margin:8px 18px 16px;border-radius:24px;padding:24px 20px;display:flex;align-items:center;gap:16px;background:linear-gradient(120deg,#FDE7F0,#F1E9FD 55%,#E4F0FB);position:relative;overflow:hidden}
.avatar{width:64px;height:64px;border-radius:22px;background:linear-gradient(135deg,#F9B8D4,#B9A7F5);color:#fff;font-size:28px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(185,167,245,.45);flex:none}
.profile-card .pc-name{font-size:19px;font-weight:800;font-family:var(--serif)}
.profile-card .pc-sub{font-size:12px;color:#8A7590;margin-top:2px}
.mine-card{margin:0 18px 16px}
.mine-row{display:flex;align-items:center;gap:13px;padding:13px 4px;border-bottom:1px solid var(--line);cursor:pointer}
.mine-row:last-child{border-bottom:none}
.mine-row .mr-ico{width:38px;height:38px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:18px;flex:none}
.mine-row .mr-t{flex:1}
.mine-row .mr-t b{font-size:14px;display:block}
.mine-row .mr-t span{font-size:11.5px;color:var(--ink2)}
.mine-row .mr-arrow{color:#C9BFD4;font-size:14px}

/* ============ 空状态 ============ */
.empty{text-align:center;padding:52px 30px;color:var(--ink2)}
.empty .e-emoji{font-size:56px;margin-bottom:12px;animation:float 3s ease-in-out infinite}
.empty b{display:block;font-size:15px;color:var(--ink);margin-bottom:5px}
.empty p{font-size:12.5px}
.empty .btn{margin-top:16px}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ============ Toast / 弹层 ============ */
#toast-root{position:fixed;top:60px;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:100%;max-width:440px}
.toast{background:rgba(74,58,84,.92);color:#fff;padding:10px 20px;border-radius:99px;font-size:13px;box-shadow:0 8px 20px rgba(0,0,0,.2);animation:up .25s;backdrop-filter:blur(6px)}
.modal-backdrop{position:fixed;inset:0;z-index:70;background:rgba(75,63,90,.4);display:flex;align-items:center;justify-content:center;padding:26px;animation:fade .2s}
.modal{width:100%;max-width:360px;background:var(--bg);border-radius:22px;padding:22px 20px;animation:up .25s}
.modal h3{font-size:16.5px;font-weight:800;text-align:center;margin-bottom:8px}
.modal .m-msg{font-size:13.5px;color:var(--ink2);text-align:center;line-height:1.7;margin-bottom:18px;word-break:break-word}
.modal .m-btns{display:flex;gap:10px}
.modal .m-btns .btn{flex:1}

/* ============ 开机欢迎页 ============ */
#boot-screen{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#FDE3EF 0%,#F3E8FD 45%,#E3EFFB 100%);
  transition:opacity .6s ease;
  overflow:hidden;
}
#boot-screen.hide{opacity:0;pointer-events:none}
.boot-blob{position:absolute;border-radius:50%;filter:blur(2px);opacity:.55;animation:float 6s ease-in-out infinite}
.b1{width:230px;height:230px;background:#F9C9DE;top:-60px;left:-70px}
.b2{width:190px;height:190px;background:#CDBFF6;bottom:-50px;right:-50px;animation-delay:1.2s}
.b3{width:120px;height:120px;background:#BFE0F6;top:38%;right:-40px;animation-delay:2s}
.boot-inner{position:relative;text-align:center;padding:30px;max-width:400px;width:100%}
.boot-icon{animation:float 3.2s ease-in-out infinite;margin-bottom:16px}
.boot-icon svg{filter:drop-shadow(0 14px 22px rgba(185,167,245,.5))}
.boot-app{font-family:var(--serif);font-size:40px;font-weight:800;letter-spacing:8px;color:#5A4660;margin:6px 0 2px;animation:fadeUp .8s .15s both}
.boot-sub{font-size:14px;color:#8A7590;letter-spacing:2px;animation:fadeUp .8s .3s both}
.boot-date{font-size:12px;color:#A08AA8;margin-top:26px;background:rgba(255,255,255,.6);display:inline-block;padding:6px 18px;border-radius:99px;letter-spacing:1px;animation:fadeUp .8s .45s both}
.boot-quote{
  margin:22px auto 0;max-width:340px;font-family:var(--serif);font-size:19px;line-height:1.9;color:#6A5480;
  min-height:74px;display:flex;align-items:center;justify-content:center;
  animation:fadeUp .8s .6s both;
}
.boot-author{font-size:13px;color:#9A84AC;margin-top:8px;animation:fadeUp .8s .75s both}
.boot-btn{
  margin-top:30px;padding:14px 44px;border-radius:99px;font-size:15px;font-weight:700;letter-spacing:2px;
  color:#fff;background:linear-gradient(135deg,#B9A7F5,#F9B8D4);
  box-shadow:0 12px 26px rgba(185,167,245,.55);
  animation:fadeUp .8s .9s both;transition:transform .15s;
}
.boot-btn:active{transform:scale(.94)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ============ A4 导出页（html2canvas + 打印共用） ============ */
#export-root{position:absolute;left:-9999px;top:0;width:794px}
.a4p{
  width:794px;height:1123px;background:#fff;color:#3a3140;
  display:flex;flex-direction:column;
  padding:56px 62px 50px;position:relative;overflow:hidden;
  font-family:var(--sans);
}
.a4p-head{border-bottom:2.5px solid #E8DDF5;padding-bottom:14px;display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.a4p-flag{width:52px;height:7px;border-radius:99px;margin-bottom:8px}
.a4p-title{font-family:var(--serif);font-size:30px;font-weight:800;letter-spacing:1.5px;line-height:1.3}
.a4p-sub{font-size:13px;color:#8a7f92;margin-top:3px}
.a4p-meta{margin-left:auto;text-align:right;font-size:11.5px;color:#a394a8;line-height:1.8}
.a4p-body{flex:1;overflow:hidden;margin-top:18px}
.a4-entry{margin-bottom:22px}
.a4-chapter{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.a4-chapter .bar{width:6px;height:22px;border-radius:99px;flex:none}
.a4-chapter h2{font-family:var(--serif);font-size:19px;font-weight:800;letter-spacing:1px}
.a4-date{font-size:11.5px;color:#a394a8;margin-bottom:9px;padding-left:16px}
.a4-content{font-size:14px;line-height:1.9;color:#3a3140;word-break:break-word}
.a4-content b{font-weight:800;color:#B0557F}
.a4-content i{font-style:italic;color:#3E7CB1}
.a4-content u{text-decoration:underline;text-decoration-color:#F2A9C8;text-decoration-thickness:2px}
.a4-content .hl{background:#FFE9A8;padding:0 2px;border-radius:3px}
.a4-content .key{font-weight:800;color:#B0557F}
.a4-content .cl-red{color:#C7506A}.a4-content .cl-blue{color:#3E7CB1}.a4-content .cl-purple{color:#7A5CB8}.a4-content .cl-green{color:#3E8E5A}.a4-content .cl-orange{color:#C07A44}
.a4-content .f1{font-size:11px}.a4-content .f2{font-size:14px}.a4-content .f3{font-size:18px}.a4-content .f4{font-size:23px}
.a4-content img{max-width:620px;height:auto;display:block;margin:12px auto;border-radius:10px;border:1px solid #eee}
.a4-content .rte-cap{font-size:11px;color:#a394a8;text-align:center;margin:-6px 0 10px}
.a4-content .del-img{display:none!important}
.a4-content ul{padding-left:22px}
.a4-remark{margin-top:9px;background:#FBF6F2;border-left:3px solid #EDC46E;border-radius:0 8px 8px 0;padding:8px 12px;font-size:12.5px;color:#8a6a3a;line-height:1.7}
.a4-remark .rm{font-weight:700;color:#A97A1E}
.a4p-foot{
  border-top:1px solid #eee;padding-top:12px;margin-top:14px;
  display:flex;align-items:center;justify-content:space-between;
  font-size:11px;color:#a394a8;
}
.a4p-foot .fl{display:flex;align-items:center;gap:6px}
.a4p-foot .fw{font-weight:700;color:#7A5CB8}
/* 章节大分割（按年导出日记时的月份） */
.a4-divider{display:flex;align-items:center;gap:14px;margin:26px 0 18px}
.a4-divider::before,.a4-divider::after{content:"";flex:1;height:1.5px;background:linear-gradient(90deg,transparent,#E3D6F3);}
.a4-divider::after{background:linear-gradient(90deg,#E3D6F3,transparent)}
.a4-divider span{font-family:var(--serif);font-size:17px;font-weight:800;letter-spacing:2px;color:#6D4FA6;background:#F3EDFB;padding:5px 18px;border-radius:99px}

/* ============ 导出预览弹层 ============ */
.export-sheet{padding-bottom:10px}
.exp-scroll{display:flex;flex-direction:column;gap:12px;max-height:48vh;overflow-y:auto;padding:2px}
.exp-page{border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm);background:#fff}
.exp-page img{display:block;width:100%}
.exp-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.exp-actions .btn{width:100%}

/* ============ 子弹层（类型管理 / 文本输入 叠加在表单之上） ============ */
/* 空容器不占位、不拦截点击（避免全屏透明层挡住 App） */
#sheet-root:empty,#sheet-root-2:empty{display:none}
#sheet-root-2{position:fixed;inset:0;z-index:80;pointer-events:none}
#sheet-root-2 .sheet-backdrop{position:fixed;inset:0;z-index:80;background:rgba(75,63,90,.4);display:flex;align-items:flex-end;justify-content:center;animation:fade .2s;pointer-events:auto}
#sheet-root-2 .sheet{width:100%;max-width:440px;max-height:82vh;overflow-y:auto;background:var(--bg);border-radius:26px 26px 0 0;padding:8px 20px calc(24px + env(safe-area-inset-bottom));animation:up .28s cubic-bezier(.2,.9,.3,1.2)}

/* ============ 折叠式选择器（封面图标 / 色系） ============ */
.col-head{width:100%;display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--card);border-radius:14px;box-shadow:var(--shadow-sm);margin-top:2px}
.col-head .col-cur{flex:none}
.col-head>span:last-child{margin-left:auto}
.col-body{display:none;flex-wrap:wrap;gap:8px;margin-top:10px}
.col-body.open{display:flex}
.col-body .emoji-pick,.col-body .color-pick{transition:.12s}
.col-body .emoji-pick:active,.col-body .color-pick:active{transform:scale(.9)}

/* ============ 类型管理 / 菜单 ============ */
.manage-sheet .manage-list{display:flex;flex-direction:column;gap:2px}
.manage-row{display:flex;align-items:center;justify-content:space-between;padding:12px 4px;border-bottom:1px solid var(--line)}
.manage-row:last-child{border-bottom:none}
.manage-row>span:first-child{font-weight:600;font-size:14px}
.manage-row .btn{margin-left:6px}
.menu-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.menu-row{display:flex;align-items:center;gap:13px;padding:14px 14px;background:var(--card);border-radius:16px;box-shadow:var(--shadow-sm);text-align:left}
.menu-row .mr-ico{width:38px;height:38px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:18px;flex:none}
.menu-row .mr-t{flex:1}
.menu-row .mr-t b{font-size:14px;display:block}
.menu-row .mr-t span{font-size:11.5px;color:var(--ink2)}
.menu-row .mr-arrow{color:#C9BFD4;font-size:15px}

/* ============ 书目卡片补充 ============ */
.bk-kind{display:inline-block;font-size:10.5px;font-weight:700;color:#7A5CB8;background:var(--grape-bg);padding:2px 8px;border-radius:99px;margin-bottom:4px}
.book-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.btag{font-size:10.5px;font-weight:700;color:#5B7A55;background:var(--mint-bg);padding:2px 9px;border-radius:99px}
.btag.alt{color:#3E7CB1;background:var(--blue-bg)}

/* ============ 归档时间轴 ============ */
.arc-summary{margin:10px 18px 14px;padding:12px 16px;background:linear-gradient(120deg,#FDE7F0,#F1E9FD);border-radius:16px;font-size:13px;color:#6A5480;box-shadow:var(--shadow-sm)}
.arc-summary b{color:#B05C86;font-size:15px;font-weight:800}
.tl-wrap.arc{padding:6px 22px 30px}
.arc-item{position:relative;padding:0 0 18px 52px}
.arc-no{position:absolute;left:0;top:6px;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#B9A7F5,#F9B8D4);color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}
.arc-card{background:var(--card);border-radius:18px;box-shadow:var(--shadow-sm);padding:13px 15px;transition:.15s}
.arc-card:active{transform:scale(.98)}
.arc-top{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.arc-emoji{font-size:20px}
.arc-meta{font-size:12px;color:var(--ink2);margin-top:6px}
.arc-range{font-size:12.5px;color:var(--ink2);margin-top:5px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.arc-range .arrow{color:var(--pri)}
.arc-cnt{font-size:11.5px;color:var(--pri-d);font-weight:700;margin-top:5px}

/* ============ 统计：年度下钻 ============ */
.yr-list{display:flex;flex-direction:column;gap:10px}
.yr-row{background:var(--card);border-radius:16px;box-shadow:var(--shadow-sm);padding:12px 14px;cursor:pointer}
.yr-head{display:flex;align-items:center;justify-content:space-between}
.yr-head b{font-size:15px;font-weight:800}
.yr-sub{font-size:12px;color:var(--ink2)}
.yr-detail{margin-top:10px;border-top:1px dashed var(--line);padding-top:10px;display:flex;flex-direction:column;gap:9px}
.yr-empty{font-size:12px;color:var(--ink2)}
.yr-book{display:flex;align-items:flex-start;gap:10px}
.yb-emoji{font-size:22px;flex:none}
.yb-body{flex:1}
.yb-title{font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.yb-meta{font-size:11.5px;color:var(--ink2);margin-top:2px}

/* ============ 打印专用（打印窗口内） ============ */
@media print{
  body{background:#fff}
  .a4p{box-shadow:none;margin:0;page-break-after:always;break-after:page}
}

/* ============ 图标分组选择器 ============ */
.ico-group{margin-bottom:6px}
.ico-group:last-child{margin-bottom:0}
.ico-gname{font-size:11px;font-weight:700;color:var(--ink2);margin:2px 0 7px}
.ico-grow{display:flex;flex-wrap:wrap;gap:8px}

/* ============ 色系家族选择器 ============ */
.color-family{display:flex;align-items:center;gap:10px;width:100%;padding:3px 0;border-bottom:1px dashed var(--line)}
.color-family:last-child{border-bottom:none}
.cf-name{width:62px;font-size:12px;font-weight:700;color:var(--ink2);flex:none}
.cf-shades{display:flex;gap:7px;flex-wrap:wrap;padding:2px 0}

/* ============ 归档时间轴：年度分组 ============ */
.arc-year{display:flex;align-items:center;gap:10px;margin:16px 0 4px;padding-left:52px}
.arc-year .ay-chip{background:linear-gradient(135deg,#B9A7F5,#F9B8D4);color:#fff;font-weight:800;font-size:13px;padding:4px 14px;border-radius:99px;box-shadow:var(--shadow-sm)}
.arc-year .ay-cnt{font-size:12px;color:var(--ink2)}
.arc-line{position:relative;height:20px;margin-left:24px;width:3px;background:linear-gradient(180deg,#E4DBE6,transparent);border-radius:99px}

/* ============ 统计：年度切换与下钻 ============ */
.yr-chips{margin-bottom:12px}
.yr-panel{margin-top:4px}
.cur-year{background:linear-gradient(120deg,#FDF0F6,#F1E9FD);border-radius:16px;padding:12px 14px;margin-bottom:14px}
.cy-head{display:flex;align-items:center;gap:8px}
.cy-tag{font-size:10.5px;font-weight:800;color:#fff;background:linear-gradient(135deg,#F9B8D4,#B9A7F5);padding:2px 10px;border-radius:99px}
.cy-title{font-size:13.5px;font-weight:800;color:#6A5480}
.ana-title{font-size:11.5px;font-weight:700;color:var(--ink2);margin:8px 0 4px}
.ana-line{font-size:12px;color:var(--ink2);margin:2px 0 10px;background:var(--cream-bg);border-radius:10px;padding:7px 12px}
.ana-line b{color:#A97A1E}

/* ============ 我的：云端同步卡片 ============ */
.sync-box{background:#FDFBF8;border:1.5px dashed var(--line);border-radius:14px;padding:12px 14px;margin:8px 0 6px}
.sync-state{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:800;margin-bottom:8px}
.sync-state .ss-dot{width:9px;height:9px;border-radius:50%;flex:none}
.sync-state.on{color:#3E8E5A}
.sync-state.on .ss-dot{background:#63B47E;box-shadow:0 0 0 3px rgba(99,180,126,.2);animation:pulse 1.8s infinite}
.sync-state.warn{color:#B06A2E}
.sync-state.warn .ss-dot{background:#EDC46E}
.sync-state.off{color:var(--ink2)}
.sync-state.off .ss-dot{background:#C9BFD4}
.sync-row{display:flex;align-items:center;gap:12px;padding:9px 2px;border-top:1px dashed var(--line)}
.sync-row:first-of-type{border-top:none}
.sync-row .mr-t b{font-size:13px;display:block}
.sync-row .mr-t span{font-size:11px;color:var(--ink2)}

/* ============ 富文本：图片按钮文字 ============ */
.rb .rb-img-label{font-size:11px;margin-left:3px;color:var(--ink2)}