/* ==================================================================
   mindmap5.3 · ui.css —— 菜单栏 / 面板 / 编辑器 / 对话框 / 上下文菜单
   trial-05：公共控件显式消费原型 UI 令牌；科技卡片及其预览隔离旧令牌。
   ================================================================== */

/* ================= 顶部菜单栏 ================= */
#menubar {
  display: flex; align-items: center; gap: 4px;
  background: var(--ui-panel);
  border-bottom: 1px solid var(--ui-border);
  backdrop-filter: blur(10px);
  padding: 0 12px;
}
.mb-title {
  flex: none;
  display: inline-flex; align-items: center; gap: 8px;
  margin: 0 8px 0 0;
  white-space: nowrap;
}
.mb-logo-wrap {
  position: relative; flex: none;
  width: 28px; height: 28px;
}
.mb-logo {
  position: absolute; inset: 0;
  width: 28px; height: 28px;
  display: block; object-fit: contain;
  pointer-events: none;
}
.mb-logo-dark { display: none; }
html[data-theme="dark"] .mb-logo-light { display: none; }
html[data-theme="dark"] .mb-logo-dark { display: block; }
.mb-title-text {
  font-weight: 800; font-size: 14.5px; letter-spacing: .04em;
  background: linear-gradient(92deg, var(--ui-text) 10%, color-mix(in srgb, var(--ui-accent) 70%, #fff) 90%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.mb-item {
  position: relative;
  appearance: none; border: 0; background: transparent; color: var(--ui-text);
  font: 600 13px/1 var(--ui-font); letter-spacing: .04em;
  padding: 8px 12px; border-radius: var(--ui-button-radius); cursor: pointer;
}
.mb-item:hover, .mb-item.open { background: var(--ui-hover-bg); color: var(--ui-text); }
/* 系统菜单确认就绪后只收起通用入口；保存状态和区域工具仍留在应用内。 */
html[data-native-menu="ready"] #menubar [data-app-menu="file"],
html[data-native-menu="ready"] #menubar .mb-burger,
html[data-native-menu="ready"] #map-library-trigger,
html[data-native-menu="ready"] #menubar [data-shell-view="help"] { display: none; }
.mb-item.mb-action[aria-pressed="true"] {
  color: var(--ui-accent);
  background: var(--ui-hover-bg);
}
.mb-item.mb-action:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.mb-spacer { flex: 1; }
.mb-hint { font-size: 11.5px; color: var(--ui-muted); letter-spacing: .06em; white-space: nowrap; }
.mb-burger { display: none; }
.mb-reader-toggle {
  min-width: 0; max-width: min(260px, 24vw); height: 34px; flex: 0 1 auto;
  display: inline-flex; align-items: center; gap: 7px; padding: 0 11px;
  appearance: none; border: 1px solid var(--ui-border); border-radius: var(--ui-button-radius);
  color: var(--ui-text); background: var(--ui-panel); cursor: pointer;
  font: 650 12px/1 var(--ui-font); letter-spacing: .02em;
  transition: color var(--ui-motion-fast), border-color var(--ui-motion-fast), background var(--ui-motion-fast), box-shadow var(--ui-motion-fast);
}
.mb-reader-toggle:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.mb-reader-toggle:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.mb-reader-toggle[aria-pressed="true"] {
  color: #fff; border-color: transparent;
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent));
  box-shadow: 0 5px 18px -10px color-mix(in srgb, var(--ui-accent) 80%, transparent);
}
.mb-reader-icon { flex: none; font-size: 14px; line-height: 1; }
.mb-reader-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-multi-toggle {
  height: 34px; flex: none; padding: 0 13px;
  appearance: none; border: 1px solid var(--ui-border); border-radius: var(--ui-button-radius);
  color: var(--ui-text); background: var(--ui-panel); cursor: pointer;
  font: 700 12px/1 var(--ui-font);
  transition: color var(--ui-motion-fast), border-color var(--ui-motion-fast), background var(--ui-motion-fast), box-shadow var(--ui-motion-fast);
}
.mb-multi-toggle:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.mb-multi-toggle:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.mb-multi-toggle.on {
  color: #fff; border-color: transparent;
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent));
  box-shadow: 0 5px 18px -10px color-mix(in srgb, var(--ui-accent) 80%, transparent);
}

/* 下拉菜单 */
.dropdown {
  position: fixed; z-index: var(--z-ctxmenu);
  min-width: 218px;
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: 12px; box-shadow: var(--ui-shadow);
  backdrop-filter: blur(14px);
  padding: 6px; display: none;
}
.dropdown.show { display: block; }
.dropdown .di {
  display: flex; align-items: center; gap: 10px; width: 100%;
  appearance: none; border: 0; background: transparent; color: var(--ui-text);
  font: 500 13px/1 var(--ui-font); text-align: left;
  padding: 9px 10px; border-radius: 8px; cursor: pointer;
}
.dropdown .di:hover { background: var(--ui-hover-bg); color: var(--ui-text); }
.dropdown .di .sc { margin-left: auto; font-size: 10.5px; color: var(--ui-muted); font-family: var(--ui-font-mono); }
.dropdown .di.danger { color: var(--ui-danger); }
.dropdown .sep { height: 1px; margin: 5px 8px; background: var(--ui-border); }

/* ================= Dock / 缩放条 / 浮层面板 ================= */
/* 桌面隐藏 Dock（MiniMap 常驻、TWEAKS 走左侧工具栏）；手机仍用右下角按钮。 */
#dock {
  position: fixed; right: 16px; bottom: 16px; z-index: var(--z-panel);
  display: flex; gap: 8px;
}
#dock button {
  appearance: none; border: 1px solid var(--ui-border);
  background: var(--ui-panel); backdrop-filter: blur(10px);
  color: var(--ui-text); width: 42px; height: 42px; border-radius: 13px;
  font-size: 17px; line-height: 1; cursor: pointer;
  box-shadow: 0 8px 22px -10px rgba(0,0,0,.55);
  transition: border-color var(--ui-motion-fast), color var(--ui-motion-fast), transform var(--ui-motion-fast);
}
#dock button:hover { color: var(--ui-text); border-color: var(--ui-accent); transform: translateY(-2px); }
#dock button.on {
  color: #fff; border-color: transparent;
  background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent));
}
#dock button[data-dock="zoom"] { display: none; }

#zoompop {
  position: fixed; left: clamp(0px, 16px, calc(100vw - var(--reader-right-inset) - 88px)); bottom: 16px; z-index: var(--z-panel);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: 14px; padding: 9px 8px 11px; backdrop-filter: blur(10px);
  box-shadow: var(--ui-shadow);
}
#zoompop.show { display: flex; }
@media (min-width: 901px) {
  #dock { display: none; }
  /* 桌面隐藏旧浮层；缩放由左工具栏刻度竖条与滚轮控制。 */
  #zoompop { display: none; }
  #zoompop.show { display: none; }
}
.zoom-scale-value {
  min-width: 46px; color: var(--ui-text); text-align: center;
  font: 700 11px/1 var(--ui-font-mono); letter-spacing: .02em;
}
.zoom-scale-control { position: relative; width: 70px; height: 133px; }
.zoom-scale-input {
  position: absolute; left: 0; top: 3px; width: 24px; height: 127px; margin: 0;
  writing-mode: vertical-lr; direction: rtl; accent-color: var(--ui-accent); cursor: pointer;
}
.zoom-scale-input:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; border-radius: 8px; }
.zoom-scale-ticks { position: absolute; left: 29px; top: 11px; width: 41px; height: 111px; pointer-events: none; }
.zoom-scale-ticks span {
  position: absolute; top: var(--tick-pos); left: 0; transform: translateY(-50%);
  color: var(--ui-muted); font: 600 10px/1 var(--ui-font-mono); white-space: nowrap;
}
.zoom-scale-ticks span::before {
  content: ""; display: inline-block; width: 6px; height: 1px; margin: 0 4px 3px 0;
  background: var(--ui-border);
}
body.reader-only #zoompop,
body.reader-mode-reader-only #zoompop { display: none !important; }
/* 桌面批量模式同样不得露出缩放条（与常驻 display:none 双保险）。 */
@media (min-width: 901px) {
  body.batch-mode #zoompop { display: none !important; }
}

.panel {
  position: fixed; right: 16px; bottom: 72px; z-index: var(--z-panel);
  width: min(252px, calc(100vw - var(--reader-right-inset))); max-height: min(70vh, 560px);
  display: none; flex-direction: column;
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: var(--ui-panel-radius); box-shadow: var(--ui-shadow);
  backdrop-filter: blur(12px);
  overflow: hidden;
}
.panel.open { display: flex; }

