/* ═══════════════════════════════════════════════════════════════
   mobile.css — iOS 专用样式（iPhone 优先）
   
   设计理念：
   - 借鉴 iOS 原生系统风格（圆角、毛玻璃、安全区域）
   - 隐藏 PC 侧边栏，使用底部 Tab 导航
   - 阅读器沉浸式，不自动弹出面板
   - 减少键盘弹出，优化触摸交互
   
   加载条件：仅 iPhone（< 769px）加载，iPad 不加载
   ═══════════════════════════════════════════════════════════════ */

/* ── iOS 安全区域 & 全局 ───────────────────────────────── */

/* Standalone 全屏模式（添加到主屏幕）：背景色延伸到顶部，覆盖灵动岛区域 */
@media (display-mode: standalone) {
  html, body {
    min-height: 100vh;
    min-height: 100dvh;
  }
  html {
    background: var(--bg-app);
  }
}

/* Safari & Standalone 模式都需要 safe-area padding（刘海/灵动岛是物理硬件） */
/* 注意：顶部 padding 由各页面的顶部栏处理，body 不加顶部 padding 避免双重间距 */
@supports (padding-top: env(safe-area-inset-top)) {
  body {
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* ── 首页 (index.html) ──────────────────────────────────── */

/* 隐藏 PC 侧边栏 */
.ios-device .sidebar {
  display: none !important;
}
.ios-device .sidebar-overlay {
  display: none !important;
}

/* 主内容区全屏 */
.ios-device .main-content {
  width: 100% !important;
  margin-left: 0 !important;
}

/* ── iOS 顶部栏 ────────────────────────────────────────── */
.ios-device .home-topbar {
  height: 52px;
  padding: 0 16px;
  padding-top: env(safe-area-inset-top, 0px);
  background: var(--bg-app);
  border-bottom: 0.5px solid var(--border);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

.ios-device .home-topbar-left {
  gap: 10px;
}

.ios-device .home-welcome {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.ios-device .home-poem-text {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-muted);
}

/* iOS 风格 "+" 按钮（右上角） */
.ios-device .home-add-btn.ios-top-add {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: 18px;
  box-shadow: 0 2px 8px rgba(232, 145, 106, 0.4);
  transition: transform 0.1s;
  -webkit-tap-highlight-color: transparent;
  margin-right: -4px;
}
.ios-device .home-add-btn.ios-top-add:active {
  transform: scale(0.9);
  background: var(--accent-hover);
}
.ios-device .home-add-btn.ios-top-add svg {
  stroke-width: 3;
}

/* 配置按钮 iOS 化 */
.ios-device .home-config-btn {
  padding: 5px 12px;
  border-radius: 20px;
  font-size: 12px;
  background: rgba(128, 128, 128, 0.12);
  border: none;
  color: var(--text-secondary);
}
.ios-device .home-config-btn.active {
  background: var(--accent-bg);
  color: var(--accent);
}

/* ── 首页内容区 ────────────────────────────────────────── */
.ios-device .home-sections {
  padding: 16px 16px 100px;
  -webkit-overflow-scrolling: touch;
}

.ios-device .home-section-cards {
  gap: 10px;
}

.ios-device .home-section {
  margin-bottom: 24px;
}

/* 区块标题 */
.ios-device .home-section-header {
  margin-bottom: 12px;
  gap: 8px;
  padding: 0 2px;
}

.ios-device .home-section-title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.ios-device .home-section-subtitle {
  display: none;
}

.ios-device .home-section-count {
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 12px;
  background: rgba(128, 128, 128, 0.1);
}

.ios-device .home-section-scroll-btn {
  display: none !important;
}

/* ── 首页卡片 iOS 化 ──────────────────────────────────── */
.ios-device .home-card {
  width: 160px;
  border-radius: 12px;
  border: none;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  background: var(--bg-card);
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .home-card:active {
  transform: scale(0.97);
  transition: transform 0.1s;
}

/* iOS 浅色模式下卡片阴影 */
html[data-system-theme="light"] .ios-device .home-card {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.ios-device .home-card-cover {
  height: 100px;
  border-radius: 12px 12px 0 0;
}

.ios-device .home-card-placeholder {
  height: 100px;
  border-radius: 12px 12px 0 0;
}

.ios-device .home-card-placeholder::before {
  border-radius: 12px 12px 0 0;
}

.ios-device .home-card-body {
  padding: 8px 9px 10px;
}

.ios-device .home-card-title {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  -webkit-line-clamp: 2;
}

.ios-device .home-card-source {
  font-size: 9px;
}

.ios-device .home-card-source-favicon {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.ios-device .home-card-footer {
  margin-top: 4px;
}

.ios-device .home-card-domain {
  font-size: 8.5px;
}

/* ── iOS 底部 Tab 栏（替代旧的 mobile-nav） ──────────────── */
.ios-device .mobile-nav {
  display: flex !important;
  position: fixed !important;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  background: rgba(17, 17, 17, 0.72);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-top: 0.5px solid rgba(255, 255, 255, 0.08);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  z-index: 900;
}

/* 浅色模式底部栏 */
html[data-system-theme="light"] .ios-device .mobile-nav {
  background: rgba(255, 255, 255, 0.78);
  border-top-color: rgba(0, 0, 0, 0.08);
}

.ios-device .mobile-nav a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.4);
  text-decoration: none;
  padding: 6px 0 8px;
  transition: color 0.15s;
  -webkit-tap-highlight-color: transparent;
  position: relative;
}

html[data-system-theme="light"] .ios-device .mobile-nav a {
  color: rgba(0, 0, 0, 0.35);
}

.ios-device .mobile-nav a.active {
  color: var(--accent);
}

/* Tab 图标：SVG stroke="currentColor"，颜色由 color 继承 */
.ios-device .mobile-nav .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: color 0.15s;
}

.ios-device .mobile-nav .icon svg {
  display: block;
}

/* Tab 标签文字 */
.ios-device .mobile-nav a span:not(.icon) {
  font-size: 10px;
  font-weight: 500;
}

/* 收件箱视图适配 */
.ios-device .topbar {
  padding: 0 14px;
  padding-top: env(safe-area-inset-top, 0px);
  height: 52px;
  border-bottom: 0.5px solid var(--border);
}

.ios-device .status-tabs {
  gap: 0;
}

.ios-device .status-tab {
  padding: 0 14px;
  height: 52px;
  font-size: 14px;
  font-weight: 500;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .article-card {
  padding: 12px 14px;
  gap: 10px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .article-card:active {
  background: var(--bg-card-hover);
}

.ios-device .card-thumb {
  width: 64px;
  height: 64px;
  border-radius: 10px;
}

.ios-device .card-title {
  font-size: 14px;
  font-weight: 600;
}

.ios-device .card-summary {
  font-size: 12.5px;
  -webkit-line-clamp: 2;
}

/* 移动端卡片操作：始终显示（无 hover） */
.ios-device .card-act-row {
  opacity: 1 !important;
  pointer-events: all !important;
  margin-top: 8px;
}

.ios-device .car-btn {
  height: 30px;
  min-width: 30px;
  border-radius: 8px;
  font-size: 12px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .search-input {
  width: 130px !important;
  font-size: 14px;
  border-radius: 10px;
  height: 34px;
}

/* ── 添加弹窗 iOS 化 ───────────────────────────────────── */
.ios-device .modal-overlay {
  align-items: flex-end;
  padding-top: 0;
  padding-bottom: 0;
}

.ios-device .modal-box {
  width: 100%;
  max-width: 100%;
  border-radius: 16px 16px 0 0;
  padding: 0;
  padding-bottom: env(safe-area-inset-bottom, 20px);
  transform: translateY(100%);
  border: none;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.3);
}

.ios-device .modal-overlay.open .modal-box {
  transform: translateY(0);
}

/* 弹窗拖动把手 */
.ios-device .modal-box::before {
  content: '';
  display: block;
  width: 36px;
  height: 5px;
  background: rgba(128, 128, 128, 0.3);
  border-radius: 3px;
  margin: 8px auto 4px;
}

.ios-device .modal-title {
  font-size: 17px;
  font-weight: 700;
  padding: 12px 20px 14px;
  text-align: center;
  margin-bottom: 0;
}

/* Tab 切换按钮 */
.ios-device .modal-box > div:nth-child(2) {
  margin: 0 16px 12px;
  background: rgba(128, 128, 128, 0.1);
  border-radius: 8px;
  padding: 2px;
}

.ios-device .tab-btn {
  font-size: 13px;
  font-weight: 500;
  padding: 6px 0;
  border-radius: 7px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .modal-input {
  font-size: 16px; /* 防止 iOS 自动缩放 */
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin: 0 16px;
  width: calc(100% - 32px);
}

.ios-device #add-url-mode {
  padding: 0 16px;
}

.ios-device #add-url-mode .modal-input-wrap {
  margin: 0;
}

.ios-device #add-url-mode .modal-input {
  margin: 0;
  width: 100%;
}

.ios-device .modal-hint {
  padding: 8px 16px;
  font-size: 12px;
}

.ios-device #add-paste-mode {
  padding: 0 16px;
}

.ios-device #add-paste-mode .modal-input {
  margin: 0 0 10px;
  width: 100%;
}

.ios-device .modal-footer {
  padding: 12px 16px;
  gap: 10px;
  margin-top: 8px;
  border-top: 0.5px solid var(--border);
}

.ios-device .btn-ghost {
  flex: 1;
  padding: 14px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  background: rgba(128, 128, 128, 0.12);
  color: var(--text-primary);
  -webkit-tap-highlight-color: transparent;
}

.ios-device .btn-primary {
  flex: 1;
  padding: 14px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  -webkit-tap-highlight-color: transparent;
}

/* ── FAB 已移除（➕ 按钮移到右上角） ───────────────────── */
.ios-fab {
  display: none;
}

.ios-device .ios-fab {
  display: none !important;
}

/* ── 阅读器 (reader.html) ──────────────────────────────── */

/* 阅读器布局 */
.ios-device .r-layout {
  flex-direction: column;
  height: 100dvh;
}

/* 阅读器全屏沉浸模式：上下工具栏隐藏时，内容延伸到安全区域 */
.ios-device .r-layout.ios-reader-immersive {
  height: 100dvh;
  height: 100vh; /* fallback */
  background: var(--r-bg, var(--bg-app));
}

/* 沉浸模式下 body 不保留底部安全区域 padding（由 r-layout 内部处理） */
.ios-device .r-layout.ios-reader-immersive ~ .ios-reader-bar,
body:has(.r-layout.ios-reader-immersive) {
  /* 不需要额外处理 */
}

/* 沉浸模式时 body 底部 padding 置零，防止底部出现黑条 */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  body:has(.r-layout.ios-reader-immersive) {
    padding-bottom: 0 !important;
  }
}

