/* ========== 首页专属样式 ========== */
.hero{
  padding:16px 0 6px;
  position:relative;
}
.hero .hero-greeting{
  font-size:14px;color:var(--text2);margin-bottom:8px;
  letter-spacing:.01em;
}
.hero .hero-title{
  font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1.2;
  color:var(--ink);margin-bottom:34px;text-wrap:balance;
}
.hero .hero-stats{
  display:flex;align-items:stretch;
}
.hero .hstat{
  padding-right:44px;margin-right:44px;
  border-right:1px solid var(--border);
}
.hero .hstat:last-child{border-right:none;padding-right:0;margin-right:0}
.hero .hstat .hnum{
  font-size:32px;font-weight:750;line-height:1.15;letter-spacing:-.02em;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.hero .hstat .hlabel{font-size:12px;color:var(--text3);margin-top:4px}

.quick-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:14px;padding:0;margin:40px 0 44px;
}
.quick-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:20px 18px;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:transform .4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .2s ease, border-color .2s ease;
  display:flex;align-items:center;gap:13px;
  transform:scale(1);
}
.quick-card:hover{
  box-shadow:var(--shadow-md);
  border-color:rgba(47,110,79,.2);
  transform:scale(1.04);
}
.quick-card:active{
  transform:scale(0.96);
  transition:transform .08s ease;
}
.quick-card .qc-icon{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:21px;flex-shrink:0;
  background:var(--accent-light);color:var(--accent);
  transition:transform .4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.quick-card:hover .qc-icon{transform:scale(1.15) rotate(-5deg)}
.quick-card .qc-text .qc-title{font-size:15px;font-weight:650;letter-spacing:-.01em;color:var(--ink)}
.quick-card .qc-text .qc-desc{font-size:11.5px;color:var(--text3);margin-top:3px}

.home-section{margin-bottom:32px}
.home-section .sec-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:14px;
}
.home-section .sec-head h2{font-size:17px;font-weight:650;letter-spacing:-.01em;color:var(--ink)}
.home-section .sec-head .sec-more{
  font-size:13px;color:var(--primary);font-weight:550;cursor:pointer;
}