.panel-head {
  display: flex; align-items: center; gap: 8px; flex: none;
  padding: 10px 12px; cursor: pointer; user-select: none;
}
.panel-head .ph-title {
  font-size: 11.5px; font-weight: 800; letter-spacing: .18em; color: var(--ui-muted);
  flex: 1; white-space: nowrap; overflow: hidden;
}
.panel-head .ph-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ui-accent); box-shadow: 0 0 8px var(--ui-accent); }
.panel-head .ph-btn {
  appearance: none; border: 1px solid var(--ui-border); background: var(--ui-panel);
  color: var(--ui-muted); width: 22px; height: 22px; border-radius: 7px;
  font-size: 11px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.panel-head .ph-btn:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.panel-body { padding: 4px 12px 12px; border-top: 1px solid var(--ui-border); overflow: auto; }

/* TWEAKS 控件 */
.tk-group { margin-top: 10px; }
.tk-label { font-size: 10.5px; letter-spacing: .14em; color: var(--ui-muted); margin-bottom: 6px; font-weight: 700; }
.seg { display: flex; border: 1px solid var(--ui-border); border-radius: 9px; overflow: hidden; background: var(--ui-input-bg); }
.seg button {
  flex: 1; appearance: none; border: 0; background: transparent; color: var(--ui-muted);
  font: 600 11.5px/1 var(--ui-font); padding: 7px 2px; cursor: pointer; letter-spacing: .04em;
}
.seg button.on { color: #fff; background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent)); }
html[data-theme="light"] .seg button.on { color: #fff; }
.layout-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
#panel-tweaks #tk-layout-mode, #panel-tweaks #tk-color { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.layout-grid button {
  appearance: none; border: 1px solid var(--ui-border); background: var(--ui-input-bg); color: var(--ui-text);
  font: 700 10px/1.2 var(--ui-font); padding: 7px 3px; border-radius: 9px; cursor: pointer; text-align: center;
  letter-spacing: .02em;
}
.layout-grid button small { display: block; color: var(--ui-muted); font-weight: 500; font-size: 8.5px; margin-top: 3px; letter-spacing: .02em; }
.layout-grid button.on { border-color: var(--ui-accent); color: var(--ui-text); background: var(--ui-accent-soft); box-shadow: 0 0 0 1px var(--ui-accent) inset; }
.bg-presets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.bg-option {
  min-width: 0; appearance: none; display: flex; align-items: center; gap: 5px;
  padding: 6px 5px; border: 1px solid var(--ui-border); border-radius: 9px;
  background: var(--ui-input-bg); color: var(--ui-muted); cursor: pointer;
  font: 650 9.5px/1 var(--ui-font); white-space: nowrap;
}
.bg-option:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.bg-option.on { color: var(--ui-text); border-color: var(--ui-accent); box-shadow: inset 0 0 0 1px var(--ui-accent); }
.bg-swatch {
  width: 16px; height: 16px; flex: none; border-radius: 5px;
  background: var(--tk-bg); border: 1px solid rgba(127, 140, 165, .36);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.bg-option[data-v="theme"] { --tk-bg: linear-gradient(135deg, #081020 0 48%, #f6fafe 52% 100%); }
.bg-option[data-v="white"] { --tk-bg: var(--board-preset-white); }
.bg-option[data-v="gray"] { --tk-bg: var(--board-preset-gray); }
.bg-option[data-v="warm"] { --tk-bg: var(--board-preset-warm); }
.bg-option[data-v="blue"] { --tk-bg: var(--board-preset-blue); }
.bg-option[data-v="night"] { --tk-bg: var(--board-preset-night); }
.map-style-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.map-style-options button {
  display: flex; flex-direction: column; align-items: stretch; gap: 7px;
  min-width: 0; min-height: 44px; padding: 8px;
  border: 1px solid var(--ui-border); border-radius: var(--ui-button-radius);
  background: var(--ui-input-bg); color: var(--ui-text); cursor: pointer;
  font: 650 12px/1.4 var(--ui-font); text-align: left;
}
.map-style-options button.on { border-color: var(--ui-accent); box-shadow: inset 0 0 0 1px var(--ui-accent); }
.map-style-options button:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.map-style-options small { display: block; color: var(--ui-muted); font: 500 10px/1.5 var(--ui-font); }
.map-style-sample {
  display: flex; flex-direction: column; gap: 4px; padding: 8px;
  border: 1px solid var(--accent-ui1); border-radius: 8px;
  background: var(--card-surface); box-shadow: 0 3px 9px color-mix(in srgb, var(--accent-ui1) 17%, transparent);
}
.map-style-sample i { width: 65%; height: 4px; background: linear-gradient(90deg, var(--text-0), var(--accent-ui1)); }
.map-style-sample b { width: 90%; height: 2px; background: var(--text-2); opacity: .5; }
.map-style-sample b:last-child { width: 73%; }
.map-style-options :is([data-v="elegant"], [data-v="ink"], [data-v="compact"], [data-v^="ribbon"]) .map-style-sample {
  background: var(--elegant-surface); border-color: var(--elegant-border);
  border-left: var(--elegant-accent-w) solid var(--ui-accent);
  border-radius: var(--elegant-tag-radius); box-shadow: var(--elegant-shadow);
}
.map-style-options :is([data-v="elegant"], [data-v="ink"], [data-v="compact"], [data-v^="ribbon"]) .map-style-sample i { background: var(--ui-text); }
.switchrow { display: flex; align-items: center; justify-content: space-between; padding: 5px 0; }
.switchrow span { font-size: 12px; color: var(--ui-text); }
.sw { position: relative; width: 34px; height: 19px; border-radius: 999px; background: var(--ui-input-bg); border: 1px solid var(--ui-border); cursor: pointer; transition: background var(--ui-motion-fast); flex: none; }
.sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; border-radius: 50%; background: var(--ui-muted); transition: all var(--ui-motion-fast); }
.sw.on { background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent)); border-color: transparent; }
.sw.on::after { left: 17px; background: #fff; }

/* MiniMap：贴脑图左侧，底部沿用桌面与移动端各自的避让规则。 */
#panel-minimap { left: max(16px, env(safe-area-inset-left)); right: auto; }
#minimap-canvas { width: 100%; height: 150px; display: block; border-radius: 9px; cursor: pointer; background: var(--ui-input-bg); }
.mm-tip { font-size: 10px; color: var(--ui-muted); text-align: center; margin-top: 6px; letter-spacing: .08em; }

@media (min-width: 901px) {
  /* MiniMap 常驻导图左下；保留底部间距和阅读分屏宽度约束。 */
  #panel-minimap {
    display: flex;
    bottom: 16px;
    width: min(100px, calc(100vw - var(--reader-right-inset) - 32px));
    max-height: none;
  }
  /* 桌面多选栏与 MiniMap 并排，不再把 MiniMap 抬到条上方。 */
  body.batch-mode #panel-minimap {
    bottom: 16px;
  }
  html.platform-ios #panel-minimap {
    bottom: calc(74px + env(safe-area-inset-bottom));
  }
  html.platform-ios body.batch-mode #panel-minimap {
    bottom: 16px;
  }
  #panel-minimap .panel-head {
    padding: 5px 8px 2px; cursor: default;
  }
  #panel-minimap .ph-title { font-size: 9px; letter-spacing: .12em; }
  #panel-minimap .ph-dot { width: 5px; height: 5px; }
  #panel-minimap .ph-btn { display: none; }
  #panel-minimap .panel-body { padding: 0 8px 8px; border-top: 0; }
  #panel-minimap #minimap-canvas { height: 59px; border-radius: 8px; }
  #panel-minimap .mm-tip { display: none; }
}

/* ================= 节点编辑器 ================= */
#ed-modal, #ed-modal * { box-sizing: border-box; }
.modal-mask {
  position: fixed; inset: 0; z-index: var(--z-modal);
  display: none; align-items: center; justify-content: center;
  padding: 24px;
  background: rgba(2, 6, 16, .62); backdrop-filter: blur(6px);
}
.modal-mask.show { display: flex; }
.modal {
  width: min(var(--editor-max-w), calc(100vw - 48px));
  height: min(var(--editor-max-h), 860px);
  min-height: min(520px, 90dvh); overflow: hidden;
  display: flex; flex-direction: column;
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: var(--ui-dialog-radius); box-shadow: var(--ui-shadow);
  backdrop-filter: blur(18px);
}
.modal-head {
  min-height: 64px; display: flex; align-items: center; gap: 16px;
  padding: 10px 18px; flex: none;
}
.modal-heading { min-width: 0; flex: 1; }
.modal-heading h2 { margin: 0; color: var(--ui-text); font-size: 16px; line-height: 1.35; letter-spacing: .03em; }
.modal-heading p { margin: 3px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.4; }
.modal-x {
  appearance: none; border: 1px solid var(--ui-border); background: var(--ui-panel); color: var(--ui-muted);
  width: 36px; height: 36px; border-radius: var(--ui-button-radius); cursor: pointer; flex: none;
}
.modal-x:hover { color: var(--ui-text); border-color: var(--ui-accent); }

.ed-tabs {
  height: 44px; display: flex; gap: 18px; align-items: stretch;
  padding: 0 18px; border-bottom: 1px solid var(--ui-border); flex: none;
}
.ed-tab {
  position: relative; appearance: none; border: 0; background: transparent;
  color: var(--ui-muted); font: 700 13px/1 var(--ui-font); padding: 0 2px; cursor: pointer;
}
.ed-tab::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  border-radius: 2px 2px 0 0; background: transparent;
}
.ed-tab.on { color: var(--ui-text); }
.ed-tab.on::after { background: var(--ui-accent); }