/* 沉浸模式下隐藏的顶部栏不再占据 flex 空间 */
.ios-device .r-layout.ios-reader-immersive .r-topbar {
  height: 0 !important;
  padding: 0 !important;
  border: none !important;
  overflow: hidden;
  flex-shrink: 0;
}

/* 沉浸模式下底部固定栏也高度归零，防止残留 */
.ios-device .r-layout.ios-reader-immersive ~ .ios-reader-bar {
  height: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}

/* 全屏模式下顶部/底部栏已隐藏，文章增加 padding 避开刘海和手势条 */
.ios-device .r-layout.ios-reader-immersive .r-article {
  padding-top: calc(20px + env(safe-area-inset-top, 0px));
  padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px));
}

/* 全屏模式下 r-content 占满全部高度 */
.ios-device .r-layout.ios-reader-immersive .r-content {
  flex: 1;
  height: 100%;
  min-height: 0;
}

/* 隐藏左侧工具条（PC版） */
.ios-device .r-tools {
  display: none !important;
}

/* 隐藏 TOC（移动端通过按钮切换） */
.ios-device .r-toc {
  display: none !important;
}

/* 隐藏分栏拖动 */
.ios-device .r-resizer {
  display: none !important;
}

/* 主内容区 */
.ios-device .r-main {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
}

/* 阅读器顶部栏 */
.ios-device .r-topbar {
  height: 48px;
  padding: 0 12px;
  padding-top: env(safe-area-inset-top, 0px);
  background: var(--bg-app);
  border-bottom: 0.5px solid var(--border);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  position: sticky;
  top: 0;
  z-index: 100;
  gap: 6px;
  flex-shrink: 0;
}

/* Standalone 模式：阅读器顶部栏移除安全区域 — 已在全局 @supports 块中处理 */

.ios-device .r-topbar .src {
  font-size: 12px;
  color: var(--text-secondary);
  font-weight: 500;
}

.ios-device .r-topbar .au {
  font-size: 12px;
  color: var(--text-muted);
}

.ios-device .r-topbar .tm {
  display: none;
}

.ios-device .r-topbar .act-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 16px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .r-topbar .act-btn:active {
  background: rgba(128, 128, 128, 0.12);
}

.ios-device .r-topbar .act-btn.on {
  color: var(--yellow);
}

/* 进度条 */
.ios-device .prog-bar {
  height: 2px;
  flex-shrink: 0;
}

/* 正文区域 */
.ios-device .r-content {
  flex: 1;
  overflow-y: auto;
  padding: 0;
  -webkit-overflow-scrolling: touch;
}

.ios-device .r-article {
  padding: 20px 50px 40px;
  max-width: 100% !important;
}

.ios-device .r-title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.02em;
  margin-bottom: 12px;
}

.ios-device .r-summary {
  font-size: 14px;
  line-height: 1.65;
  padding: 12px 14px;
  border-radius: 10px;
  margin-bottom: 20px;
}

/* 正文排版 */
.ios-device .r-body {
  font-size: 16px !important;
  line-height: 1.8 !important;
  -webkit-text-size-adjust: none;
}

.ios-device .r-body p {
  margin-bottom: 1.1em;
}

.ios-device .r-body h1 {
  font-size: 1.35em;
  margin-top: 1.2em;
}

