/* mindmap5.3 · css/whiteboard.css —— 阅读集白板，沿用公共界面的深浅主题令牌 */
.whiteboard, .whiteboard *, .wb-reader, .wb-reader *, .wb-dialog, .wb-dialog * { box-sizing: border-box; }
.whiteboard { position: fixed; inset: var(--menubar-h) 0 0; z-index: var(--z-whiteboard); color: var(--ui-text); background: var(--ui-bg); font: 14px/1.55 var(--font-ui); overflow: hidden; }
.whiteboard[hidden], .wb-reader[hidden], .whiteboard [hidden] { display: none !important; }
body.whiteboard-active #stage, body.whiteboard-active #hint, body.whiteboard-active #panel-minimap, body.whiteboard-active #mobilebar, body.whiteboard-active #dock, body.whiteboard-active #batch-dock { visibility: hidden; pointer-events: none; }
body.whiteboard-active .demo-launch { display: none; }
body.whiteboard-active.reader-mode-split .whiteboard { right: var(--reader-right-inset); }
body.whiteboard-text-open .whiteboard { right: var(--whiteboard-reader-width); }
body.reading-manager-open .whiteboard { visibility: hidden; }
.wb-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; min-height: var(--whiteboard-toolbar-height); background: var(--ui-panel); border-bottom: 1px solid var(--ui-border); position: relative; z-index: 2; }
.wb-heading { display: flex; align-items: baseline; gap: 12px; white-space: nowrap; }
.wb-heading strong { font-size: 16px; }
.wb-count, .wb-hint, .wb-dialog-hint { color: var(--ui-muted); font-size: 12px; }
.wb-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.wb-button { border: 1px solid var(--ui-border); border-radius: var(--radius-btn); color: var(--ui-text); background: var(--ui-panel); font: inherit; padding: 7px 12px; min-height: 34px; cursor: pointer; white-space: nowrap; }
.wb-button:hover, .wb-button[aria-pressed="true"] { color: var(--ui-accent); background: var(--ui-accent-soft); }
.wb-button.is-primary { background: var(--ui-accent); border-color: var(--ui-accent); color: var(--ui-panel); }
.wb-button:disabled { opacity: .5; cursor: default; }
.wb-button:focus-visible, .wb-resize:focus-visible, .wb-dialog input:focus-visible, .wb-dialog textarea:focus-visible, .wb-dialog select:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
.wb-surface { position: absolute; inset: var(--whiteboard-toolbar-height) 0 0; touch-action: none; overflow: hidden; outline: none; background-image: radial-gradient(circle, var(--ui-border) 1px, transparent 1px); user-select: none; cursor: crosshair; }
.wb-surface.wb-pan { cursor: grab; }
.wb-surface.wb-pan:active { cursor: grabbing; }
.wb-world { position: absolute; inset: 0 auto auto 0; transform-origin: 0 0; }
.wb-card { position: absolute; display: flex; flex-direction: column; background: var(--ui-panel); border: 1px solid var(--ui-border); border-radius: var(--whiteboard-card-radius); box-shadow: var(--whiteboard-card-shadow); overflow: hidden; cursor: default; outline: none; }
.wb-card.is-selected, .wb-card:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.wb-card-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--ui-border); min-height: 48px; flex-shrink: 0; cursor: grab; }
.wb-card-format { font-size: 10px; font-weight: 650; color: var(--ui-accent); letter-spacing: .03em; flex-shrink: 0; }
.wb-card-title { font-size: 13px; font-weight: 600; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; flex: 1; }
.wb-card-open { padding: 3px 7px; min-height: 28px; font-size: 11px; border-color: transparent; }
.wb-preview { padding: 16px 18px 24px; overflow: hidden; min-height: 0; flex: 1; font-size: 13px; line-height: 1.75; overflow-wrap: anywhere; pointer-events: none; }
.wb-preview h1 { font-size: 20px; } .wb-preview h2 { font-size: 17px; } .wb-preview h3 { font-size: 15px; }
.wb-preview :first-child { margin-top: 0; }
.wb-preview img { width: 100%; max-width: 100%; height: auto; display: block; }
.wb-preview pre { white-space: pre-wrap; } .wb-preview table { max-width: 100%; font-size: 12px; border-collapse: collapse; } .wb-preview td, .wb-preview th { border: 1px solid var(--ui-border); padding: 3px 5px; }
.wb-preview blockquote { margin-inline: 0; padding-inline: 12px; border-inline-start: 3px solid var(--ui-accent); color: var(--ui-muted); }
.wb-plain { white-space: pre-wrap; }
.wb-preview-unavailable { color: var(--ui-muted); display: grid; align-content: center; }
.wb-resize { position: absolute; right: 0; bottom: 0; width: 28px; height: 28px; cursor: nwse-resize; touch-action: none; }
.wb-resize::after { content: ''; position: absolute; right: 7px; bottom: 7px; width: 8px; height: 8px; border-right: 2px solid var(--ui-muted); border-bottom: 2px solid var(--ui-muted); }
.wb-selection-box { position: absolute; border: 1px solid var(--ui-accent); background: color-mix(in srgb, var(--ui-accent) 12%, transparent); pointer-events: none; z-index: 3; }
.wb-empty { position: absolute; top: 38%; inset-inline: 24px; text-align: center; pointer-events: none; }
.wb-empty h2 { font-size: 22px; font-weight: 550; margin-bottom: 8px; } .wb-empty p { color: var(--ui-muted); } .wb-empty button { pointer-events: auto; }
.wb-hint { position: absolute; bottom: 64px; left: 16px; right: 16px; text-align: center; pointer-events: none; }
.wb-dock { position: absolute; bottom: max(16px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); display: flex; gap: 4px; padding: 5px; background: var(--ui-panel); border: 1px solid var(--ui-border); border-radius: var(--radius-panel); box-shadow: var(--ui-shadow-toolbar); max-width: calc(100% - 24px); }
.wb-dock .wb-button { border-color: transparent; padding-inline: 9px; }
.wb-reader { position: fixed; inset: var(--menubar-h) 0 0 auto; width: var(--whiteboard-reader-width); z-index: var(--z-reader); color: var(--ui-text); background: var(--ui-panel); border-left: 1px solid var(--ui-border); display: flex; flex-direction: column; font: 15px/1.8 var(--font-ui); }
.wb-reader-head { padding: 18px 22px; border-bottom: 1px solid var(--ui-border); flex-shrink: 0; }
.wb-reader-head h2 { margin: 0 0 12px; font-size: 20px; overflow-wrap: anywhere; }
.wb-reader-actions { display: flex; gap: 8px; }
.wb-reader-content { overflow: auto; padding: 28px; overflow-wrap: anywhere; flex: 1; min-height: 0; user-select: text; }
.wb-reader-content img { max-width: 100%; } .wb-reader-content pre { white-space: pre-wrap; } .wb-reader-content h1 { font-size: 26px; }
.wb-dialog { width: min(680px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; color: var(--ui-text); background: var(--ui-panel); border: 1px solid var(--ui-border); border-radius: var(--radius-editor); box-shadow: var(--ui-shadow); padding: 24px; font: 14px/1.6 var(--font-ui); }
.wb-dialog::backdrop { background: #0006; }
.wb-dialog h2 { margin: 0 0 16px; font-size: 20px; }
.wb-field { display: flex; flex-direction: column; gap: 6px; }
.wb-dialog textarea, .wb-dialog select, .wb-dialog input { border: 1px solid var(--ui-border); border-radius: var(--radius-btn); background: var(--ui-bg); color: var(--ui-text); padding: 10px; font: inherit; }
.wb-dialog textarea { width: 100%; min-height: 220px; height: min(40dvh, 380px); resize: vertical; }
.wb-format { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.wb-dialog footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.wb-error { color: var(--ui-danger); white-space: pre-wrap; }
.wb-note-search { width: 100%; } .wb-note-list { max-height: 42dvh; overflow: auto; margin-top: 12px; } .wb-note-choice { display: block; text-align: start; width: 100%; margin-bottom: 6px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 899px) {
  .wb-toolbar { align-items: flex-start; padding: 10px 12px; flex-direction: column; gap: 6px; height: var(--whiteboard-toolbar-height); }
  .wb-heading strong { font-size: 14px; } .wb-actions { flex-wrap: nowrap; gap: 4px; max-width: 100%; overflow: auto; }
  .wb-button { min-height: 44px; padding: 8px 10px; } .wb-actions .wb-button { font-size: 12px; }
  .wb-count { font-size: 11px; } .wb-card-open { min-height: 36px; } .wb-resize { width: 44px; height: 44px; }
  .wb-dock { width: max-content; bottom: max(12px, env(safe-area-inset-bottom)); overflow-x: auto; } .wb-dock .wb-button { font-size: 12px; min-width: 44px; padding-inline: 7px; }
  .wb-hint { display: none; } .wb-empty h2 { font-size: 20px; }
  body.whiteboard-active.reader-mode-split .whiteboard, body.whiteboard-text-open .whiteboard { right: 0; }
  .wb-reader { width: 100%; } .wb-reader-content { padding: 22px; } .wb-reader-head { padding: 14px 18px; }
  .wb-dialog { padding: 18px; } .wb-dialog textarea { min-height: 180px; }
}

/* 卡片操作和分组均在画布坐标中，浮动多选条保持屏幕尺寸。 */
.wb-card { z-index: 2; border-color: var(--wb-card-color, var(--ui-border)); background: color-mix(in srgb, var(--wb-card-color, var(--ui-panel)) 9%, var(--ui-panel)); }
.wb-card-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:36px; padding:3px 6px; flex-shrink:0; cursor:grab; }
.wb-card-tools { display:flex; gap:2px; }
.wb-icon-button { display:inline-flex; align-items:center; justify-content:center; padding:5px; min-width:30px; min-height:30px; border-color:transparent; background:transparent; }
.wb-icon-button svg { width:18px; height:18px; flex-shrink:0; }
.wb-card-head { padding:5px 12px 9px; min-height:42px; border-bottom-color:color-mix(in srgb,var(--wb-card-color,var(--ui-border)) 35%,var(--ui-border)); }
.wb-card-title { font-size:15px; }
.wb-card.is-folded .wb-preview, .wb-card.is-folded .wb-resize { display:none; }
.wb-card.is-connecting { outline:3px dashed var(--ui-accent); }
.wb-group { z-index:auto; background:color-mix(in srgb,var(--wb-card-color,var(--ui-muted)) 6%,transparent); border:2px solid color-mix(in srgb,var(--wb-card-color,var(--ui-muted)) 35%,transparent); box-shadow:none; pointer-events:none; overflow:visible; }
.wb-group > .wb-card-controls, .wb-group > .wb-card-head { position:relative;z-index:3;pointer-events:auto;background:var(--ui-panel); }
.wb-group .wb-card-controls { position:absolute; right:0; top:0; border:1px solid var(--ui-border); border-radius:var(--radius-btn); }
.wb-group .wb-card-head { max-width:calc(100% - 170px); margin:0; min-height:40px; border:0; width:max-content; padding:6px 12px; border-radius:var(--radius-btn); }
.wb-group.is-folded .wb-card-controls { position:static; border:0; }
.wb-group.is-folded .wb-card-head { width:100%; max-width:100%; }
.wb-lines,.wb-guides { position:absolute; left:0; top:0; overflow:visible; pointer-events:none; }
.wb-lines { z-index:1; } .wb-guides { z-index:4; }
.wb-lines:has(.wb-line-control) { z-index:4; }
.wb-line { fill:none; stroke-width:2; vector-effect:non-scaling-stroke; }
.wb-line.is-selected { stroke:var(--ui-accent); stroke-width:3; }
.wb-line-hit { stroke:transparent; stroke-width:18; fill:none; pointer-events:stroke; cursor:pointer; vector-effect:non-scaling-stroke; }
.wb-line-label { font:13px var(--font-ui); fill:var(--ui-text); stroke:var(--ui-bg); stroke-width:5px; paint-order:stroke; stroke-linejoin:round; }
.wb-line-control { fill:var(--ui-panel); stroke:var(--ui-accent); stroke-width:2; pointer-events:all; cursor:move; vector-effect:non-scaling-stroke; }
.wb-guides line { stroke:var(--ui-accent); stroke-width:1; stroke-dasharray:5 4; vector-effect:non-scaling-stroke; }
.wb-selection-menu { position:absolute; z-index:5; display:flex; gap:4px; padding:5px; background:var(--ui-panel); border:1px solid var(--ui-border); border-radius:var(--radius-panel); box-shadow:var(--ui-shadow-toolbar); }
.wb-selection-menu .wb-icon-button { width:38px; height:38px; }
.wb-menu { position:fixed; z-index:var(--z-ctxmenu); width:280px; max-width:calc(100vw - 16px); max-height:calc(100dvh - var(--menubar-h) - 20px); overflow:auto; color:var(--ui-text); background:var(--ui-panel); border:1px solid var(--ui-border); border-radius:var(--radius-panel); box-shadow:var(--ui-shadow); padding:12px; font:14px/1.5 var(--font-ui); box-sizing:border-box; }
.wb-menu-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.wb-menu-label { font-size:12px; color:var(--ui-muted); margin:14px 0 6px; }
.wb-align-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.wb-align-grid .wb-icon-button { min-height:44px; } .wb-align-grid svg { width:24px; height:24px; }
.wb-color-grid { display:grid; grid-template-columns:repeat(8,1fr); gap:5px; margin:12px 0; }
.wb-color-swatch { min-width:0; min-height:26px; width:26px; height:26px; padding:0; border:1px solid var(--ui-border); }
.wb-color-swatch span { display:none; }
.wb-dialog .wb-field { margin-bottom:10px; }
.wb-popup { width:min(980px,calc(100vw - 32px)); }
.wb-popup-content { max-height:64dvh; overflow:auto; user-select:text; overflow-wrap:anywhere; }
.wb-popup-content img { max-width:100%; }
.wb-popup-shade { position:fixed;inset:0;background:#0006;z-index:var(--z-whiteboard-popup); }
.wb-popup-document { position:fixed;top:20px;left:50%;margin:0;transform:translateX(-50%);z-index:calc(var(--z-whiteboard-popup) + 1);height:calc(100dvh - 40px);display:flex;flex-direction:column; }
.wb-popup-document:not([open]) { display:none; }
.wb-popup-document .wb-popup-content { flex:1; min-height:0; max-height:none; position:relative; }
.wb-popup-reader-host { width:100%; height:100%; position:relative; }
#reader-panel.wb-popup-reader-panel { position:fixed!important;inset:var(--wb-popup-y) auto auto var(--wb-popup-x)!important;width:var(--wb-popup-w)!important;height:var(--wb-popup-h)!important;min-width:0!important;max-width:none!important;display:flex!important;z-index:calc(var(--z-whiteboard-popup) + 2)!important;transition:none!important; }
#reader-panel.wb-popup-reader-panel #reader-resizer { display:none; }
body.whiteboard-popup-open { --z-ctxmenu:calc(var(--z-whiteboard-popup) + 3); }
.wb-material-row { border:1px solid var(--ui-border); border-radius:var(--radius-btn); padding:12px; margin-bottom:10px; }
.wb-material-title { display:flex; gap:8px; align-items:center; overflow-wrap:anywhere; }
.wb-material-title input,.wb-material-consent input { width:18px; height:18px; flex-shrink:0; }
.wb-material-range { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:8px; }
.wb-dialog .wb-range-number { width:80px; }
.wb-material-summary { border:1px solid var(--ui-border); border-radius:var(--radius-btn); padding:12px; max-height:32dvh; overflow:auto; }
.wb-material-summary pre { white-space:pre-wrap; overflow-wrap:anywhere; max-height:22dvh; overflow:auto; }
.wb-material-summary details { margin-top:8px; }
.wb-material-consent { display:flex; align-items:center; gap:8px; margin:12px 0; }
.wb-material-consent[hidden],.wb-material-summary[hidden] { display:none; }
@media (min-width:1400px) {
  body.whiteboard-active.ai-panel-docked .whiteboard { right:var(--ai-panel-width); }
  body.whiteboard-active.ai-panel-docked.reader-mode-split .whiteboard { right:calc(var(--reader-right-inset) + var(--ai-panel-width)); }
  body.whiteboard-active.ai-panel-docked.whiteboard-text-open .whiteboard { right:calc(var(--whiteboard-reader-width) + var(--ai-panel-width)); }
  body.whiteboard-text-open.ai-panel-docked .wb-reader { right:var(--ai-panel-width); }
}
@media (max-width:899px) {
  .wb-card-tools .wb-icon-button { min-width:36px; min-height:36px; padding:4px; }
  .wb-card-controls { gap:3px; padding-inline:3px; }
  .wb-selection-menu .wb-icon-button { width:44px; height:44px; }
  .wb-menu { width:280px; } .wb-popup { padding:12px; width:calc(100vw - 16px); }
  .wb-material-range { gap:6px; } .wb-material-dialog footer { flex-wrap:wrap; }
}