.ed-body {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  padding: 20px; scroll-padding: 20px;
}
.ed-workspace {
  display: grid; grid-template-columns: minmax(0, 1fr) var(--editor-preview-w);
  gap: var(--editor-gap); min-width: 0; outline: 0;
}
.ed-main { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.ed-foot {
  min-height: 64px; display: flex; gap: 10px; justify-content: flex-end; align-items: center;
  padding: 10px 18px; border-top: 1px solid var(--ui-border); flex: none;
  background: color-mix(in srgb, var(--ui-panel) 94%, transparent);
}

.ed-discard-layer {
  position: absolute; inset: 0; z-index: 2; display: grid; place-items: center;
  padding: 20px; background: rgba(2, 6, 16, .62); backdrop-filter: blur(5px);
}
.ed-discard-layer[hidden] { display: none; }
.ed-discard-dialog {
  width: min(420px, 100%); padding: 20px;
  border: 1px solid var(--ui-border); border-radius: 14px;
  background: var(--ui-panel); box-shadow: var(--ui-shadow);
}
.ed-discard-dialog h3 { margin: 0; color: var(--ui-text); font-size: 16px; line-height: 1.4; }
.ed-discard-dialog p { margin: 7px 0 18px; color: var(--ui-text); font-size: 13px; line-height: 1.6; }
.ed-discard-actions { display: flex; justify-content: flex-end; gap: 10px; }

.btn {
  min-height: var(--editor-control-h); appearance: none;
  border: 1px solid var(--ui-border); background: var(--ui-panel); color: var(--ui-text);
  font: 650 12.5px/1.2 var(--ui-font); padding: 8px 14px;
  border-radius: var(--ui-button-radius); cursor: pointer; white-space: nowrap;
  transition: border-color var(--ui-motion-fast), color var(--ui-motion-fast), transform var(--ui-motion-fast), background var(--ui-motion-fast);
}
.btn:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.btn:active { transform: scale(.98); }
.btn.primary { color: #fff; background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent)); border-color: transparent; }
.btn.danger { color: var(--ui-danger); border-color: color-mix(in srgb, var(--ui-danger) 45%, transparent); }
.btn.sm { min-height: 30px; padding: 5px 10px; font-size: 11.5px; }

.sr-only {
  position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important;
  margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
.tinput, textarea.tinput, select.tinput {
  width: 100%; min-width: 0; appearance: none;
  background: var(--ui-input-bg); border: 1px solid var(--ui-input-border); border-radius: var(--ui-button-radius);
  color: var(--ui-text); font: 500 13px/1.5 var(--ui-font); padding: 9px 11px; outline: none;
}
.tinput:focus-visible, .btn:focus-visible, .modal-x:focus-visible, .ed-tab:focus-visible,
.ed-icon-btn:focus-visible, .tagchip button:focus-visible, .sw-c:focus-visible,
.accent-auto:focus-visible, .ed-preview-toggle:focus-visible, input[type="range"]:focus-visible {
  outline: 2px solid var(--ui-accent); outline-offset: 2px;
}
.tinput:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ui-accent) 24%, transparent); }
textarea.tinput { resize: vertical; min-height: 96px; font-size: 13.5px; line-height: 1.65; }
[data-f="title"] { font-size: 15px; padding: 11px 13px; font-weight: 700; }
[data-f="note"] { min-height: 118px; }
.ed-label { display: block; margin: 0 0 6px; color: var(--ui-text); font-size: 12px; font-weight: 650; }

.ed-section {
  min-width: 0; padding: 16px;
  border: 1px solid var(--ui-border); border-radius: 12px;
  background: var(--ui-bg);
}
.ed-section-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.ed-section h3 { margin: 0; color: var(--ui-text); font-size: 13.5px; line-height: 1.35; letter-spacing: .02em; }
.ed-section p { margin: 3px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.55; }

/* 实时预览 */
.ed-preview-pane {
  min-width: 0; position: sticky; top: 0; align-self: start;
  overflow: hidden; border: 1px solid var(--ui-border); border-radius: 12px;
  background: var(--ui-panel);
}
.ed-preview-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--ui-border); }
.ed-preview-head > div { min-width: 0; flex: 1; }
.ed-preview-head strong { display: block; color: var(--ui-text); font-size: 12.5px; }
.ed-preview-head span { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 10.5px; line-height: 1.4; }
.ed-preview-toggle { display: none; appearance: none; border: 0; background: transparent; color: var(--ui-accent); font: 650 12px/1 var(--ui-font); cursor: pointer; }
.ed-preview-canvas {
  min-height: 300px; display: flex; align-items: center; justify-content: center;
  padding: 12px; overflow: hidden; pointer-events: none;
  background: var(--board-grid), var(--board-bg-active);
}
.ed-preview-mount { width: 100%; min-width: 0; display: flex; justify-content: center; align-items: center; }
.ed-preview-mount .ic-card { position: relative !important; left: auto !important; top: auto !important; max-width: 100% !important; }
.ed-preview-mount .editor-preview-card { box-sizing: border-box; }
.ed-preview-error { margin: 0; color: var(--ui-danger); font-size: 12px; }

/* 内容片段 */
.item-list { display: flex; flex-direction: column; gap: 10px; }
.item-row {
  min-width: 0; padding: 10px;
  border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-input-bg);
  transition: opacity var(--ui-motion-fast), border-color var(--ui-motion-fast);
}
.item-row.is-dragging { opacity: .55; border-color: var(--ui-accent); }
.item-row-head { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
.item-row-head select { flex: 1; width: auto; }
.item-row .grow { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.item-row .ops { display: flex; gap: 5px; flex: none; }
.ed-icon-btn {
  width: 36px; height: 36px; flex: none; appearance: none;
  border: 1px solid var(--ui-border); border-radius: 8px;
  background: var(--ui-panel); color: var(--ui-muted); font: 700 13px/1 var(--ui-font); cursor: pointer;
}
.ed-icon-btn:hover { color: var(--ui-text); border-color: var(--ui-accent); }
.ed-icon-btn.del:hover { color: var(--ui-danger); border-color: var(--ui-danger); }
.ed-icon-btn:disabled { cursor: not-allowed; opacity: .34; }
.ed-icon-btn.drag { cursor: grab; letter-spacing: -3px; padding-right: 5px; }
.ed-icon-btn.drag:active { cursor: grabbing; }
.item-tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.item-tools .btn { width: 100%; }
.ed-empty { padding: 16px; border: 1px dashed var(--ui-input-border); border-radius: 10px; text-align: center; background: var(--ui-input-bg); }
.ed-empty strong { color: var(--ui-text); font-size: 13px; }
.ed-empty p { max-width: 42ch; margin: 5px auto 0; }
.image-fields { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: end; }
.image-caption { min-width: 0; }
.image-preview { display: flex; flex-wrap: wrap; gap: 8px; }
.field-error { min-height: 18px; color: var(--ui-danger) !important; }

/* 标签编辑 */
.tagline { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.tagchip {
  display: inline-flex; align-items: stretch; overflow: hidden;
  color: var(--t-c); background: color-mix(in srgb, var(--t-c) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--t-c) 52%, transparent); border-radius: 999px;
}
.tagchip button { appearance: none; border: 0; background: transparent; color: inherit; cursor: pointer; }
.tag-color { display: inline-flex; align-items: center; gap: 6px; padding: 6px 7px 6px 10px; font: 650 11.5px/1 var(--ui-font); }
.tag-color i { width: 5px; height: 5px; border-radius: 50%; background: var(--t-c); }
.tag-delete { width: 28px; padding: 0 7px 0 4px; opacity: .7; font-size: 10px; }
.tag-delete:hover { opacity: 1; }
.tag-add { display: flex; gap: 8px; margin-top: 10px; }
.tag-add .tinput { flex: 1; width: auto; }
.tag-empty { margin: 0 !important; }

/* 样式设计 */
.accent-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.accent-field legend { margin-bottom: 8px; color: var(--ui-text); font-size: 12px; font-weight: 650; }
.accent-auto {
  width: 100%; min-height: 48px; display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; margin-bottom: 10px; text-align: left;
  appearance: none; border: 1px solid var(--ui-border); border-radius: 10px;
  background: var(--ui-input-bg); color: var(--ui-text); cursor: pointer;
}
.accent-auto.on { border-color: var(--ui-accent); box-shadow: inset 0 0 0 1px var(--ui-accent); }
.accent-auto .auto-mark {
  width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px;
  color: #fff; font: 800 11px/1 var(--ui-font); background: conic-gradient(#ef4444, #facc15, #22c55e, #06b6d4, #3b82f6, #a855f7, #ef4444);
}
.accent-auto strong, .accent-auto small { display: block; }
.accent-auto strong { color: var(--ui-text); font-size: 12px; }
.accent-auto small { margin-top: 2px; color: var(--ui-muted); font-size: 10.5px; }
.swatches { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; }
.sw-c {
  aspect-ratio: 1; min-width: 0; appearance: none; border: 2px solid transparent; border-radius: 7px;
  background: var(--swatch); cursor: pointer;
}
.sw-c.on { border-color: var(--ui-text); box-shadow: 0 0 0 2px var(--ui-accent); }
.range-field { margin-top: 16px; }
.range-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.range-meta label { color: var(--ui-text); font-size: 12px; font-weight: 650; }
.range-meta output { margin-left: auto; color: var(--ui-muted); font: 600 11.5px/1 var(--ui-font-mono); }
.range-field input[type="range"] { width: 100%; margin: 0; accent-color: var(--ui-accent); cursor: pointer; }
.gradient-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.color-control { display: flex; align-items: center; gap: 9px; min-width: 0; }
.color-control label { flex: 1; color: var(--ui-text); font-size: 12px; font-weight: 650; }
.color-control input[type="color"] {
  width: 48px; height: 36px; padding: 3px; flex: none; cursor: pointer;
  border: 1px solid var(--ui-input-border); border-radius: 8px; background: var(--ui-input-bg);
}
.ed-reset-section { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ed-reset-section p { margin-bottom: 0; }

/* ================= 对话框（合并/关系标签等小模态） ================= */
.dialog {
  width: min(430px, 94vw);
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: 14px; box-shadow: var(--ui-shadow); backdrop-filter: blur(16px);
}
.dialog .dg-body { padding: 16px; }
.dialog .dg-foot { display: flex; gap: 10px; justify-content: flex-end; padding: 0 16px 16px; }
.dg-title { font-size: 14px; font-weight: 800; letter-spacing: .08em; margin-bottom: 12px; }
.dg-row { margin-bottom: 12px; }
.pick-list { max-height: 200px; overflow: auto; border: 1px solid var(--ui-border); border-radius: 10px; padding: 6px; }
.pick-list label { display: flex; gap: 9px; align-items: center; padding: 8px 9px; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ui-text); }
.pick-list label:hover { background: var(--ui-hover-bg); }
.pick-list input { accent-color: var(--ui-accent); }

/* ================= 右键菜单 ================= */
#ctxmenu { position: fixed; z-index: calc(var(--z-ctxmenu) + 1); }

/* ================= Toast ================= */
#toasts { position: fixed; top: calc(var(--menubar-h) + 12px); left: 50%; transform: translateX(-50%); z-index: var(--z-toast); display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.app-persistence-notice {
  position: fixed; z-index: var(--z-toast); top: calc(var(--menubar-h) + 12px); left: 50%;
  width: min(720px, calc(100vw - 32px)); transform: translateX(-50%); display: flex; align-items: center;
  justify-content: space-between; gap: 16px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--ui-danger) 50%, var(--ui-border));
  border-radius: var(--ui-panel-radius); color: var(--ui-text); background: color-mix(in srgb, var(--ui-panel) 96%, var(--ui-danger));
  box-shadow: var(--ui-shadow);
}
.app-persistence-copy { min-width: 0; display: grid; gap: 4px; }
.app-persistence-copy strong { color: var(--ui-danger); font-size: 13px; }
.app-persistence-copy span { color: var(--ui-text); font-size: 12px; line-height: 1.5; }
.app-persistence-actions { flex: none; display: flex; gap: 8px; }
.reader-sync-blocked-notice {
  position: fixed; z-index: var(--z-toast); left: 50%; bottom: 20px; transform: translateX(-50%);
  width: min(760px, calc(100vw - 32px)); display: grid; gap: 5px; padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--ui-danger) 52%, var(--ui-border));
  border-radius: var(--ui-panel-radius); color: var(--ui-text);
  background: color-mix(in srgb, var(--ui-panel) 96%, var(--ui-danger)); box-shadow: var(--ui-shadow);
}
.reader-sync-blocked-notice[hidden] { display: none; }
.reader-sync-blocked-notice strong { color: var(--ui-danger); font-size: 13px; }
.reader-sync-blocked-notice span { font-size: 12px; line-height: 1.55; }
.toast {
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  color: var(--ui-text); font-size: 12.5px; letter-spacing: .04em;
  padding: 9px 18px; border-radius: 999px; box-shadow: var(--ui-shadow);
  backdrop-filter: blur(10px);
  animation: toastIn .25s ease;
}
.toast.warn { border-color: color-mix(in srgb, var(--ui-danger) 55%, transparent); color: var(--ui-danger); }
@keyframes toastIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; } }