.ios-device .r-body h2 {
  font-size: 1.2em;
  margin-top: 1.1em;
}

.ios-device .r-body h3 {
  font-size: 1.1em;
  margin-top: 1em;
}

.ios-device .r-body img {
  border-radius: 10px;
  margin: 1em 0;
  max-width: 100% !important;
  width: 100% !important;
}

.ios-device .r-body figure {
  margin: 1em 0;
  max-width: 100%;
  width: 100%;
}

.ios-device .r-body figure img {
  margin: 0;
  width: 100% !important;
  max-width: 100% !important;
}

.ios-device .r-body blockquote {
  border-left-width: 3px;
  padding: 10px 14px;
  margin: 1em 0;
  border-radius: 0 10px 10px 0;
  background: rgba(128, 128, 128, 0.04);
}

.ios-device .r-body pre {
  border-radius: 10px;
  padding: 12px 14px;
  margin: 1em 0;
  max-width: 100%;
  font-size: 12.5px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ios-device .r-body code {
  font-size: 0.9em;
}

/* 高亮文字 */
.ios-device .r-body .hl-yellow,
.ios-device .r-body .hl-green,
.ios-device .r-body .hl-blue,
.ios-device .r-body .hl-pink {
  padding: 1px 0;
}

/* hover 删除提示在 iOS 上禁用 */
.ios-device [data-hl-id]:hover::after {
  display: none;
}

/* ── iOS 阅读器底部工具栏 ──────────────────────────────── */
.ios-reader-bar {
  display: none;
}

.ios-device .ios-reader-bar {
  display: flex !important;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  background: rgba(17, 17, 17, 0.72);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-top: 0.5px solid rgba(255, 255, 255, 0.08);
  padding: 8px 16px;
  padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  z-index: 900;
  gap: 0;
  justify-content: space-around;
  align-items: center;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
}

/* 默认隐藏 */
.ios-device .ios-reader-bar.ios-reader-bar-hidden {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}

/* 顶部栏同步隐藏 */
.ios-device .r-topbar.ios-reader-bar-hidden {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
}

.ios-device .r-topbar {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
}

html[data-system-theme="light"] .ios-device .ios-reader-bar {
  background: rgba(255, 255, 255, 0.78);
  border-top-color: rgba(0, 0, 0, 0.08);
}

/* 底部工具栏按钮 */
.ios-reader-bar-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.45);
  font-size: 9px;
  font-weight: 500;
  cursor: pointer;
  padding: 4px 10px;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s;
  font-family: var(--font-sans);
}

html[data-system-theme="light"] .ios-device .ios-reader-bar-btn {
  color: rgba(0, 0, 0, 0.35);
}

.ios-reader-bar-btn:active {
  opacity: 0.6;
}

.ios-reader-bar-btn.active {
  color: var(--accent);
}

.ios-reader-bar-btn .bar-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  height: 24px;
}

/* ── 右侧面板 → iOS 底部抽屉 ──────────────────────────── */
.ios-device .r-panel {
  position: fixed !important;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100% !important;
  max-height: 70dvh;
  border-left: none !important;
  border-top: 0.5px solid var(--border);
  border-radius: 16px 16px 0 0;
  background: var(--bg-card);
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
  z-index: 950;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.3);
}

.ios-device .r-panel.mobile-open {
  transform: translateY(0);
}

/* 抽屉拖动把手 */
.ios-device .r-panel::before {
  content: '';
  display: block;
  width: 36px;
  height: 5px;
  background: rgba(128, 128, 128, 0.3);
  border-radius: 3px;
  margin: 8px auto 0;
  flex-shrink: 0;
}

.ios-device .panel-tabs {
  padding: 12px 16px 0;
  gap: 4px;
  border-bottom: 1px solid var(--border);
}

.ios-device .panel-tab {
  padding: 10px 0;
  font-size: 13px;
  font-weight: 600;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .panel-body {
  padding: 12px 16px 16px;
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  -webkit-overflow-scrolling: touch;
}

.ios-device .panel-body::-webkit-scrollbar {
  display: none;
}

/* ── 划词弹窗 ──────────────────────────────────────────── */
.ios-device .sel-popup {
  border-radius: 12px;
  padding: 6px 10px;
  gap: 6px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  max-width: 300px;
  /* iOS 位置：靠近选区上方 */
  transform: translateX(-50%);
  left: 50% !important;
}

.ios-device .sel-btn {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 14px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .sel-action {
  height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 12px;
  -webkit-tap-highlight-color: transparent;
}

/* ── 笔记浮层 ──────────────────────────────────────────── */
.ios-device #note-float {
  position: fixed;
  left: 12px !important;
  right: 12px;
  width: auto !important;
  bottom: 80px;
  top: auto !important;
  transform: none !important;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.3);
  z-index: 960;
}

.ios-device .note-float-input {
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 16px; /* 防止 iOS 自动缩放 */
  min-height: 80px;
}

/* ── 字体设置面板 ──────────────────────────────────────── */
.ios-device .font-panel {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  width: 100% !important;
  transform: none !important;
  border-radius: 16px 16px 0 0;
  padding: 20px;
  padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  max-height: 70dvh;
  overflow-y: auto;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.3);
  z-index: 960;
}

.ios-device .font-panel::before {
  content: '';
  display: block;
  width: 36px;
  height: 5px;
  background: rgba(128, 128, 128, 0.3);
  border-radius: 3px;
  margin: 0 auto 12px;
}

.ios-device .fp-row {
  padding: 10px 0;
}

.ios-device .fp-btn {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 16px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .fp-select {
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 14px;
}

/* ── Toast 适配 ─────────────────────────────────────────── */
.ios-device .toast {
  bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  border-radius: 12px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

/* ── 高亮操作菜单 ──────────────────────────────────────── */
.ios-device .hl-action-menu {
  border-radius: 12px;
  padding: 6px 10px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  max-width: 300px;
  transform: translateX(-50%);
  left: 50% !important;
}

.ios-device .hl-menu-btn {
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  -webkit-tap-highlight-color: transparent;
}

/* ── AI Chat 面板适配 ──────────────────────────────────── */
.ios-device .chat-msg {
  padding: 10px 14px;
  font-size: 14px;
  border-radius: 12px;
  line-height: 1.6;
}

.ios-device .chat-input {
  padding: 10px 12px;
  font-size: 16px; /* 防止 iOS 自动缩放 */
  border-radius: 10px;
}

.ios-device .chat-send {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  font-size: 15px;
}

.ios-device .chat-input-wrap {
  padding: 10px 0 0;
  border-top: 0.5px solid var(--border);
}

/* ── 标签编辑器弹层 ─────────────────────────────────────── */
.ios-device .tag-editor-popup {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 80px;
  width: auto;
  border-radius: 16px;
  z-index: 100;
}

.ios-device .tag-editor-header {
  padding: 14px 16px;
}

.ios-device .tag-editor-body {
  padding: 12px 16px 16px;
}

.ios-device .tag-editor-input {
  font-size: 16px;
  padding: 10px 12px;
  border-radius: 10px;
}

/* ── 遮罩层 ────────────────────────────────────────────── */
.ios-device .ios-panel-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 940;
  display: none;
  opacity: 0;
  transition: opacity 0.2s;
}

.ios-device .ios-panel-overlay.show {
  display: block;
  opacity: 1;
}

/* ── 更多菜单 ──────────────────────────────────────────── */
.ios-device .more-menu {
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  min-width: 140px;
}

.ios-device .more-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-size: 14px;
  -webkit-tap-highlight-color: transparent;
}