#recentNotes{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;
}
.hnote-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px 20px;
  margin-bottom:0;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:transform .4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .2s ease, border-color .2s ease;
  min-width:0;
  transform:scale(1);
}
.hnote-card:hover{
  box-shadow:var(--shadow-md);
  border-color:rgba(47,110,79,.2);
  transform:scale(1.02);
}
.hnote-card:active{
  transform:scale(0.98);
  transition:transform .08s ease;
}
.hnote-card .hn-title{
  font-size:15.5px;font-weight:650;letter-spacing:-.01em;margin-bottom:6px;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.hnote-card .hn-preview{
  font-size:13px;color:var(--text2);line-height:1.7;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
.hnote-card .hn-meta{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:12px;font-size:11px;color:var(--text3);
}
.hnote-card .hn-tags{display:flex;gap:5px}
.hnote-card .hn-tag{
  background:var(--tag-bg);padding:2px 10px;border-radius:999px;
  font-size:10.5px;color:var(--text2);
}

.home-empty{
  text-align:center;padding:64px 20px;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  grid-column:1/-1;
}
.home-empty .he-icon{font-size:38px;margin-bottom:14px;opacity:.4}
.home-empty p{font-size:14px;color:var(--text2)}
.home-empty .he-hint{font-size:12px;color:var(--text3);margin-top:4px}

/* 文件夹颜色选择器 */
.folder-color-picker{display:flex;gap:12px;flex-wrap:wrap;padding:4px 0}
.fcolor-dot{width:30px;height:30px;border-radius:50%;cursor:pointer;border:3px solid transparent;transition:transform .2s cubic-bezier(0.34,1.56,0.64,1),border-color .15s ease,box-shadow .15s ease;position:relative;flex-shrink:0}
.fcolor-dot:hover{transform:scale(1.2)}
.fcolor-dot:active{transform:scale(.95)}
.fcolor-dot.active{border-color:#fff;box-shadow:0 0 0 3px rgba(0,0,0,.2),0 0 12px rgba(0,0,0,.15);transform:scale(1.15)}
.fcolor-dot.active::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tag-chip.folder-tag{position:relative;border-left:3px solid var(--folder-color,#2f6e4f);padding-left:10px;background-color:var(--card);background-image:linear-gradient(to right,color-mix(in srgb,var(--folder-color,#2f6e4f) 12%,transparent),color-mix(in srgb,var(--folder-color,#2f6e4f) 12%,transparent));background-size:0% 100%;background-repeat:no-repeat;background-position:left center;transition:background-size .3s ease}
.tag-chip.folder-tag:hover{background-size:100% 100%;border-color:var(--folder-color,#2f6e4f);color:var(--text)}
.tag-chip.folder-tag.active{background-size:100% 100%;color:var(--text);border-color:var(--folder-color,#2f6e4f)}

/* 文件夹更多选项 */
.folder-more{position:relative;z-index:9999;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:4px;cursor:pointer;opacity:.5;transition:opacity .15s ease,background .15s ease}
.folder-more:hover{opacity:1;background:rgba(0,0,0,.06);z-index:99999}
.tag-chip.folder-tag{position:relative;z-index:1}
.folder-more .fm-icon{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px}
.folder-more .fm-icon svg{display:block}
.folder-more .fm-menu{position:absolute;top:100%;right:0;padding-top:6px;background:transparent;border:none;box-shadow:none;min-width:90px;opacity:0;pointer-events:none;transition:opacity .12s ease;z-index:9999}
.folder-more:hover .fm-menu{opacity:1;pointer-events:auto}
.folder-more .fm-menu-inner{background:var(--card);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.12);padding:4px}
.folder-more .fm-item{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:7px;font-size:13px;color:var(--text);cursor:pointer;transition:background .12s ease;white-space:nowrap}
.folder-more .fm-item:hover{background:var(--primary-light);color:var(--primary)}
.folder-more .fm-item.danger:hover{background:rgba(239,68,68,.1);color:#ef4444}

/* 下拉选项颜色点缀（模仿笔记主页文件夹标签） */
.custom-select .cs-option{
  position:relative;
  padding-left:16px;
  border-left:5px solid var(--folder-color,#b0b0b0);
  background-color:var(--card);
  color:var(--text);
  overflow:hidden;
  transition:background-color .2s ease;
}
.custom-select .cs-option::before{
  content:'';
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:var(--folder-color,#b0b0b0);
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.custom-select .cs-option:hover{
  background:var(--card);
  color:var(--text);
}
.custom-select .cs-option:hover::before{opacity:.1}
.custom-select .cs-option.selected{
  background:var(--card);
  color:var(--text);
  font-weight:600;
}
.custom-select .cs-option.selected::before{opacity:.12}
.custom-select .cs-option:first-child{--folder-color:#b0b0b0}
.cs-dot{display:none}
/* 下拉触发器选中后显示颜色（模仿笔记主页文件夹标签） */
.custom-select .cs-trigger{
  position:relative;
  border-left:5px solid var(--selected-folder-color,var(--border));
  border-top:1px solid var(--border);
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding-left:14px;
  background-color:var(--card);
  overflow:hidden;
  transition:border-color .25s ease,box-shadow .3s ease;
}
.custom-select .cs-trigger::before{
  content:'';
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  background:var(--selected-folder-color,transparent);
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.custom-select .cs-trigger.has-folder::before{opacity:.1}
.custom-select .cs-trigger .cs-value{color:var(--text);font-weight:normal;position:relative;z-index:1}
.custom-select .cs-trigger .cs-arrow{color:var(--text3);position:relative;z-index:1}
.custom-select.open .cs-trigger{
  border-left-color:var(--selected-folder-color,var(--border));
  border-left-width:5px;
  border-top-color:var(--selected-folder-color,var(--border));
  border-right-color:var(--selected-folder-color,var(--border));
  border-bottom-color:var(--selected-folder-color,var(--border));
  box-shadow:none;
  background:var(--card);
}

/* ========== 批量删除 ========== */
.batch-bar{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(200%);z-index:10000;background:rgba(255,255,255,.7);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);border:1px solid rgba(255,255,255,.6);border-radius:20px;padding:8px 8px 8px 22px;display:flex;align-items:center;gap:14px;box-shadow:0 12px 40px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.06);transition:transform .45s cubic-bezier(0.34,1.56,0.64,1);pointer-events:none}
.batch-bar.show{transform:translateX(-50%) translateY(0);pointer-events:auto}
.batch-count{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;letter-spacing:.2px}
.batch-count::before{content:'✓';display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--primary);color:#fff;font-size:11px;margin-right:8px;vertical-align:middle}
.batch-actions{display:flex;gap:8px}
.batch-cancel{padding:9px 18px;border-radius:14px;border:none;background:rgba(0,0,0,.05);color:var(--text);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}
.batch-cancel:hover{background:rgba(0,0,0,.09);transform:translateY(-1px)}
.batch-cancel:active{transform:scale(.96)}
.batch-delete{padding:9px 20px;border-radius:14px;border:none;background:linear-gradient(135deg,#f87171,#ef4444);color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 3px 10px rgba(239,68,68,.28)}
.batch-delete:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(239,68,68,.38)}
.batch-delete:active{transform:scale(.96)}
.batch-delete:disabled{background:#d4d4d4;box-shadow:none;cursor:not-allowed;transform:none}
body.batch-mode .note-card,body.batch-mode .file-card{position:relative;cursor:pointer;transition:all .25s cubic-bezier(0.34,1.56,0.64,1)}
body.batch-mode .note-card:hover,body.batch-mode .file-card:hover{transform:translateY(-2px)}
body.batch-mode .note-card.selected::before,body.batch-mode .file-card.selected::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(47,110,79,.07),rgba(47,110,79,.02));border-radius:inherit;z-index:5;pointer-events:none}
body.batch-mode .note-card.selected::after,body.batch-mode .file-card.selected::after{content:'';position:absolute;top:10px;right:10px;width:22px;height:22px;border-radius:50%;background:var(--primary);z-index:6;box-shadow:0 3px 10px rgba(47,110,79,.35);animation:batchPop .35s cubic-bezier(0.34,1.56,0.64,1)}
body.batch-mode .note-card.selected::after,body.batch-mode .file-card.selected::after{background-image:linear-gradient(45deg,transparent 42%,#fff 42%,#fff 58%,transparent 58%),linear-gradient(-45deg,transparent 58%,#fff 58%,#fff 74%,transparent 74%);background-position:center;background-size:60% 60%;background-repeat:no-repeat}
@keyframes batchPop{0%{transform:scale(0) rotate(-30deg);opacity:0}100%{transform:scale(1) rotate(0);opacity:1}}
/* 拖拽预备状态反馈 */
.drag-pending{
  transform:scale(1.03) !important;
  border-color:var(--primary) !important;
  box-shadow:0 8px 24px rgba(47,110,79,.25) !important;
  transition:all .2s cubic-bezier(0.34,1.56,0.64,1) !important;
  cursor:grabbing !important;
}

/* 开关样式 */
.toggle-switch{
  width:46px;height:26px;
  background:#d1d5db;
  border-radius:999px;
  position:relative;
  transition:background .25s ease;
  flex-shrink:0;
}
.toggle-switch .toggle-knob{
  position:absolute;
  top:3px;left:3px;
  width:20px;height:20px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
  transition:transform .25s cubic-bezier(0.34,1.56,0.64,1);
}
.toggle-switch.active{
  background:var(--primary);
}
.toggle-switch.active .toggle-knob{
  transform:translateX(20px);
}

/* 禁用文字选取 */
.no-card-select .note-card,
.no-card-select .file-card{
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
}
.no-card-select .note-card *,
.no-card-select .file-card *{
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
}
.folder-tag.drag-pending{
  transform:scale(1.05) !important;
  box-shadow:0 4px 16px rgba(47,110,79,.3) !important;
}

body.batch-mode .note-card.selected,body.batch-mode .file-card.selected{border-color:var(--primary);box-shadow:0 0 0 2px rgba(47,110,79,.18),0 10px 28px rgba(47,110,79,.12)}

/* 文件夹批量选中样式 */
body.batch-mode .folder-tag{cursor:pointer;transition:all .25s cubic-bezier(0.34,1.56,0.64,1)}
body.batch-mode .folder-tag.selected{
  border-color:var(--folder-color,var(--primary)) !important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--folder-color,var(--primary)) 30%,transparent);
  position:relative;
}
body.batch-mode .folder-tag.selected::after{
  content:'';
  position:absolute;
  top:-6px;right:-6px;
  width:18px;height:18px;
  border-radius:50%;
  background:var(--folder-color,var(--primary));
  z-index:10;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
  background-image:linear-gradient(45deg,transparent 42%,#fff 42%,#fff 58%,transparent 58%),linear-gradient(-45deg,transparent 58%,#fff 58%,#fff 74%,transparent 74%);
  background-position:center;
  background-size:60% 60%;
  background-repeat:no-repeat;
  animation:batchPop .35s cubic-bezier(0.34,1.56,0.64,1);
}
/* 批量模式下隐藏文件夹更多选项弹窗和按钮 */
body.batch-mode .folder-more .fm-menu{display:none !important;pointer-events:none}
body.batch-mode .folder-more .fm-icon{display:none !important}
body.batch-mode .folder-more{pointer-events:auto;background:transparent !important}
body.batch-mode .folder-more:hover{background:transparent !important}

/* 强制覆盖默认下拉样式 */
.custom-select .cs-trigger:hover{
  border-left-color:var(--selected-folder-color,var(--border)) !important;
  border-left-width:5px !important;
  border-top-color:var(--selected-folder-color,var(--border)) !important;
  border-right-color:var(--selected-folder-color,var(--border)) !important;
  border-bottom-color:var(--selected-folder-color,var(--border)) !important;
  background:var(--card) !important;
  box-shadow:none !important;
  outline:none !important;
}

/* 导航栏文字平滑加粗 */
.top-nav .tn-item .tn-label::after{font-weight:800;transition:opacity .25s ease}
.top-nav .tn-item:hover .tn-label::after{opacity:.7}
.top-nav .tn-item.active .tn-label::after{opacity:1}

/* 下拉列表滚动提示 */
.custom-select .cs-dropdown{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.custom-select .cs-dropdown::-webkit-scrollbar{display:none}
.custom-select .cs-dropdown::after{
  content:'';
  position:sticky;
  bottom:0;
  display:block;
  height:28px;
  background:linear-gradient(to bottom,transparent,var(--card));
  pointer-events:none;
  margin-top:-28px;
}