/* ================= Markdown 面板（阶段④） ================= */
#mdpanel {
  position: fixed; left: 0; top: var(--menubar-h); bottom: 0; z-index: var(--z-mdpanel);
  width: 380px; max-width: 92vw;
  background: var(--ui-panel); border-right: 1px solid var(--ui-border);
  backdrop-filter: blur(12px);
  display: flex; flex-direction: column;
  transform: translateX(-100%); transition: transform var(--anim);
}
/* 关闭态不得参与命中：右侧挂载时 translateX(100%) 会盖住大纲。 */
#mdpanel:not(.show) { visibility: hidden; pointer-events: none; }
#mdpanel.show { visibility: visible; pointer-events: auto; transform: translateX(0); }
#mdpanel .md-head {
  display: flex; align-items: center; gap: 8px; flex: none;
  box-sizing: border-box; height: var(--menubar-h); padding: 0 10px 0 14px;
  border-bottom: 1px solid var(--ui-border);
}
#mdpanel .md-head .t {
  flex: 1; min-width: 0;
  font: 750 13px/1 var(--ui-font); color: var(--ui-text);
  letter-spacing: 0;
}
#mdpanel .md-head .modal-x,
#mdpanel .md-head #md-close {
  width: 28px; height: 28px; padding: 0; border-radius: 8px;
  display: grid; place-items: center;
  font-size: 13px; line-height: 1;
}
#mdpanel .md-head .modal-x:hover,
#mdpanel .md-head #md-close:hover { background: var(--ui-hover-bg); }
#mdpanel .md-tools { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px 8px 14px; border-bottom: 1px solid var(--ui-border); flex: none; }
#mdpanel .md-tools .btn.sm {
  height: 26px; min-height: 26px; padding: 0 8px; border-radius: 8px;
  background: var(--ui-panel); color: var(--ui-text);
  font: 650 11.5px/1 var(--ui-font-mono);
}
#mdpanel .md-tools .btn.sm:hover { color: var(--ui-text); border-color: var(--ui-accent); background: var(--ui-hover-bg); }
#md-editor { flex: 1; min-height: 0; resize: none; border: 0; outline: none; background: transparent; color: var(--ui-text); font: 500 12.5px/1.7 var(--ui-font-mono); padding: 12px; }
#mdpanel .md-status {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px; row-gap: 6px;
  padding: 8px 10px; border-top: 1px solid var(--ui-border);
  color: var(--ui-muted); font: 500 11px/1.35 var(--ui-font);
  letter-spacing: 0; white-space: normal; overflow: visible; flex: none;
}
#mdpanel .md-status .btn {
  flex: none; height: 28px; min-height: 28px; padding: 0 8px;
  border-radius: 8px; background: var(--ui-panel); color: var(--ui-text);
  font: 650 12px/1 var(--ui-font);
}
#mdpanel .md-status .btn:hover { color: var(--ui-text); border-color: var(--ui-accent); background: var(--ui-hover-bg); }
#mdpanel .md-status .btn.on {
  color: var(--ui-text); background: var(--ui-accent-soft);
  border-color: color-mix(in srgb, var(--ui-accent) 45%, var(--ui-border));
}
#mdpanel .md-status .st { flex: none; margin-right: 4px; }
#mdpanel .md-status .stale { color: var(--rel-line); display: none; }
#mdpanel .md-status .stale.show { display: inline; }
#md-resizer { position: absolute; right: -4px; top: 0; bottom: 0; width: 8px; cursor: col-resize; }
#mdpanel:not(.show) #md-resizer { pointer-events: none; }

/* 就地编辑焦点态已在行内设置；这里兜底光标 */
.ic-card [contenteditable="true"] { cursor: text; }

/* ================= 移动端底部工具条 ================= */
#mobilebar {
  position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%);
  z-index: var(--z-batch); display: none;
  background: var(--ui-panel); border: 1px solid var(--ui-border);
  border-radius: 999px; box-shadow: var(--ui-shadow); backdrop-filter: blur(12px);
  padding: 6px; gap: 4px;
}
#mobilebar button {
  appearance: none; border: 0; background: transparent; color: var(--ui-text);
  width: var(--editor-touch-target); height: var(--editor-touch-target); border-radius: 50%; font-size: 17px; cursor: pointer;
}
#mobilebar button.on { background: var(--ui-accent-soft); color: var(--ui-text); }
#mobilebar button.mobile-multi-toggle { width: 48px; border-radius: 18px; font: 700 10.5px/1 var(--ui-font); }
#mobilebar button.mobile-multi-toggle.on {
  color: #fff; background: linear-gradient(135deg, var(--ui-accent), var(--ui-accent));
}

/* ================= 多选批量操作 ================= */
/* 桌面：一行玻璃胶囊，屏幕水平居中并压在阅读区上层（--z-batch > --z-reader），
   不随阅读区/大纲宽度挪位；仅给 MiniMap 留让位。
   手机：另套贴底实心栏，见 responsive.css，不是把这颗胶囊缩小。 */
.batch-dock, .batch-dock *, .batch-context-menu, .batch-context-menu *,
.batch-dialog-mask, .batch-dialog-mask *, .mm-color-tray, .mm-color-tray * { box-sizing: border-box; }

.mm-icon {
  width: var(--icon-size); height: var(--icon-size);
  display: block; flex: none; pointer-events: none;
}