/* ── 网格视图适配 ──────────────────────────────────────── */
.ios-device .article-list.grid-view {
  gap: 12px;
  padding: 16px;
}

.ios-device .grid-card {
  border-radius: 14px;
  border: none;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  -webkit-tap-highlight-color: transparent;
}

html[data-system-theme="light"] .ios-device .grid-card {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.ios-device .grid-card:active {
  transform: scale(0.98);
}

.ios-device .grid-card-thumb {
  border-radius: 14px 14px 0 0;
}

.ios-device .grid-card-body {
  padding: 10px 12px;
}

.ios-device .grid-card-title {
  font-size: 12px;
  font-weight: 600;
}

/* ── 上传区域适配 ──────────────────────────────────────── */
.ios-device .drop-zone {
  border-radius: 16px;
  padding: 36px 20px;
  margin: 16px;
}

.ios-device .drop-title {
  font-size: 16px;
  font-weight: 600;
}

/* ── 配置气泡菜单 iOS 化 ───────────────────────────────── */
.ios-device .config-popover {
  left: 12px;
  right: 12px;
  width: auto;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  padding: 16px;
}

html[data-system-theme="light"] .ios-device .config-popover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

.ios-device .config-item {
  padding: 10px 12px;
  border-radius: 10px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .config-item-label {
  font-size: 14px;
}

.ios-device .config-drag-handle {
  display: none;
}

/* ── 通用 iOS 样式工具类 ────────────────────────────────── */
.ios-only {
  display: none !important;
}

.ios-device .ios-only {
  display: flex !important;
}

.pc-only {
  display: initial;
}

.ios-device .pc-only {
  display: none !important;
}

/* ── 笔记页面 iOS 适配 (notes.html) ─────────────────────── */

/* 整体布局改为纵向 */
.ios-device .notes-layout {
  flex-direction: column;
  height: auto;
  min-height: 100dvh;
}

/* 隐藏 PC 左侧边栏 */
.ios-device .notes-layout > .sidebar {
  display: none !important;
}

/* 隐藏 PC 右侧 AI 面板 */
.ios-device .notes-ai {
  display: none !important;
}

/* 笔记主区域全屏 */
.ios-device .notes-main {
  width: 100%;
  flex: none;
  min-height: 100dvh;
  padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px));
}