.batch-dock {
  --batch-action: 36px;
  --chip-size: 20px;
  --minimap-reserve: 0px;
  position: fixed; z-index: var(--z-batch);
  left: 50%;
  bottom: 16px;
  width: max-content;
  max-width: min(var(--batch-dock-max-w), var(--dock-avail, calc(100vw - var(--minimap-reserve, 0px) - 24px)));
  min-height: var(--batch-dock-h);
  display: flex; flex-wrap: nowrap; align-items: center; gap: 8px;
  padding: 8px 10px; box-sizing: border-box;
  color: var(--ui-text); background: var(--ui-toolbar-bg);
  border: 1px solid var(--ui-border); border-radius: 16px;
  box-shadow: var(--ui-shadow), inset 0 1px 0 rgba(255, 255, 255, .22);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  opacity: 0; pointer-events: none; transform: translate(-50%, calc(100% + 28px));
  transition: opacity var(--ui-motion-fast), transform var(--ui-motion-fast);
  overflow: hidden;
}
.batch-dock.show { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.batch-dock.is-row { display: flex; flex-wrap: nowrap; }
.batch-dock.is-row > .batch-actions { order: 1; flex: none; }
.batch-dock.is-row > .batch-colors { order: 2; }
.batch-dock.is-row > .batch-exit { order: 3; }
.batch-dock.is-wrap {
  --batch-gap: 6px;
  --batch-tools-w: calc(6 * var(--batch-action) + 5 * var(--batch-gap));
  --chip-n: 8;
  --chip-gap: 5px;
  --chip-size: calc((var(--batch-tools-w) - (var(--chip-n) - 1) * var(--chip-gap)) / var(--chip-n));
  display: grid;
  grid-template-columns: 1fr var(--batch-tools-w) 1fr;
  align-items: center;
  column-gap: 8px;
  row-gap: 6px;
}
.batch-dock.is-wrap > .batch-colors {
  grid-column: 2; grid-row: 1;
  width: var(--batch-tools-w); height: var(--batch-action);
  justify-content: space-between; align-items: center; gap: var(--chip-gap);
}
.batch-dock.is-wrap > .batch-actions {
  grid-column: 2; grid-row: 2;
  width: var(--batch-tools-w); flex: none; gap: var(--batch-gap);
}
.batch-dock.is-wrap > .batch-exit {
  grid-column: 3; grid-row: 1; justify-self: end;
}
.batch-action.batch-count {
  cursor: default; pointer-events: none;
}
.batch-action.batch-count strong {
  color: inherit; font: 700 13px/1 var(--ui-font-mono); font-variant-numeric: tabular-nums;
}
.batch-actions {
  display: flex; flex-wrap: nowrap; align-items: center; gap: 6px;
  flex: none; min-width: 0;
}

.batch-colors {
  display: flex; flex-wrap: nowrap; align-items: center; gap: 5px; flex: none;
}
.batch-colors .mm-color-chip {
  width: var(--chip-size, 20px); height: var(--chip-size, 20px); border-radius: 6px;
}
.batch-colors .mm-color-tray-btn {
  width: var(--chip-size, 20px); height: var(--chip-size, 20px);
  min-width: 0; border-radius: 6px;
}
.batch-colors .mm-color-tray-btn .mm-icon { width: 12px; height: 12px; }
.mm-color-chip[hidden] { display: none !important; }
.mm-color-row.is-disabled, .mm-color-row[aria-disabled="true"] { opacity: .42; }
.mm-color-chip {
  width: 18px; height: 18px; padding: 0; appearance: none; cursor: pointer; flex: none;
  border: 1px solid rgba(127, 140, 165, .36); border-radius: 4px; background: var(--swatch);
  transition: transform var(--ui-motion-fast), box-shadow var(--ui-motion-fast);
}
.mm-color-chip.on { border-color: transparent; box-shadow: 0 0 0 2px var(--ui-accent); }
.mm-color-chip:hover:not(:disabled) { transform: scale(1.08); }
.mm-color-chip:disabled { cursor: default; }
.mm-color-tray-btn {
  width: 32px; height: 32px; padding: 0; flex: none;
  display: grid; place-items: center;
  appearance: none; border: 1px solid var(--ui-border); border-radius: 8px;
  background: var(--ui-panel); color: var(--ui-text); cursor: pointer;
}
.mm-color-tray-btn:hover { color: var(--ui-text); border-color: var(--ui-accent); background: var(--ui-hover-bg); }
.mm-color-tray-btn[aria-expanded="true"] { color: var(--ui-accent); border-color: var(--ui-accent); }
.mm-color-tray-btn:disabled { cursor: default; opacity: .42; }

.mm-color-tray {
  position: fixed; z-index: var(--z-color-tray); display: none;
  padding: var(--palette-padding); max-width: calc(100vw - 16px); overflow: auto;
  background: var(--ui-panel);
  border: 1px solid var(--ui-border); border-radius: 12px;
  box-shadow: var(--ui-shadow), inset 0 1px 0 rgba(255, 255, 255, .22);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
.mm-color-tray.show { display: block; }
.mm-color-tray-auto {
  width: 100%; min-height: 28px; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  margin-bottom: 8px; padding: 0 8px; appearance: none; cursor: pointer;
  border: 1px solid var(--ui-border); border-radius: 7px;
  background: var(--ui-input-bg); color: var(--ui-text); font: 650 10.5px/1 var(--ui-font);
}
.mm-color-tray-auto.on { color: var(--ui-text); border-color: var(--ui-accent); }
.mm-color-tray-auto:hover:not(:disabled) { border-color: var(--ui-accent); }
.mm-color-tray-auto-mark {
  width: 14px; height: 14px; display: grid; place-items: center; border-radius: 4px;
  background: conic-gradient(#ef4444, #facc15, #22c55e, #06b6d4, #3b82f6, #a855f7, #ef4444);
}
.mm-color-tray-grid { display: grid; grid-template-columns: repeat(var(--palette-columns), var(--palette-cell)); gap: var(--palette-gap); }
.mm-color-tray-grid .mm-color-chip { position: relative; width: var(--palette-cell); height: var(--palette-cell); }
.mm-color-tray-grid .mm-color-chip.on::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 4px;
  transform: translate(-50%, -65%) rotate(-45deg); border-left: 2px solid var(--swatch-ink); border-bottom: 2px solid var(--swatch-ink);
}

.batch-action {
  width: var(--batch-action, 36px); min-width: var(--batch-action, 36px);
  min-height: var(--batch-action, 36px); height: var(--batch-action, 36px); padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  appearance: none; border: 1px solid var(--ui-border); border-radius: 10px;
  background: var(--ui-panel); color: var(--ui-accent); cursor: pointer;
  transition: color var(--ui-motion-fast), border-color var(--ui-motion-fast), background var(--ui-motion-fast), opacity var(--ui-motion-fast), transform var(--ui-motion-fast);
}
.batch-action:hover { color: var(--ui-text); border-color: var(--ui-accent); background: var(--ui-hover-bg); }
.batch-action:active { transform: scale(.98); }
.batch-action.danger { color: var(--ui-danger); }
.batch-action[aria-disabled="true"],
.batch-action[aria-disabled="true"]:hover,
.batch-action[aria-disabled="true"]:active {
  opacity: .38; cursor: not-allowed; transform: none;
  border-color: var(--ui-border); background: var(--ui-panel);
}

.batch-exit {
  width: var(--batch-action, 36px); min-width: var(--batch-action, 36px);
  min-height: var(--batch-action, 36px); height: var(--batch-action, 36px); padding: 0; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  appearance: none; border: 1px solid var(--ui-border); border-radius: 999px;
  background: transparent; color: var(--ui-text); cursor: pointer;
  transition: color var(--ui-motion-fast), border-color var(--ui-motion-fast), background var(--ui-motion-fast), transform var(--ui-motion-fast);
}
.batch-exit:hover { color: var(--ui-text); border-color: var(--ui-accent); background: var(--ui-hover-bg); }
.batch-exit:active { transform: scale(.98); }
.batch-exit.on { color: var(--ui-accent); border-color: color-mix(in srgb, var(--ui-accent) 48%, transparent); }

@media (prefers-reduced-transparency: reduce) {
  .batch-dock, .mm-color-tray, .sel-quickbar {
    background: var(--ui-panel);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

body.batch-mode .ic-drag, body.batch-mode .ic-edit, body.batch-mode .ic-colw { display: none !important; }

.batch-action:focus-visible, .batch-exit:focus-visible, .batch-menu-item:focus-visible,
.batch-dialog-close:focus-visible, .batch-color-option input:focus-visible,
.batch-remove-tag input:focus-visible, .mm-color-chip:focus-visible,
.mm-color-tray-btn:focus-visible, .mm-color-tray button:focus-visible {
  outline: 2px solid var(--ui-accent); outline-offset: 2px;
}

/* 主节点双环与徽标均不占布局空间。 */
.ic-card.selected.selection-primary {
  outline: 2px solid var(--batch-primary); outline-offset: 4px;
}
.ic-card.selection-primary > .ic-title::after {
  content: "主"; position: absolute; z-index: 6; top: -10px; right: -10px;
  width: 24px; height: 20px; display: grid; place-items: center;
  border-radius: 999px; border: 2px solid var(--batch-bg);
  background: linear-gradient(135deg, var(--accent-ui1), var(--accent-ui2));
  color: #fff; -webkit-text-fill-color: #fff; background-clip: border-box; -webkit-background-clip: border-box;
  box-shadow: 0 5px 14px -6px rgba(0, 0, 0, .7); font: 800 10px/1 var(--font-ui);
  pointer-events: none;
}
.ic-card.summary-range-eligible:not(.selection-primary) {
  outline: 1px dashed color-mix(in srgb, var(--batch-summary) 72%, transparent); outline-offset: 2px;
}
.ic-card.summary-range-first { border-top-color: var(--batch-summary); }
.ic-card.summary-range-middle { border-inline-end-color: var(--batch-summary); }
.ic-card.summary-range-last { border-bottom-color: var(--batch-summary); }

/* 批量右键菜单 */
.batch-context-menu {
  position: fixed; z-index: var(--z-batch-menu); display: none;
  width: min(270px, calc(100vw - 16px)); padding: 6px;
  color: var(--ui-text); background: var(--batch-bg);
  border: 1px solid var(--batch-border); border-radius: 13px;
  box-shadow: var(--ui-shadow); backdrop-filter: blur(16px);
}
.batch-context-menu.show { display: block; }
.batch-menu-head { padding: 8px 9px 9px; border-bottom: 1px solid var(--ui-border); margin-bottom: 4px; }
.batch-menu-head strong, .batch-menu-head span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.batch-menu-head strong { color: var(--ui-text); font-size: 12px; }
.batch-menu-head span { margin-top: 3px; color: var(--ui-muted); font-size: 10.5px; }
.batch-menu-item {
  width: 100%; min-height: 48px; display: flex; align-items: center; gap: 9px;
  appearance: none; border: 0; border-radius: 9px; padding: 7px 9px;
  color: var(--ui-text); background: transparent; text-align: left; cursor: pointer;
}
.batch-menu-item:hover, .batch-menu-item:focus-visible { color: var(--ui-text); background: var(--ui-hover-bg); }
.batch-menu-item:disabled { cursor: not-allowed; opacity: .58; }
.batch-menu-item.danger { color: var(--ui-danger); }
.batch-menu-icon {
  width: 22px; flex: none; display: grid; place-items: center;
  color: var(--ui-accent);
}
.batch-menu-copy { min-width: 0; }
.batch-menu-copy strong, .batch-menu-copy small { display: block; }
.batch-menu-copy strong { font-size: 12px; }
.batch-menu-copy small { margin-top: 3px; color: var(--ui-muted); font-size: 10px; line-height: 1.35; }

/* 批量确认与标签对话框 */
.batch-dialog-mask { z-index: var(--z-batch-dialog); }
.batch-dialog {
  width: min(470px, calc(100vw - 32px)); max-height: min(720px, calc(100dvh - 32px));
  display: flex; flex-direction: column; overflow: hidden;
  color: var(--ui-text); background: var(--ui-panel);
  border: 1px solid var(--ui-border); border-radius: 15px;
  box-shadow: var(--ui-shadow); backdrop-filter: blur(18px);
}
.batch-dialog-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 16px 12px; }
.batch-dialog-head > div { min-width: 0; flex: 1; }
.batch-dialog-head h2 { margin: 0; color: var(--ui-text); font-size: 15px; line-height: 1.4; }
.batch-dialog-head p { margin: 5px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.55; }
.batch-dialog-close {
  width: 36px; height: 36px; flex: none; appearance: none;
  border: 1px solid var(--ui-border); border-radius: 9px;
  color: var(--ui-muted); background: var(--ui-panel); cursor: pointer;
}
.batch-dialog-body { min-height: 0; overflow-y: auto; padding: 0 16px 16px; }
.batch-dialog-foot { flex: none; display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--ui-border); }
.batch-dialog-foot .btn { min-width: 88px; }
.batch-danger-fill { color: #fff !important; border-color: transparent !important; background: var(--ui-danger) !important; }
.batch-info-block {
  padding: 12px; border: 1px solid var(--ui-border); border-radius: 10px;
  background: var(--ui-bg);
}
.batch-info-block p { margin: 0; color: var(--ui-text); font-size: 12px; line-height: 1.65; }
.batch-info-block p + p { margin-top: 5px; }
.batch-confirm-list { margin: 0; padding: 10px 12px 10px 30px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-bg); }
.batch-confirm-list li { padding: 3px 0; color: var(--ui-text); font-size: 12px; line-height: 1.5; }
.batch-field { margin-bottom: 16px; }
.batch-field-label { display: block; margin-bottom: 6px; color: var(--ui-text); font-size: 12px; font-weight: 650; }
.batch-tag-colors, .batch-remove-tags { min-width: 0; margin: 12px 0 0; padding: 0; border: 0; }
.batch-tag-colors legend, .batch-remove-tags legend { margin-bottom: 7px; color: var(--ui-text); font-size: 11.5px; font-weight: 650; }
.batch-tag-colors { display: flex; flex-wrap: wrap; gap: 7px; }
.batch-tag-colors legend { width: 100%; }
.batch-color-option {
  min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px;
  border: 1px solid var(--ui-border); border-radius: 999px; background: var(--ui-input-bg);
  color: var(--ui-text); font-size: 11.5px; cursor: pointer;
}
.batch-color-option input, .batch-remove-tag input { accent-color: var(--ui-accent); }
.batch-color-option i { width: 8px; height: 8px; border-radius: 50%; background: var(--t-c); box-shadow: 0 0 7px var(--t-c); }
.batch-remove-tags { display: flex; flex-direction: column; gap: 6px; }
.batch-remove-tag {
  min-height: 40px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px;
  padding: 7px 9px; border: 1px solid var(--ui-border); border-radius: 9px;
  background: var(--ui-input-bg); cursor: pointer;
}
.batch-remove-tag span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ui-text); font-size: 12px; }
.batch-remove-tag small { color: var(--ui-muted); font-size: 10px; white-space: nowrap; }
.batch-empty-note { margin: 0; padding: 10px; color: var(--ui-muted); background: var(--ui-input-bg); border-radius: 9px; font-size: 11.5px; }