/* 笔记顶部栏 */
.ios-device .notes-topbar {
  height: 52px;
  padding: 0 16px;
  padding-top: env(safe-area-inset-top, 0px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  background: var(--bg-app);
  border-bottom: 0.5px solid var(--border);
}

.ios-device .notes-topbar h1 {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* 搜索框 */
.ios-device .notes-topbar .search-input {
  width: 120px !important;
  font-size: 14px;
  height: 32px;
  border-radius: 10px;
}

/* 聚合按钮 */
.ios-device .notes-topbar .btn-ghost,
.ios-device .notes-topbar .btn-primary {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 16px;
  -webkit-tap-highlight-color: transparent;
}

/* 颜色 Tab 改为横向滚动 */
.ios-device .color-tabs {
  display: flex;
  gap: 0;
  padding: 0 16px;
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  flex-shrink: 0;
}

.ios-device .color-tabs::-webkit-scrollbar {
  display: none;
}

/* 隐藏颜色分类 Tab，只保留"全部" */
.ios-device .color-tabs .ctab.yellow,
.ios-device .color-tabs .ctab.green,
.ios-device .color-tabs .ctab.blue,
.ios-device .color-tabs .ctab.pink {
  display: none !important;
}

.ios-device .ctab {
  flex-shrink: 0;
  padding: 10px 14px;
  border-radius: 0;
  font-size: 13px;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  border-left: none;
  border-right: none;
  border-top: none;
  background: transparent;
  color: var(--text-secondary);
}

.ios-device .ctab.on {
  color: var(--accent) !important;
  border-bottom-color: var(--accent);
  background: transparent !important;
}

/* 笔记内容区 */
.ios-device .notes-content {
  padding: 12px 16px;
}

/* 笔记分组 */
.ios-device .note-group {
  margin-bottom: 16px;
}

.ios-device .note-group-header {
  padding: 8px 12px;
  border-bottom: none;
  margin-bottom: 8px;
  background: rgba(128, 128, 128, 0.06);
  border-radius: 10px;
}

.ios-device .note-group-title {
  font-size: 14px;
  font-weight: 600;
}

.ios-device .note-group-link {
  padding: 4px 10px;
  border-radius: 14px;
  font-size: 12px;
}

/* 笔记卡片 */
.ios-device .note-card {
  border-radius: 12px;
  border: none;
  background: var(--bg-card);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  margin-bottom: 8px;
  -webkit-tap-highlight-color: transparent;
}

.ios-device .note-card:active {
  transform: scale(0.98);
}

/* 去掉左侧颜色圆点（内联样式也要覆盖） */
.ios-device .note-color-bar {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* 隐藏聚合选择圆点 */
.ios-device .note-select-dot {
  display: none !important;
}

.ios-device .note-body {
  padding: 10px 12px;
}

.ios-device .note-text {
  font-size: 14px;
  line-height: 1.6;
}

.ios-device .note-annotation {
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 8px;
  margin-bottom: 6px;
}

.ios-device .note-source {
  display: none;
}

.ios-device .note-actions {
  margin-top: 6px;
  opacity: 1 !important;
  pointer-events: all !important;
}

.ios-device .note-act-btn {
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 6px;
}

/* 隐藏时间和删除按钮，只保留"问AI" */
.ios-device .note-time {
  display: none !important;
}

.ios-device .note-act-btn.del {
  display: none !important;
}

/* 新建分类按钮 */
.ios-device .ios-new-folder-btn {
  display: flex !important;
  padding: 10px 16px;
  gap: 8px;
  align-items: center;
  font-size: 14px;
  color: var(--accent);
  font-weight: 500;
  -webkit-tap-highlight-color: transparent;
}

/* ── 设置页面 iOS 适配 (settings.html) ───────────────────── */

/* 整体布局改为纵向 */
.ios-device .settings-layout {
  flex-direction: column;
  height: auto;
  min-height: 100dvh;
}

/* 隐藏 PC 左侧边栏 */
.ios-device .settings-sidebar {
  display: none !important;
}

/* 设置主内容区 */
.ios-device .settings-main {
  width: 100%;
  max-width: 100% !important;
  padding: 0;
  padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  overflow-y: visible;
}

/* iOS 设置分组卡片 */
.ios-device .settings-section {
  margin-bottom: 0;
  background: var(--bg-card);
  border-radius: 12px;
  margin: 16px;
  overflow: hidden;
}

/* 分组标题 */
.ios-device .settings-section h2 {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: none;
  letter-spacing: 0;
  padding: 20px 16px 8px;
  margin-bottom: 0;
}

/* 设置行：iOS 风格横向布局 —— 左文字，右控件 */
.ios-device .setting-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 13px 16px;
  border-bottom: 0.5px solid var(--border);
  gap: 12px;
  min-height: 44px;
}

.ios-device .setting-row:last-child {
  border-bottom: none;
}

/* 左侧标签区域 */
.ios-device .setting-label {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.ios-device .setting-label strong {
  font-size: 15px;
  font-weight: 500;
  color: var(--text-primary);
  display: block;
}

.ios-device .setting-label span {
  font-size: 13px;
  color: var(--text-secondary);
  display: block;
  line-height: 1.3;
}

/* 右侧控件区域 */
.ios-device .setting-control {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

/* 没有控件的设置行：右侧显示箭头指示 */
.ios-device .setting-row:not(:has(.setting-control)):not(:has(.toggle)):not(:has(.s-select)):not(:has(.s-input)):not(:has(.theme-switcher)) {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* 关于页面修复：多个 setting-label 在同一行时横排 */
.ios-device .setting-label + .setting-label {
  margin-left: 16px;
  padding-left: 16px;
  border-left: 0.5px solid var(--border);
}

/* iOS 导航分段控制器（替代侧边栏） */
.ios-device .ios-settings-nav {
  display: flex !important;
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--bg-app);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  padding: 0;
  padding-top: env(safe-area-inset-top, 0px);
  border-bottom: 0.5px solid var(--border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ios-device .ios-settings-nav::-webkit-scrollbar {
  display: none;
}

.ios-device .ios-settings-nav-item {
  flex-shrink: 0;
  padding: 14px 16px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-secondary);
  -webkit-tap-highlight-color: transparent;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  transition: color 0.15s;
}

.ios-device .ios-settings-nav-item.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* 主题切换器适配 */
.ios-device .setting-row:has(.theme-switcher) {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.ios-device .theme-switcher {
  width: 100%;
  justify-content: center;
}

.ios-device .theme-option {
  padding: 10px 20px;
  font-size: 14px;
}

/* 主题预览隐藏（移动端意义不大） */
.ios-device .setting-row:has(.theme-preview) {
  display: none;
}

/* 输入框适配 */
.ios-device .s-input.wide {
  width: 100%;
  font-size: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ios-device .s-select {
  font-size: 16px;
  padding: 12px 14px;
  border-radius: 10px;
}

/* 保存按钮 */
.ios-device .save-btn {
  padding: 0 16px 16px;
}

.ios-device .save-btn .btn-primary,
.ios-device .save-btn .btn-ghost {
  flex: 1;
  padding: 14px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
}

/* Toggle 开关加大 */
.ios-device .toggle {
  width: 48px;
  height: 28px;
}

.ios-device .toggle-track {
  border-radius: 14px;
}

.ios-device .toggle-thumb {
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
}

.ios-device .toggle input:checked ~ .toggle-thumb {
  left: 23px;
}

/* 存储信息 */
.ios-device #section-storage .disk-bar {
  margin-top: 8px;
}

.ios-device #section-storage code {
  font-size: 12px;
  word-break: break-all;
}

/* ── 横屏适配 ──────────────────────────────────────────── */
@media (orientation: landscape) and (max-height: 500px) {
  .ios-device .r-article {
    padding: 16px 24px 60px;
  }
  
  .ios-device .ios-reader-bar {
    padding: 4px 20px;
    padding-bottom: calc(4px + env(safe-area-inset-bottom, 0px));
  }
  
  .ios-device .r-topbar {
    height: 40px;
  }
}

/* ── iPad 适配（不加载此文件，但以防万一）────────────────── */
@media (min-width: 769px) {
  .ios-device .mobile-nav,
  .ios-device .ios-reader-bar,
  .ios-device .ios-fab {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   桃悦OS 移动端模块化样式 v2
   模块：base / nav / reader / notes / me
   ═══════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════
   mobile/base.css v2 — 变量、主题、全局重置
   仅对 .ios-device 生效，PC端零影响
   ═══════════════════════════════════════════════════════════ */

/* ── 基础变量（夜间/默认）────────────────────────────────── */
.ios-device {
  /* 间距 */
  --mob-radius-sm:  8px;
  --mob-radius-md:  12px;
  --mob-radius-lg:  16px;
  --mob-radius-xl:  20px;

  /* 颜色 —— 继承系统主题变量 */
  --mob-bg:         var(--bg-app);
  --mob-bg-card:    var(--bg-card);
  --mob-bg-bar:     var(--bg-sidebar);
  --mob-text:       var(--text-primary);
  --mob-text-sub:   var(--text-secondary);
  --mob-text-muted: var(--text-muted);
  --mob-border:     var(--border);
  --mob-accent:     var(--accent, #e8916a);

  /* 毛玻璃 */
  --mob-glass:      rgba(255,255,255,0.08);
  --mob-glass-border: rgba(255,255,255,0.12);
  --mob-blur:       saturate(180%) blur(20px);

  /* 工具栏高度 */
  --mob-bar-h:      54px;
  --mob-topbar-h:   44px;
  --mob-safe-b:     env(safe-area-inset-bottom, 0px);
  --mob-safe-t:     env(safe-area-inset-top, 0px);
}

/* ── 日间模式覆盖 ─────────────────────────────────────────── */
html[data-system-theme="light"] .ios-device {
  --mob-glass:        rgba(255,255,255,0.72);
  --mob-glass-border: rgba(0,0,0,0.06);
}

/* ── 全局触摸优化 ─────────────────────────────────────────── */
.ios-device * {
  -webkit-tap-highlight-color: transparent;
}

.ios-device button,
.ios-device a,
.ios-device [onclick] {
  touch-action: manipulation;
}

/* ── 安全区域 ─────────────────────────────────────────────── */
.ios-device body {
  padding-bottom: var(--mob-safe-b);
}
/* ═══════════════════════════════════════════════════════════
   mobile/nav.css v2 — 底部Tab导航
   风格：微信读书简约线条，无彩色，桃元素icon
   ═══════════════════════════════════════════════════════════ */

/* ── 底部导航容器 ─────────────────────────────────────────── */
.ios-device .mobile-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 800;
  height: calc(var(--mob-bar-h) + var(--mob-safe-b));
  padding-bottom: var(--mob-safe-b);
  display: flex;
  align-items: flex-start;
  padding-top: 8px;

  background: var(--mob-glass) !important;
  -webkit-backdrop-filter: var(--mob-blur) !important;
  backdrop-filter: var(--mob-blur) !important;
  border-top: 0.5px solid var(--mob-glass-border) !important;
}

/* 日间模式：白色底 */
html[data-system-theme="light"] .ios-device .mobile-nav {
  background: rgba(255,255,255,0.92) !important;
  border-top-color: rgba(0,0,0,0.10) !important;
}

/* ── Tab 项 ──────────────────────────────────────────────── */
.ios-device .mobile-nav a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 2px 4px 0;
  text-decoration: none;
  color: var(--mob-text-muted) !important;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: color 0.15s;
}

.ios-device .mobile-nav a.active {
  color: var(--mob-accent) !important;
}

/* ── Icon 容器（无彩色底板，仅线条）────────────────────────── */
.ios-device .mobile-nav .icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: transform 0.12s cubic-bezier(0.34,1.56,0.64,1) !important;
}

.ios-device .mobile-nav a.active .icon {
  transform: scale(1.10);
}

.ios-device .mobile-nav a:active .icon {
  transform: scale(0.88) !important;
}

/* SVG 颜色跟随 */
.ios-device .mobile-nav .icon svg {
  width: 24px !important;
  height: 24px !important;
  stroke-width: 1.6 !important;
  transition: stroke 0.15s !important;
}

.ios-device .mobile-nav a.active .icon svg {
  stroke-width: 2.0 !important;
}

/* 文字 */
.ios-device .mobile-nav a span:not(.icon) {
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

/* ── active 指示点 ────────────────────────────────────────── */
.ios-device .mobile-nav a.active::after {
  content: '';
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--mob-accent);
  margin-top: 1px;
  position: absolute;
  bottom: calc(var(--mob-safe-b) + 4px);
}

/* 采桃集页面底部Tab（3个）*/
.ios-device .harvest-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 800;
  height: calc(var(--mob-bar-h) + var(--mob-safe-b));
  padding-bottom: var(--mob-safe-b);
  display: none; /* JS控制显示 */
  align-items: flex-start;
  padding-top: 8px;
  background: var(--mob-glass);
  -webkit-backdrop-filter: var(--mob-blur);
  backdrop-filter: var(--mob-blur);
  border-top: 0.5px solid var(--mob-glass-border);
}

html[data-system-theme="light"] .ios-device .harvest-nav {
  background: rgba(255,255,255,0.92);
}

.ios-device .harvest-nav a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 2px 4px 0;
  text-decoration: none;
  color: var(--mob-text-muted);
  font-size: 10px;
  font-weight: 500;
}

.ios-device .harvest-nav a.active {
  color: var(--mob-accent);
}
/* ═══════════════════════════════════════════════════════════
   mobile/reader.css v2 — 阅读页移动端样式
   风格：微信读书简约，沉浸阅读，底部工具栏
   ═══════════════════════════════════════════════════════════ */

/* ── 阅读器全屏布局 ──────────────────────────────────────── */
.ios-device .r-layout {
  height: 100dvh;
}

/* 沉浸模式时隐藏PC端顶部栏 */
.ios-device .r-topbar {
  transition: opacity 0.3s, transform 0.3s;
  -webkit-backdrop-filter: var(--mob-blur);
  backdrop-filter: var(--mob-blur);
}

.ios-device .r-topbar.mob-hidden {
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

/* 隐藏PC端右侧面板触发器 */
.ios-device .r-tools {
  display: none !important;
}

/* 内容区底部留出工具栏空间 */
.ios-device .r-layout.ios-reader-immersive .r-content {
  padding-bottom: calc(var(--mob-bar-h) + var(--mob-safe-b) + 20px);
}

/* ── 底部工具栏（微信读书风格）─────────────────────────────── */
.ios-reader-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 900;
  height: calc(var(--mob-bar-h) + var(--mob-safe-b));
  padding-bottom: var(--mob-safe-b);
  display: flex;
  align-items: flex-start;
  padding-top: 6px;
  gap: 0;

  background: var(--mob-glass);
  -webkit-backdrop-filter: var(--mob-blur);
  backdrop-filter: var(--mob-blur);
  border-top: 0.5px solid var(--mob-glass-border);
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1),
              opacity 0.3s;
}

html[data-system-theme="light"] .ios-reader-bar {
  background: rgba(255,255,255,0.95);
  border-top-color: rgba(0,0,0,0.08);
}

.ios-reader-bar.ios-reader-bar-hidden {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}

/* ── 工具栏按钮 ──────────────────────────────────────────── */
.ios-reader-bar-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 4px 2px 0;
  border: none;
  background: transparent;
  color: var(--mob-text-sub);
  cursor: pointer;
  transition: color 0.15s, transform 0.12s;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.ios-reader-bar-btn:active {
  transform: scale(0.88);
  color: var(--mob-accent);
}

.ios-reader-bar-btn.active {
  color: var(--mob-accent);
}

.ios-reader-bar-btn .bar-icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ios-reader-bar-btn .bar-icon svg {
  width: 22px;
  height: 22px;
  stroke-width: 1.6;
}

/* ── 标注弹出菜单（微信读书风格）──────────────────────────── */
.ios-mob-hl-menu {
  position: fixed;
  z-index: 9999;
  display: flex;
  align-items: center;
  padding: 4px 6px;
  border-radius: 10px;
  background: var(--mob-bg-card);
  border: 0.5px solid var(--mob-glass-border);
  box-shadow: 0 4px 20px rgba(0,0,0,0.20);
  animation: mob-hl-pop 0.14s cubic-bezier(0.34,1.4,0.64,1);
  transform-origin: center bottom;
}

html[data-system-theme="light"] .ios-mob-hl-menu {
  background: #fff;
  border-color: rgba(0,0,0,0.08);
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
}

@keyframes mob-hl-pop {
  from { opacity:0; transform: scale(0.85) translateY(6px); }
  to   { opacity:1; transform: scale(1) translateY(0); }
}

.ios-mob-hl-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 9px;
  color: var(--mob-text-sub);
  font-weight: 500;
  transition: background 0.1s;
}

.ios-mob-hl-btn:active {
  background: rgba(128,128,128,0.10);
  transform: scale(0.88);
}

.ios-mob-hl-dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* 颜色 */
.ios-mob-hl-yellow { background: #f5c842; }
.ios-mob-hl-green  { background: #52c77d; }
.ios-mob-hl-blue   { background: #4a9eff; }
.ios-mob-hl-pink   { background: #f078a0; }

/* 分隔 */
.ios-mob-hl-sep {
  width: 0.5px;
  height: 24px;
  background: var(--mob-border);
  margin: 0 2px;
  flex-shrink: 0;
}

/* AI 按钮 */
.ios-mob-hl-ai {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--mob-accent) !important;
  width: 48px !important;
}

/* ── 字体设置面板（底部 Sheet）──────────────────────────────── */
.ios-font-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(var(--mob-bar-h) + var(--mob-safe-b));
  z-index: 880;
  background: var(--mob-bg-card);
  border-radius: var(--mob-radius-xl) var(--mob-radius-xl) 0 0;
  padding: 16px 20px 20px;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.15);
  border-top: 0.5px solid var(--mob-border);
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}

html[data-system-theme="light"] .ios-font-sheet {
  background: #fff;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.08);
}

.ios-font-sheet.open {
  transform: translateY(0);
}

/* 拖动把手 */
.ios-font-sheet::before {
  content: '';
  display: block;
  width: 36px;
  height: 4px;
  background: var(--mob-border);
  border-radius: 2px;
  margin: 0 auto 16px;
}

/* 亮度行 */
.ios-sheet-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 0.5px solid var(--mob-border);
}

.ios-sheet-row:last-child {
  border-bottom: none;
}

.ios-sheet-label {
  font-size: 13px;
  color: var(--mob-text-muted);
  width: 40px;
  flex-shrink: 0;
}

.ios-sheet-slider {
  flex: 1;
  -webkit-appearance: none;
  height: 3px;
  border-radius: 2px;
  background: var(--mob-border);
  outline: none;
}

.ios-sheet-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--mob-accent);
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}