/* Markdown 源码格式与图片插入控件 */
.ed-content-controls { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2,8px); margin-top:8px; }
.ed-content-controls label { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.ed-content-controls input[type="checkbox"] { width:auto; margin:0; }

/* ================= trial-05：原型公共控件视觉契约 =================
   所有变量在组件上显式消费；不重绑带科技预览的祖先旧变量。 */
.dropdown,.panel,.modal,.dialog,.toast,#mdpanel,.sel-quickbar,.batch-dock,
.batch-context-menu,.batch-dialog,.mm-color-tray,.ed-discard-dialog,
.app-persistence-notice,.reader-sync-blocked-notice {
  font-family:var(--ui-font); color:var(--ui-text); letter-spacing:0;
}
.dropdown {
  min-width:var(--ui-menu-min-w); padding:var(--ui-menu-padding);
  background:var(--ui-menu-bg); border-color:var(--ui-menu-border);
  border-radius:var(--ui-menu-radius); box-shadow:var(--ui-shadow); backdrop-filter:none;
}
.dropdown .di {
  min-height:var(--ui-control-h); gap:var(--ui-control-gap); padding:var(--ui-button-padding);
  font:var(--ui-weight-normal) var(--ui-font-control)/var(--ui-button-line-height) var(--ui-font);
  border-radius:var(--ui-button-radius); color:var(--ui-text);
}
.dropdown .di:hover:not(:disabled):not([aria-disabled="true"]) { color:var(--ui-hover-text); background:var(--ui-hover-bg); }
.dropdown .di:disabled,.dropdown .di[aria-disabled="true"] { opacity:var(--ui-disabled-opacity); cursor:not-allowed; }
.dropdown .di .sc { font:var(--ui-font-caption)/1.4 var(--ui-font-mono); color:var(--ui-muted); }
.dropdown .di.danger { color:var(--ui-danger); }
.dropdown .sep { margin:var(--ui-menu-separator-margin); background:var(--ui-border); }
.mobile-menu-group-label { padding:8px 11px 4px; font:var(--ui-weight-strong) var(--ui-font-caption)/1.5 var(--ui-font); color:var(--ui-muted); }
.panel,.dialog,.modal,.ed-discard-dialog { background:var(--ui-panel); border-color:var(--ui-border); box-shadow:var(--ui-shadow); backdrop-filter:none; }
.panel { border-radius:var(--ui-popover-radius); }
.panel-head { padding:10px 14px; gap:8px; }
.panel-head .ph-title { font:var(--ui-weight-strong) var(--ui-font-label)/1.5 var(--ui-font); color:var(--ui-text); letter-spacing:0; }
.panel-head .ph-dot { background:var(--ui-accent); box-shadow:none; }
.panel-head .ph-btn { width:var(--ui-icon-button-size); height:var(--ui-icon-button-size); border-color:transparent; background:transparent; border-radius:var(--ui-button-radius); }
.panel-head .ph-btn:hover { color:var(--ui-hover-text); background:var(--ui-hover-bg); border-color:transparent; }
.panel-body { padding:4px 14px 14px; border-color:var(--ui-border); }
.tk-group { margin-top:14px; }
.branch-style-field { display:grid; gap:6px; margin-top:10px; color:var(--ui-text); font-size:var(--ui-font-label); }
.branch-style-field select { width:100%; min-width:0; min-height:var(--editor-touch-target); padding:8px; font:inherit; color:var(--ui-text); background:var(--ui-input-bg); border:1px solid var(--ui-border); border-radius:var(--radius-btn); }
.branch-style-field select:disabled { opacity:.55; }
.branch-style-status { margin:8px 0 0; color:var(--ui-muted); font-size:var(--ui-font-caption); overflow-wrap:anywhere; }
.tk-label { font:var(--ui-weight-strong) var(--ui-font-label)/1.5 var(--ui-font); color:var(--ui-muted); letter-spacing:0; margin-bottom:8px; }
.seg { padding:2px; gap:2px; background:var(--ui-bg); border-color:var(--ui-border); border-radius:var(--ui-input-radius); }
.seg button { min-height:var(--ui-control-h); padding:6px 4px; border-radius:var(--ui-button-radius); font:var(--ui-font-label)/1.4 var(--ui-font); letter-spacing:0; }
.seg button.on,html[data-theme="light"] .seg button.on { color:var(--ui-pressed-text); background:var(--ui-pressed-bg); }
.layout-grid button,.bg-option,.map-style-options button {
  border-color:var(--ui-border); border-radius:var(--ui-input-radius); box-shadow:none;
  color:var(--ui-text); background:var(--ui-panel); font-family:var(--ui-font); font-weight:var(--ui-weight-normal); letter-spacing:0;
}
.layout-grid button { min-height:44px; font-size:var(--ui-font-label); line-height:1.4; }
.layout-grid button small { font-size:var(--ui-font-caption); color:var(--ui-muted); }
.bg-option { min-height:var(--ui-control-h); padding:7px 6px; font-size:var(--ui-font-caption); }
.layout-grid button.on,.bg-option.on,.map-style-options button.on { color:var(--ui-pressed-text); border-color:var(--ui-accent); background:var(--ui-pressed-bg); box-shadow:none; }
.map-style-options button { padding:10px; }
.map-style-options small { color:var(--ui-muted); font-size:var(--ui-font-caption); }
.map-style-options :is([data-v="elegant"], [data-v="ink"], [data-v="compact"], [data-v^="ribbon"]) .map-style-sample { border-radius:var(--elegant-radius); border-left-color:var(--ui-color-1); }
.map-style-options :is([data-v="elegant"], [data-v="ink"], [data-v="compact"], [data-v^="ribbon"]) .map-style-sample i { background:var(--ui-text); }
.switchrow { min-height:34px; gap:10px; }
.switchrow span { font:var(--ui-font-label)/1.5 var(--ui-font); color:var(--ui-text); }
.sw { background:var(--ui-bg); border-color:var(--ui-border); }
.sw::after { background:var(--ui-muted); }
.sw.on { background:var(--ui-accent); }.sw.on::after { background:var(--ui-primary-text); }
.mm-tip { font-family:var(--ui-font); color:var(--ui-muted); letter-spacing:0; }
.modal-mask,.ed-discard-layer,.batch-dialog-mask { background:var(--ui-scrim); backdrop-filter:none; }
.modal,.dialog,.ed-discard-dialog,.batch-dialog { border-radius:var(--ui-dialog-radius); }
.modal-head { padding:var(--ui-dialog-head-padding); gap:12px; border-bottom:1px solid var(--ui-border); }
.modal-heading h2 { font:var(--ui-weight-strong) 18px/1.5 var(--ui-font); color:var(--ui-text); letter-spacing:0; }
.modal-heading p { font:var(--ui-font-caption)/1.6 var(--ui-font); color:var(--ui-muted); }
.modal-x,.ed-icon-btn { display:inline-grid; place-items:center; width:var(--ui-icon-button-size); height:var(--ui-icon-button-size); border-radius:var(--ui-button-radius); border-color:transparent; background:transparent; color:var(--ui-muted); }
.modal-x:hover,.ed-icon-btn:hover { background:var(--ui-hover-bg); color:var(--ui-hover-text); border-color:transparent; }
.ed-tabs { padding-inline:22px; gap:24px; border-color:var(--ui-border); }
.ed-tab { font:var(--ui-font-control)/1.5 var(--ui-font); color:var(--ui-muted); }
.ed-tab.on { color:var(--ui-accent); font-weight:var(--ui-weight-strong); }
.ed-tab.on::after { background:var(--ui-accent); }
.ed-body { padding:22px; }.ed-main { gap:16px; }
.ed-foot { padding:12px 22px; background:var(--ui-panel); border-color:var(--ui-border); }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--ui-control-gap);
  min-height:var(--ui-control-h); padding:var(--ui-button-padding); border:1px solid transparent;
  background:transparent; color:var(--ui-text); border-radius:var(--ui-button-radius);
  font:var(--ui-font-control)/var(--ui-button-line-height) var(--ui-font); letter-spacing:0;
  transition:background var(--ui-motion),color var(--ui-motion);
}
.btn:hover:not(:disabled):not([aria-disabled="true"]) { color:var(--ui-hover-text); border-color:transparent; background:var(--ui-hover-bg); }
.btn:active { transform:none; }.btn.primary { color:var(--ui-primary-text); background:var(--ui-accent); border-color:var(--ui-accent); }
.btn.primary:hover:not(:disabled) { color:var(--ui-primary-text); background:var(--ui-accent); border-color:var(--ui-accent); filter:brightness(.96); }
.btn.danger { color:var(--ui-danger); border-color:color-mix(in srgb,var(--ui-danger) 45%,var(--ui-border)); }
.btn.sm { min-height:30px; padding:5px 9px; font-size:var(--ui-font-label); }
.btn:disabled,.btn[aria-disabled="true"],.ed-icon-btn:disabled { opacity:var(--ui-disabled-opacity); cursor:not-allowed; filter:none; }
.tinput,textarea.tinput,select.tinput {
  background:var(--ui-input-bg); border-color:var(--ui-input-border); border-radius:var(--ui-input-radius);
  color:var(--ui-text); padding:var(--ui-input-editor-padding);
  font:var(--ui-font-control)/var(--ui-input-editor-line-height) var(--ui-font);
}
.tinput::placeholder { color:var(--ui-muted); }
.tinput:focus { border-color:var(--ui-accent); box-shadow:var(--ui-focus-soft); }
.tinput[aria-invalid="true"] { border-color:var(--ui-danger); }
.ed-label { margin-bottom:9px; font:var(--ui-weight-strong) var(--ui-font-label)/1.5 var(--ui-font); }
.ed-section { padding:16px; border-radius:var(--ui-section-radius); border-color:var(--ui-border); background:var(--ui-panel); }
.ed-section h3 { font:var(--ui-weight-strong) var(--ui-font-control)/1.5 var(--ui-font); letter-spacing:0; }
.ed-section p { font:var(--ui-font-caption)/1.7 var(--ui-font); color:var(--ui-muted); }
.ed-preview-pane { border-radius:var(--ui-section-radius); border-color:var(--ui-border); background:var(--ui-panel); }
.ed-preview-head { padding:12px 14px; border-color:var(--ui-border); }.ed-preview-head strong { font:var(--ui-weight-strong) var(--ui-font-label)/1.5 var(--ui-font); }
.ed-preview-head span { font:var(--ui-font-caption)/1.6 var(--ui-font); color:var(--ui-muted); }
html[data-background="theme"] .ed-preview-canvas:has(.ic-card:is([data-map-style="elegant"], [data-map-style="ink"], [data-map-style="compact"], [data-map-style^="ribbon"])) { background:var(--elegant-canvas); }
html[data-background="theme"] .ed-preview-canvas:has(.ic-card:is([data-map-style="elegant"], [data-map-style="ink"], [data-map-style="compact"], [data-map-style^="ribbon"])):not([data-grid="off"]) { background-image:radial-gradient(var(--elegant-dot-color) .8px,transparent .8px); background-size:20px 20px; }
.item-list { gap:16px; }.item-row { padding:14px 13px; border-radius:var(--ui-section-radius); background:var(--ui-bg); border-color:var(--ui-border); }
.ed-icon-btn .mm-icon,.modal-x .mm-icon { width:17px; height:17px; }.ed-icon-btn.drag { letter-spacing:0; padding:0; }
.tagchip { border-radius:var(--ui-pill-radius); background:color-mix(in srgb,var(--t-c) 8%,var(--ui-panel)); border-color:color-mix(in srgb,var(--t-c) 30%,var(--ui-border)); }
.tag-color { font:var(--ui-font-label)/1.5 var(--ui-font); padding:5px 8px; }.tag-delete { display:grid; place-items:center; padding:0 5px; }.tag-delete .mm-icon { width:13px; height:13px; }
.accent-auto,.item-row,.ed-empty,.ed-discard-dialog { border-color:var(--ui-border); }.accent-auto { background:var(--ui-bg); border-radius:var(--ui-section-radius); }
.accent-auto.on { border-color:var(--ui-accent); box-shadow:none; }.accent-auto .auto-mark { font-family:var(--ui-font); }
.sw-c { border-radius:50%; border:3px solid var(--ui-panel); box-shadow:0 0 0 1px var(--ui-border); }
.sw-c.on { border-color:var(--ui-panel); box-shadow:0 0 0 2px var(--ui-accent); }
.range-meta output,.zoom-scale-value,.zoom-scale-ticks span { font-family:var(--ui-font-mono); }.range-field input[type="range"] { accent-color:var(--ui-accent); }
.dialog .dg-body { padding:var(--ui-dialog-body-padding); }.dialog .dg-foot { padding:0 22px 20px; }
.dg-title { color:var(--ui-text); font:var(--ui-weight-strong) var(--ui-font-heading)/1.5 var(--ui-font); letter-spacing:0; }
.pick-list { border-radius:var(--ui-section-radius); border-color:var(--ui-border); }
.toast { padding:var(--ui-toast-padding); border-radius:var(--ui-toast-radius); background:var(--ui-panel); border-color:var(--ui-border); box-shadow:var(--ui-shadow); color:var(--ui-text); font:var(--ui-font-control)/1.5 var(--ui-font); letter-spacing:0; backdrop-filter:none; }
.toast.warn { color:var(--ui-danger); border-color:var(--ui-danger); }
#mdpanel { background:var(--ui-panel); border-color:var(--ui-border); box-shadow:var(--ui-shadow-aux); backdrop-filter:none; }
#mdpanel .md-head { min-height:var(--ui-panel-header-h); height:auto; padding:var(--ui-panel-header-padding); border-color:var(--ui-border); }
#mdpanel .md-head .t { font:var(--ui-weight-strong) 14px/1.5 var(--ui-font); color:var(--ui-text); }
#mdpanel .md-head .modal-x,#mdpanel .md-head #md-close { width:var(--ui-icon-button-size); height:var(--ui-icon-button-size); border-radius:var(--ui-button-radius); }
#mdpanel .md-tools { padding:8px 16px; border-color:var(--ui-border); }
#mdpanel .md-tools .btn.sm,#mdpanel .md-status .btn { min-height:var(--ui-control-h); height:auto; background:transparent; border-color:transparent; border-radius:var(--ui-button-radius); color:var(--ui-text); font:var(--ui-font-label)/1.4 var(--ui-font); }
#mdpanel .md-tools .btn.sm:hover,#mdpanel .md-status .btn:hover,#mdpanel .md-status .btn.on { color:var(--ui-hover-text); background:var(--ui-hover-bg); border-color:transparent; }
#md-editor { padding:var(--ui-panel-body-padding); color:var(--ui-text); font:12px/1.9 var(--ui-font-mono); }
#mdpanel .md-status { padding:10px 16px; border-color:var(--ui-border); color:var(--ui-muted); font:var(--ui-font-caption)/1.5 var(--ui-font); }
.sel-quickbar,.batch-dock { padding:8px; background:var(--ui-toolbar-bg); border-color:var(--ui-toolbar-border); border-radius:var(--ui-toolbar-radius); box-shadow:var(--ui-shadow-toolbar); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.sel-quick-action,.batch-action,.batch-exit,.mm-color-tray-btn { color:var(--ui-text); background:transparent; border-color:transparent; border-radius:var(--ui-button-radius); }
.sel-quick-action:hover,.batch-action:hover,.batch-exit:hover,.mm-color-tray-btn:hover { color:var(--ui-hover-text); background:var(--ui-hover-bg); border-color:transparent; }
.batch-action:active,.batch-exit:active { transform:none; }
.batch-action.danger { color:var(--ui-danger); }.batch-action[aria-disabled="true"],.sel-quick-action:disabled,.sel-quick-action[aria-disabled="true"],.mm-color-tray-btn:disabled { opacity:var(--ui-disabled-opacity); }
.mm-color-chip.on { box-shadow:0 0 0 2px var(--ui-accent); }.mm-color-tray { background:var(--ui-panel); border-color:var(--ui-border); border-radius:var(--ui-popover-radius); box-shadow:var(--ui-shadow); backdrop-filter:none; -webkit-backdrop-filter:none; }
.mm-color-tray-auto { min-height:var(--ui-control-h); border-radius:var(--ui-button-radius); font:var(--ui-font-label)/1.4 var(--ui-font); color:var(--ui-text); }
.mm-color-tray-auto.on { color:var(--ui-pressed-text); background:var(--ui-pressed-bg); }
.batch-context-menu { padding:var(--ui-menu-padding); background:var(--ui-panel); border-color:var(--ui-border); border-radius:var(--ui-menu-radius); box-shadow:var(--ui-shadow); backdrop-filter:none; }
.batch-menu-item { min-height:var(--ui-control-h); padding:var(--ui-button-padding); border-radius:var(--ui-button-radius); color:var(--ui-text); font:var(--ui-font-control)/1.4 var(--ui-font); }
.batch-menu-item:hover { color:var(--ui-hover-text); background:var(--ui-hover-bg); }.batch-menu-item.danger { color:var(--ui-danger); }
.batch-menu-item[aria-disabled="true"],.batch-menu-item:disabled { opacity:var(--ui-disabled-opacity); }
.batch-dialog { background:var(--ui-panel); border-color:var(--ui-border); box-shadow:var(--ui-shadow); }
.batch-dialog-head { padding:var(--ui-dialog-head-padding); border-color:var(--ui-border); }.batch-dialog-body { padding:var(--ui-dialog-body-padding); }.batch-dialog-foot { border-color:var(--ui-border); background:var(--ui-panel); }
#mobilebar,#zoompop { background:var(--ui-panel); border-color:var(--ui-border); border-radius:var(--ui-popover-radius); box-shadow:var(--ui-shadow); }
#mobilebar button.on,#mobilebar button.mobile-multi-toggle.on,#dock button.on { background:var(--ui-pressed-bg); color:var(--ui-pressed-text); }
.dropdown .di:focus-visible,.btn:focus-visible,.modal-x:focus-visible,.ed-tab:focus-visible,.ed-icon-btn:focus-visible,
.panel button:focus-visible,.tinput:focus-visible,.mm-color-tray button:focus-visible,.sel-quick-action:focus-visible,
.batch-action:focus-visible,.batch-exit:focus-visible,.batch-menu-item:focus-visible,.batch-dialog-close:focus-visible {
  outline:var(--ui-focus-width) solid var(--ui-accent); outline-offset:var(--ui-focus-offset); box-shadow:var(--ui-focus);
}
@media (prefers-reduced-transparency:reduce) { .sel-quickbar,.batch-dock { background:var(--ui-panel); backdrop-filter:none; -webkit-backdrop-filter:none; } }
.ed-projection-hint { margin:0; padding:12px 14px; color:var(--ui-muted); background:var(--ui-bg); border:1px solid var(--ui-border); border-radius:var(--ui-section-radius); font:var(--ui-font-label)/1.7 var(--ui-font); }
#mdpanel .md-status .stale { color:var(--ui-warning); }
.batch-dialog-close { display:grid; place-items:center; }.batch-dialog-close .mm-icon { width:17px; height:17px; }

/* 手机公共入口沿用真实按钮：图标不改变底部位置，热区覆盖 44px。 */
#dock button .mm-icon,#mobilebar button .mm-icon { display:block; margin:auto; pointer-events:none; }
#dock button:focus-visible,#mobilebar button:focus-visible { outline:var(--ui-focus-width) solid var(--ui-accent); outline-offset:var(--ui-focus-offset); }
@media (max-width:900px) {
  #dock button { width:var(--editor-touch-target); min-width:var(--editor-touch-target); height:var(--editor-touch-target); flex:none; }
  #panel-tweaks .seg button,#panel-tweaks .bg-option,#panel-tweaks .layout-grid button { min-height:var(--editor-touch-target); min-width:0; }
  #panel-tweaks .panel-head .ph-btn { width:var(--editor-touch-target); height:var(--editor-touch-target); flex:none; }
  #panel-tweaks .layout-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  #panel-tweaks .layout-grid button { overflow-wrap:anywhere; }
  #panel-tweaks .bg-option { justify-content:center; padding-inline:4px; gap:4px; }
  #panel-tweaks .bg-option span { min-width:0; }
  #panel-tweaks .switchrow { min-height:var(--editor-touch-target); }
  #panel-tweaks .sw { width:var(--editor-touch-target); height:var(--editor-touch-target); background:transparent; border-color:transparent; }
  #panel-tweaks .sw::before { content:""; position:absolute; width:34px; height:19px; left:4px; top:calc(50% - 9.5px); border:1px solid var(--ui-border); border-radius:inherit; background:var(--ui-bg); }
  #panel-tweaks .sw::after { top:calc(50% - 6.5px); left:7px; }
  #panel-tweaks .sw.on::before { background:var(--ui-accent); border-color:transparent; }
  #panel-tweaks .sw.on::after { left:22px; background:var(--ui-primary-text); }
}

/* 远端删除后的行内草稿独立于脑图布局，不阻挡其余节点接收更新。 */
.inline-draft-host {
  position: fixed; right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom)); z-index: var(--z-modal);
  width: min(360px, calc(100vw - 24px)); max-height: calc(100dvh - 80px);
  overflow: auto; box-sizing: border-box; padding: 12px;
  background: var(--ui-panel); color: var(--ui-text);
  border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius);
  box-shadow: var(--ui-shadow); font-size: 14px; line-height: 1.5;
}
.inline-draft-status { margin-bottom: 8px; }
.inline-draft-host > button { min-height: 44px; margin-bottom: 12px; }
.inline-draft-host > .inline-detached-card { max-width: 100%; box-sizing: border-box; }

/* TWEAKS 继续用两列，五种样式各自保留完整名称和可点击区域。 */
.map-style-options :is([data-v="ink"], [data-v="compact"], [data-v^="ribbon"]) .map-style-sample b {
  background: var(--card-ink-text); opacity: 1;
}
.map-style-options [data-v="ink"] .map-style-sample i { background: var(--card-ink-text); }
.map-style-options [data-v="compact"] .map-style-sample { padding: 5px 7px; gap: 3px; }
.map-style-options [data-v="compact"] .map-style-sample i { background: var(--ui-accent); }
.map-style-options [data-v^="ribbon"] .map-style-sample { padding: 0 6px 6px; gap: 5px; border-left-width: 1px; }
.map-style-options [data-v^="ribbon"] .map-style-sample i { width: auto; height: 10px; margin: 0 -6px; background: var(--ui-color-5); }


/* 节点分支样式：屏幕坐标浮层，示意图与文字共同表达选项。 */
.branch-style-panel { position:fixed; z-index:var(--z-batch-menu); box-sizing:border-box; width:var(--branch-panel-width); padding:14px; overflow:auto; overscroll-behavior:contain; color:var(--ui-text); background:var(--ui-panel); border:1px solid var(--ui-border); border-radius:var(--ui-popover-radius); box-shadow:var(--ui-shadow); font:var(--ui-font-size)/1.5 var(--ui-font); }
.branch-style-panel[hidden] { display:none; }
.branch-choice-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.branch-choice-head strong { font-weight:var(--ui-weight-strong); }
.branch-choice-close { flex:none; display:grid; place-items:center; width:var(--editor-touch-target); height:var(--editor-touch-target); border:0; border-radius:var(--ui-button-radius); color:var(--ui-muted); background:transparent; cursor:pointer; }
.branch-choice-close:hover { background:var(--ui-hover-bg); color:var(--ui-hover-text); }
.branch-choice-node { margin:0 0 12px; color:var(--ui-muted); font-size:var(--ui-font-label); overflow-wrap:anywhere; }
.branch-choice-section + .branch-choice-section { margin-top:16px; }
.branch-choice-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 8px; margin-bottom:8px; }
.branch-choice-heading h3 { margin:0; font-size:var(--ui-font-label); font-weight:var(--ui-weight-strong); }
.branch-choice-current { font-size:var(--ui-font-caption); color:var(--ui-muted); }
.branch-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.branch-choice { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-width:0; min-height:var(--branch-choice-height); padding:8px 3px; border:1px solid var(--ui-border); border-radius:var(--ui-button-radius); color:var(--ui-muted); background:var(--ui-input-bg); cursor:pointer; font:var(--ui-font-label)/1.4 var(--ui-font); }
.branch-choice > .mm-icon { width:var(--branch-choice-icon-size); height:var(--branch-choice-icon-size); flex:none; }
.branch-choice:hover { color:var(--ui-text); background:var(--ui-hover-bg); }
.branch-choice.is-selected { border-color:var(--ui-accent); color:var(--ui-accent); background:var(--ui-accent-soft); box-shadow:inset 0 0 0 1px var(--ui-accent); }
.branch-choice-check { position:absolute; right:4px; top:4px; display:none; }
.branch-choice-check .mm-icon { width:13px; height:13px; }
.branch-choice.is-selected .branch-choice-check { display:block; }
.branch-choice:disabled { opacity:var(--ui-disabled-opacity); cursor:not-allowed; }
.branch-choice:focus-visible, .branch-choice-close:focus-visible { outline:2px solid var(--ui-accent); outline-offset:2px; }
.branch-choice-note { margin:14px 0 0; color:var(--ui-muted); font-size:var(--ui-font-caption); overflow-wrap:anywhere; }