/* 字号调节 */
.ios-font-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 0.5px solid var(--mob-border);
}

.ios-font-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--mob-border);
  background: transparent;
  color: var(--mob-text);
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ios-font-btn:active {
  background: rgba(128,128,128,0.12);
}

.ios-font-val {
  font-size: 15px;
  color: var(--mob-text);
  font-weight: 500;
  min-width: 48px;
  text-align: center;
}

/* 主题色块行 */
.ios-theme-row {
  display: flex;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 0.5px solid var(--mob-border);
}

.ios-theme-btn {
  flex: 1;
  height: 36px;
  border-radius: var(--mob-radius-sm);
  border: 1.5px solid transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 500;
  transition: border-color 0.15s;
}

.ios-theme-btn.active {
  border-color: var(--mob-accent);
}

.ios-theme-day   { background: #fff; color: #333; }
.ios-theme-night { background: #1a1a1a; color: #e0e0e0; }
.ios-theme-auto  { background: linear-gradient(90deg,#fff 50%,#1a1a1a 50%); color: #888; }
.ios-theme-sepia { background: #f5efe6; color: #5c4a2a; }

/* ── 阅读器 AI 问书抽屉 ──────────────────────────────────── */
.ios-reader-ai-drawer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 70dvh;
  z-index: 9998;
  display: flex;
  flex-direction: column;
  background: var(--mob-bg-card);
  border-radius: var(--mob-radius-xl) var(--mob-radius-xl) 0 0;
  box-shadow: 0 -8px 40px rgba(0,0,0,0.20);
  border-top: 0.5px solid var(--mob-border);
  visibility: hidden;
  opacity: 0;
  transform: translateY(20px);
  transition: visibility 0s linear 0.25s,
              opacity 0.25s,
              transform 0.25s cubic-bezier(0.4,0,0.2,1);
  padding-bottom: var(--mob-safe-b);
}

html[data-system-theme="light"] .ios-reader-ai-drawer {
  background: #fff;
}

.ios-reader-ai-drawer.open {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0s;
}

/* 键盘弹出时用 bottom 上移（方案A：不用translateY避免双重位移）*/
.ios-reader-ai-drawer.keyboard-up {
  bottom: var(--keyboard-h, 0px);
  transition: bottom 0.2s cubic-bezier(0.4,0,0.2,1);
}

/* 拖动把手 */
.ios-reader-ai-drawer::before {
  content: '';
  display: block;
  width: 36px;
  height: 4px;
  background: var(--mob-border);
  border-radius: 2px;
  margin: 10px auto 0;
  flex-shrink: 0;
}

.ios-reader-ai-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9997;
  background: rgba(0,0,0,0.35);
}

.ios-reader-ai-backdrop.open {
  display: block;
}

/* AI 抽屉内部布局 */
.ios-reader-ai-head {
  display: flex;
  align-items: center;
  padding: 10px 16px 10px;
  border-bottom: 0.5px solid var(--mob-border);
  flex-shrink: 0;
  gap: 8px;
}

.ios-reader-ai-head-title {
  flex: 1;
  font-size: 14px;
  font-weight: 600;
  color: var(--mob-text);
}

.ios-reader-ai-quote {
  background: rgba(232,145,106,0.06);
  border-left: 3px solid var(--mob-accent);
  margin: 8px 16px 0;
  padding: 8px 12px;
  border-radius: 0 8px 8px 0;
  font-size: 12.5px;
  color: var(--mob-text-muted);
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  flex-shrink: 0;
}

.ios-reader-ai-msgs {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 10px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.ios-reader-ai-msg {
  padding: 9px 13px;
  border-radius: 14px;
  font-size: 14px;
  line-height: 1.65;
  max-width: 92%;
  word-break: break-word;
}

.ios-reader-ai-msg.user {
  background: var(--mob-accent);
  color: #fff;
  align-self: flex-end;
  border-bottom-right-radius: 4px;
}

.ios-reader-ai-msg.ai {
  background: rgba(128,128,128,0.10);
  color: var(--mob-text);
  align-self: flex-start;
  border-bottom-left-radius: 4px;
}

html[data-system-theme="light"] .ios-reader-ai-msg.ai {
  background: #f2f2f2;
}

.ios-reader-ai-msg.loading {
  color: var(--mob-text-muted);
  font-style: italic;
}

.ios-reader-ai-input-row {
  display: flex;
  gap: 8px;
  padding: 8px 12px;
  padding-bottom: max(12px, var(--mob-safe-b));
  border-top: 0.5px solid var(--mob-border);
  flex-shrink: 0;
  align-items: flex-end;
}

.ios-reader-ai-inp {
  flex: 1;
  background: rgba(128,128,128,0.08);
  border: none;
  border-radius: 20px;
  color: var(--mob-text);
  padding: 9px 14px;
  font-size: 14px;
  outline: none;
  resize: none;
  font-family: var(--font-sans);
  min-height: 38px;
  max-height: 100px;
  overflow-y: auto;
  line-height: 1.5;
}

html[data-system-theme="light"] .ios-reader-ai-inp {
  background: #f2f2f2;
}

.ios-reader-ai-send {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--mob-accent);
  border: none;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.1s;
}

.ios-reader-ai-send:active {
  transform: scale(0.88);
}
/* ═══════════════════════════════════════════════════════════
   mobile/notes.css v2 — 笔记页移动端优化
   ═══════════════════════════════════════════════════════════ */

/* ── 笔记卡片 ─────────────────────────────────────────────── */
.ios-device .note-card {
  border-radius: var(--mob-radius-md) !important;
  border: 0.5px solid var(--mob-border) !important;
  box-shadow: none !important;
  margin-bottom: 8px !important;
  padding: 12px 14px !important;
  transition: background 0.12s !important;
}

.ios-device .note-card:active {
  background: rgba(128,128,128,0.04) !important;
}

/* ── 问AI按钮 始终可见 ────────────────────────────────────── */
@media (max-width: 768px) {
  .ios-device .note-actions {
    opacity: 1 !important;
    margin-top: 8px;
    display: flex;
    gap: 6px;
  }
}

.ios-device .note-act-btn {
  font-size: 12px !important;
  padding: 5px 12px !important;
  border-radius: 20px !important;
  border: 0.5px solid var(--mob-border) !important;
  background: transparent !important;
  color: var(--mob-text-sub) !important;
  min-height: 30px !important;
}

.ios-device .note-act-btn:active {
  background: rgba(128,128,128,0.08) !important;
}

.ios-device .note-act-btn.ask-ai-btn {
  color: var(--mob-accent) !important;
  border-color: rgba(232,145,106,0.3) !important;
}

/* ── AI 对话抽屉（全屏分屏布局）──────────────────────────── */
.ios-device .mob-ai-drawer {
  position: fixed !important;
  inset: 0 !important;
  height: 100dvh !important;
  border-radius: 0 !important;
  border-top: none !important;
  background: var(--mob-bg) !important;
  transform: none !important;
  z-index: 9999 !important;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 0.2s, opacity 0.2s !important;
}

html[data-system-theme="light"] .ios-device .mob-ai-drawer {
  background: #fff !important;
}

.ios-device .mob-ai-drawer.open {
  visibility: visible !important;
  opacity: 1 !important;
  transition-delay: 0s !important;
  display: flex !important;
  transform: none !important;
}

/* 原文区 */
.ios-device .mob-ai-quote-area {
  flex-shrink: 0;
  padding: 12px 16px 10px;
  border-bottom: 0.5px solid var(--mob-border);
  background: rgba(232,145,106,0.04);
}

html[data-system-theme="light"] .ios-device .mob-ai-quote-area {
  background: rgba(232,145,106,0.04);
}

.ios-device .mob-ai-quote-label {
  font-size: 10px;
  color: var(--mob-accent);
  font-weight: 600;
  letter-spacing: 0.04em;
  margin-bottom: 5px;
}

.ios-device .mob-ai-quote-text {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--mob-text);
  max-height: 28dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* 对话区 */
.ios-device .mob-ai-chat-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  transition: padding-bottom 0.2s;
}

/* 消息 */
.ios-device .mob-ai-msgs {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.ios-device .mob-ai-msg {
  font-size: 14px !important;
  line-height: 1.65 !important;
  padding: 10px 14px !important;
  border-radius: 16px !important;
  border: none !important;
}

.ios-device .mob-ai-msg.user {
  background: var(--mob-accent) !important;
  color: #fff !important;
  border-bottom-right-radius: 4px !important;
}

.ios-device .mob-ai-msg.ai {
  background: rgba(128,128,128,0.10) !important;
  color: var(--mob-text) !important;
  border-bottom-left-radius: 4px !important;
}

html[data-system-theme="light"] .ios-device .mob-ai-msg.ai {
  background: #f2f2f2 !important;
}

/* 头部 */
.ios-device .mob-ai-head {
  padding-top: calc(var(--mob-safe-t) + 10px) !important;
  padding-bottom: 10px !important;
  border-bottom: 0.5px solid var(--mob-border) !important;
  background: var(--mob-bg) !important;
}

html[data-system-theme="light"] .ios-device .mob-ai-head {
  background: #fff !important;
}

/* 输入行 */
.ios-device .mob-ai-input-row {
  padding: 8px 12px !important;
  padding-bottom: max(12px, var(--mob-safe-b)) !important;
  border-top: 0.5px solid var(--mob-border) !important;
  background: var(--mob-bg) !important;
  align-items: flex-end;
}

html[data-system-theme="light"] .ios-device .mob-ai-input-row {
  background: #fff !important;
}

.ios-device .mob-ai-inp {
  background: rgba(128,128,128,0.08) !important;
  border: none !important;
  border-radius: 20px !important;
  font-size: 14px !important;
}

html[data-system-theme="light"] .ios-device .mob-ai-inp {
  background: #f2f2f2 !important;
}

.ios-device .mob-ai-send {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
}
/* ═══════════════════════════════════════════════════════════
   mobile/me.css — 「我」页面样式
   ═══════════════════════════════════════════════════════════ */

/* ── 页面布局 ─────────────────────────────────────────────── */
.me-page {
  min-height: 100dvh;
  background: var(--mob-bg);
  padding-bottom: calc(var(--mob-bar-h) + var(--mob-safe-b) + 20px);
}

/* ── 顶部用户区 ──────────────────────────────────────────── */
.me-header {
  padding: calc(var(--mob-safe-t) + 20px) 20px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 0.5px solid var(--mob-border);
}

.me-avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--mob-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}

.me-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.me-avatar-icon {
  font-size: 28px;
  color: #fff;
}

.me-name {
  font-size: 17px;
  font-weight: 600;
  color: var(--mob-text);
}

.me-sub {
  font-size: 12px;
  color: var(--mob-text-muted);
  margin-top: 2px;
}

/* ── 统计卡片行 ──────────────────────────────────────────── */
.me-stats {
  display: flex;
  margin: 16px 16px;
  background: var(--mob-bg-card);
  border-radius: var(--mob-radius-lg);
  overflow: hidden;
  border: 0.5px solid var(--mob-border);
}

.me-stat-item {
  flex: 1;
  padding: 14px 8px;
  text-align: center;
  cursor: pointer;
  transition: background 0.12s;
  border-right: 0.5px solid var(--mob-border);
}

.me-stat-item:last-child {
  border-right: none;
}

.me-stat-item:active {
  background: rgba(128,128,128,0.08);
}

.me-stat-num {
  font-size: 20px;
  font-weight: 700;
  color: var(--mob-text);
  line-height: 1.2;
}

.me-stat-label {
  font-size: 11px;
  color: var(--mob-text-muted);
  margin-top: 3px;
}

/* ── 菜单列表 ─────────────────────────────────────────────── */
.me-section {
  margin: 0 16px 12px;
  background: var(--mob-bg-card);
  border-radius: var(--mob-radius-lg);
  border: 0.5px solid var(--mob-border);
  overflow: hidden;
}

html[data-system-theme="light"] .me-section {
  background: #fff;
  border-color: rgba(0,0,0,0.06);
}

.me-section-title {
  font-size: 12px;
  color: var(--mob-text-muted);
  padding: 12px 16px 6px;
  font-weight: 500;
  letter-spacing: 0.03em;
}

.me-row {
  display: flex;
  align-items: center;
  padding: 14px 16px;
  gap: 12px;
  cursor: pointer;
  border-bottom: 0.5px solid var(--mob-border);
  transition: background 0.12s;
  text-decoration: none;
  color: inherit;
}

.me-row:last-child {
  border-bottom: none;
}

.me-row:active {
  background: rgba(128,128,128,0.06);
}

.me-row-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(128,128,128,0.08);
}

.me-row-icon svg {
  width: 17px;
  height: 17px;
  stroke-width: 1.7;
  color: var(--mob-text-sub);
}

/* 桃色强调icon */
.me-row-icon.accent {
  background: rgba(232,145,106,0.12);
}

.me-row-icon.accent svg {
  color: var(--mob-accent);
}

.me-row-label {
  flex: 1;
  font-size: 15px;
  color: var(--mob-text);
  font-weight: 400;
}

.me-row-meta {
  font-size: 13px;
  color: var(--mob-text-muted);
}

.me-row-arrow {
  width: 14px;
  height: 14px;
  color: var(--mob-text-muted);
  flex-shrink: 0;
}