/* 设置栏占满顶栏以下的窗口高度；收起顶栏时伸至上沿，临时唤出时也避让。 */
#panel-tweaks {
  left:0; right:auto; top:var(--menubar-h); bottom:0; width:min(var(--ui-panel-width),100vw);
  height:auto; max-height:none; box-sizing:border-box; border-radius:0;
  z-index:calc(var(--z-menubar) - 1);
}
body.toolbar-floating:not(.toolbar-hidden) #panel-tweaks { top:var(--ui-topbar-h); }
#panel-tweaks .panel-head { min-height:var(--ui-topbar-h); box-sizing:border-box; }
#panel-tweaks .panel-body { flex:1; min-height:0; overscroll-behavior:contain; }
#panel-tweaks .branch-style-field { gap:var(--ui-control-gap); }
#panel-tweaks .branch-choice-grid { width:100%; }
#panel-tweaks #tk-branch-target button { min-height:var(--ui-control-h); }
@media (max-width:900px) {
  #panel-tweaks #tk-branch-target button { min-height:var(--editor-touch-target); }
}
@media (max-width:900px), (any-pointer:coarse) {
  /* 末尾选项可滚到移动工具条与安全区上方。 */
  #panel-tweaks .panel-body { padding-bottom:calc(var(--batch-dock-mobile-h) + var(--ui-control-gap) + env(safe-area-inset-bottom)); }
}