@import url('./minimap.css');
@import url('./cards.css');
@import url('./canvas-toolbar.css');
@import url('./link-cards.css');
@import url('./board-hover.css');
@import url('./project-updates.css');
.organizer { --org-panel-width: 264px; --org-panel-visible-width: var(--org-panel-width); position: relative; width: 100%; height: 100%; min-height: 0; overflow: hidden; color: var(--ui-text-primary); background-color: var(--ui-bg-secondary); background-image: radial-gradient(var(--ui-separator) 1px, transparent 1px); background-size: var(--ui-canvas-grid-size) var(--ui-canvas-grid-size); }
.organizer.org-panel-collapsed { --org-panel-visible-width: 142px; }
.organizer.org-panel-resizing { cursor: ew-resize; user-select: none; }
.organizer button { color: inherit; font: inherit; cursor: pointer; }
.organizer button:focus-visible, .organizer select:focus-visible, .organizer input:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.organizer button:disabled { cursor: default; }
.organizer .org-image-placeholder { display: grid; place-items: center; width: 100%; height: 100%; padding: var(--ui-space-4); overflow: hidden; background: var(--ui-bg-secondary); color: var(--ui-text-secondary); font-size: var(--ui-font-size-label); line-height: var(--ui-line-height-label); text-align: center; }
.org-content { position: absolute; inset: 0; overflow: auto; }
.org-empty-state { position: absolute; z-index: 2; inset: 0; display: grid; place-items: center; pointer-events: none; text-align: center; }
.org-empty-state[hidden] { display: none; }
.org-empty-state > div { max-width: 290px; padding: 22px; color: var(--ui-text-secondary); }
.org-empty-state strong { color: var(--ui-text-primary); font-size: var(--ui-font-size-headline); }
.org-empty-state p { margin: 10px 0 14px; font-size: var(--ui-font-size-callout); line-height: var(--ui-line-height-callout); }
.org-empty-state button { padding: 8px 14px; border-radius: var(--ui-radius-8); background: var(--ui-accent); color: var(--ui-bg); pointer-events: auto; }
.organizer .org-map-scroll { position: relative; width: 100%; height: 100%; min-height: 100%; overflow: auto; outline: 0; }
.organizer .org-map-surface { position: relative; margin: 48px 48px 80px calc(var(--org-panel-visible-width) + 44px); }
.organizer .org-snap-guides { position: absolute; z-index: 4; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.organizer .org-snap-guides line { stroke: var(--ui-measure-pink); stroke-width: 1; vector-effect: non-scaling-stroke; }
.organizer .org-map { position: absolute; z-index: 1; margin: 0; }
.organizer .org-map-title { margin: 16px 24px 0 calc(var(--org-panel-visible-width) + 44px); color: var(--ui-text-secondary); font-size: var(--ui-font-size-caption); }
.organizer .org-map-board { position: absolute; z-index: 1; min-height: 0; padding: 0; overflow: visible; border: 0; border-radius: 3px; background: var(--ui-bg); box-shadow: 0 0 0 1px var(--ui-separator), var(--ui-shadow-1); }
.organizer .org-map-board img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: fill; }
.organizer .org-map-board:not(.org-map-state-board)::before { content: attr(title); position: absolute; bottom: calc(100% + var(--org-board-name-gap)); left: 0; width: var(--org-board-name-width); overflow: hidden; color: var(--ui-text-secondary); font: var(--ui-font-weight-body) var(--ui-font-size-body)/var(--ui-line-height-body) var(--ui-font); text-align: left; text-overflow: ellipsis; white-space: nowrap; transform: scale(var(--org-board-name-scale)); transform-origin: left bottom; }
.org-choosing-group .org-map-board::after { content: ''; position: absolute; top: 4px; right: 4px; box-sizing: border-box; width: 14px; height: 14px; border: 1px solid var(--ui-text-tertiary); border-radius: 50%; background: var(--ui-bg); }
.org-choosing-group .org-map-board.org-map-selected::after { border-color: var(--ui-accent); background-color: var(--ui-accent); background-image: linear-gradient(45deg, transparent 40%, var(--ui-bg) 40% 60%, transparent 60%), linear-gradient(-45deg, transparent 40%, var(--ui-bg) 40% 60%, transparent 60%); background-position: 2px 6px, 5px 3px; background-size: 5px 5px, 7px 7px; background-repeat: no-repeat; }
.org-group-selection { position: absolute; z-index: 10; top: 14px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: var(--ui-space-12); max-width: calc(100% - 32px); padding: 8px 10px 8px 16px; border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); white-space: nowrap; }
.org-group-selection[hidden] { display: none; }
.org-group-selection span { overflow: hidden; text-overflow: ellipsis; }
.org-group-selection button { padding: 5px 10px; border-radius: var(--ui-radius-8); background: var(--ui-fill-3); }
.org-group-selection button:last-child { background: var(--ui-accent); color: var(--ui-bg); }
/* 照蓝湖：选中框随缩放变细（4 个画布单位），最细 1px，缩小看全局时不会糊成一片。 */
.organizer .org-map-board.org-map-selected { z-index: 2; outline: max(1px, calc(4px * var(--org-board-name-scale, 1))) solid var(--ui-accent); outline-offset: max(0px, calc(2px * var(--org-board-name-scale, 1))); }
.organizer .org-map-board.org-map-selected::before { color: var(--ui-accent); }
.org-board-name-editor { position: fixed; z-index: 10000; box-sizing: border-box; height: 26px; padding: 3px 6px; border: 1px solid var(--ui-accent, #007aff); border-radius: 4px; outline: 0; background: var(--ui-bg, #fff); color: var(--ui-text-primary, #222); font: 13px/18px var(--ui-font, sans-serif); box-shadow: var(--ui-shadow-1); }
.org-board-name-editor:focus-visible { border-color: transparent; }
.organizer .org-map [data-canvas-layer] { z-index: 3 !important; }
.organizer .org-merge-target { outline: 3px solid var(--ui-accent); filter: opacity(.6); }
.organizer .org-map-dimmed { opacity: .5; }
.org-state-tabs { position: absolute; z-index: 4; display: flex; gap: 3px; max-width: 280px; overflow-x: auto; border-radius: var(--ui-radius-6) var(--ui-radius-6) 0 0; background: var(--ui-bg); box-shadow: var(--ui-shadow-1); }
.org-state-tabs button { max-width: 110px; padding: 3px 7px; overflow: hidden; border: 0; border-radius: var(--ui-radius-6); background: var(--ui-fill-3); color: var(--ui-text-secondary); font-size: var(--ui-font-size-label); text-overflow: ellipsis; white-space: nowrap; }
.org-state-tabs button[aria-pressed="true"] { background: var(--ui-accent); color: var(--ui-bg); }
.organizer .org-map-group-label { position: absolute; z-index: 2; max-width: calc(100% - 24px); overflow: hidden; pointer-events: none; color: var(--ui-text-primary); font-size: var(--ui-font-size-headline); font-weight: var(--ui-font-weight-headline); text-overflow: ellipsis; white-space: nowrap; }
.organizer .org-map-group-outline { position: absolute; z-index: 0; pointer-events: none; border-radius: var(--ui-radius-16); background: var(--ui-fill-2); }
.organizer .org-map-marquee { position: absolute; z-index: 3; pointer-events: none; border: 1px solid var(--ui-accent); background: var(--ui-selection-bg); }
.organizer .org-link-preview { position: absolute; z-index: 5; height: 2px; pointer-events: none; transform-origin: left center; background: var(--ui-accent); }
.organizer .org-canvas-links { position: absolute; z-index: 3; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.organizer .org-canvas-links [data-organizer-link] { pointer-events: stroke; cursor: pointer; }
.organizer .org-canvas-links > path:not([data-organizer-link]):has(+ path + [data-organizer-link]:is(:hover, :focus-visible)),
.organizer .org-canvas-links > path:not([data-organizer-link]):has(+ [data-organizer-link]:is(:hover, :focus-visible)) { stroke: var(--ui-accent); }
.organizer .org-map-panning { cursor: grabbing; }
.org-panel { position: absolute; z-index: 5; top: var(--ui-space-16); left: var(--ui-space-16); display: flex; flex-direction: column; width: min(var(--org-panel-visible-width), calc(100% - 32px)); max-height: min(70%, 620px); padding: var(--ui-space-8); border: 0; border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); }
.org-panel [data-panel-body] { min-height: 0; overflow: auto; }
.org-panel-collapsed .org-head-menu { display: none; }
.org-panel-collapsed .org-panel-head { border-bottom: 0; }
.org-panel-resize { position: absolute; z-index: 12; top: 0; right: -5px; bottom: 0; width: 10px; border-radius: var(--ui-radius-6); cursor: ew-resize; touch-action: none; }
.org-panel-resize[hidden] { display: none; }
.org-panel-resize:hover, .org-panel-resize:focus-visible { background: var(--ui-selection-bg); outline: 2px solid var(--ui-accent); outline-offset: -2px; }
.org-panel-head { display: flex; flex: none; align-items: center; padding: var(--ui-space-4); border-bottom: var(--ui-border-0); }
.org-panel-head button { border: 0; background: none; }
.org-head-menu { position: relative; }
.org-head-menu > button { width: 32px; height: 32px; border-radius: var(--ui-radius-6); }
.org-group-sort-panel { position: absolute; z-index: 8; top: 30px; right: 0; display: grid; gap: var(--ui-space-4); width: 220px; padding: var(--ui-space-8); border: var(--ui-border-0); border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); }
.org-group-sort-panel[hidden] { display: none; }
.org-group-sort-panel strong { padding: var(--ui-space-4) var(--ui-space-8); font-size: var(--ui-font-size-callout); }
.org-group-sort-panel button { min-height: 32px; padding: var(--ui-space-4) var(--ui-space-8); border-radius: var(--ui-radius-6); text-align: left; font-size: var(--ui-font-size-caption); }
.org-group-sort-panel button:hover { background: var(--ui-fill-3); }
.org-group-sort-panel button[aria-checked="true"] { background: var(--ui-selection-bg); color: var(--ui-selection-text); }
.org-panel-head [data-action="all-groups"] { flex: 1; text-align: left; font-size: var(--ui-font-size-headline); font-weight: var(--ui-font-weight-headline); }
.org-panel-head [data-total] { margin-left: var(--ui-space-4); color: var(--ui-text-secondary); font-size: var(--ui-font-size-caption); font-weight: var(--ui-font-weight-body-strong); }
.org-panel-head [data-action="toggle-panel"] { width: 32px; height: 32px; border-radius: var(--ui-radius-6); color: var(--ui-text-secondary); }
.org-panel-head [data-action="toggle-panel"]:hover { background: var(--ui-fill-3); }
.org-new-group { display: flex; align-items: center; gap: var(--ui-space-4); width: 100%; margin: var(--ui-space-8) 0 var(--ui-space-4); padding: var(--ui-space-4) var(--ui-space-8); border: 0; border-radius: var(--ui-radius-6); background: transparent; color: var(--ui-accent) !important; font-weight: var(--ui-font-weight-body-strong) !important; text-align: left; }
.org-new-group kbd { margin-left: auto; padding: 0 var(--ui-space-4); border: var(--ui-border-0); border-radius: var(--ui-radius-6); background: var(--ui-bg); color: var(--ui-text-secondary); font: var(--ui-font-size-label) var(--ui-font); }
.org-new-group:hover { background: var(--ui-fill-3); }
.org-panel-row { min-width: 0; gap: var(--ui-space-4); padding: 0 var(--ui-space-4); }
.org-panel-row.is-child { padding-left: 20px; }
.org-panel-leaf { min-width: 0; min-height: 32px; margin-left: 36px; border-radius: var(--ui-radius-6); }
.org-panel-leaf:hover, .org-panel-leaf:focus-within { background: var(--ui-fill-3); }
.org-panel-leaf button { display: block; width: 100%; overflow: hidden; padding: var(--ui-space-4) var(--ui-space-8); border: 0; background: transparent; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: var(--ui-font-size-body); }
.org-panel-leaf button svg { margin-right: var(--ui-space-8); color: var(--ui-text-secondary); vertical-align: middle; }
.org-leaf-disclosure { width: 16px; padding: 0; border: 0; background: none; color: var(--ui-text-tertiary) !important; }
.org-panel-row:hover, .org-panel-row:focus-within { background: var(--ui-fill-3); }
.org-panel-row:has(.org-group-name[aria-pressed="true"]) { background: var(--ui-selection-bg); color: var(--ui-selection-text); }
.org-panel-row:has(.org-group-name[aria-pressed="true"]) .org-group-name { font-weight: var(--ui-font-weight-body-strong); }
.org-panel-row:has(.org-group-name[aria-pressed="true"]) :is(.org-group-dot, .org-group-count) { color: var(--ui-selection-text); }
.org-disclosure { margin-right: 0; color: var(--ui-text-tertiary) !important; }
.org-disclosure.is-open svg, .org-leaf-disclosure.is-open svg, .org-panel-head [data-action="toggle-panel"].is-open svg { transform: rotate(90deg); }
.org-group-dot { flex: none; align-items: center; justify-content: center; width: 16px; height: 16px; margin-right: var(--ui-space-4); color: var(--org-group-fg); }
.org-group-name { padding: 0; border: 0; background: none; font-weight: var(--ui-font-weight-body); text-align: left; }
.org-group-count { flex: none; color: var(--ui-text-tertiary); font-size: var(--ui-font-size-caption); font-variant-numeric: tabular-nums; }
.org-row-actions { position: absolute; right: var(--ui-space-8); display: flex; margin: 0; opacity: 0; }
.org-panel-row:hover .org-row-actions, .org-panel-row:focus-within .org-row-actions { opacity: 1; }
.org-panel-row:hover .org-group-name, .org-panel-row:focus-within .org-group-name { padding-right: 48px; }
.org-row-actions button { color: var(--ui-text-secondary); }
.org-group-menu { position: absolute; z-index: 10; top: 28px; right: 3px; width: min(160px, calc(100vw - 32px)); padding: var(--ui-space-4); border: var(--ui-border-0); border-radius: var(--ui-radius-8); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); }
.org-group-menu button { display: block; width: 100%; min-height: 32px; padding: var(--ui-space-4) var(--ui-space-8); border: 0; border-radius: var(--ui-radius-6); background: transparent; text-align: left; }
.org-group-menu button:hover, .org-group-menu button:focus { background: var(--ui-fill-3); }
.org-zoom { position: absolute; z-index: 4; right: var(--ui-space-16); bottom: var(--ui-space-16); display: flex; align-items: center; gap: var(--ui-space-4); height: 40px; padding: var(--ui-space-4); border: var(--ui-border-0); border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-2); }
.org-minimap { position: absolute; z-index: 4; right: 16px; bottom: 62px; display: grid; gap: 6px; width: min(316px, calc(100vw - 32px)); height: 200px; overflow: hidden; padding: 16px; border: var(--ui-border-0); border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-2); }
.org-minimap svg { width: 100%; height: 100%; background: var(--ui-bg-secondary); }
.org-minimap rect { cursor: pointer; }
.org-zoom button { display: grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--ui-radius-6); background: transparent; color: var(--ui-text-secondary); }
.org-zoom [hidden] { display: none !important; }
.org-zoom svg { width: 16px; height: 16px; }
/* Lucide 的减号与加号共用水平线。 */
.org-zoom [data-action="zoom-out"] svg path:last-child { display: none; }
.org-zoom .org-undo-button svg path:last-child { display: none; }
.org-zoom button:hover { background: var(--ui-fill-3); }
.org-zoom button[aria-pressed="true"] { background: var(--ui-selection-bg); color: var(--ui-selection-text); }
.org-zoom [data-zoom-label] { width: auto; min-width: 48px; padding: 0 var(--ui-space-4); text-align: center; font-size: var(--ui-font-size-caption); font-weight: var(--ui-font-weight-body-strong); font-variant-numeric: tabular-nums; white-space: nowrap; }
.org-zoom-sep { width: 1px; height: 16px; background: var(--ui-separator); }
.org-zoom-menu { position: absolute; z-index: 8; right: 38px; bottom: 60px; min-width: 160px; padding: var(--ui-space-4); border: var(--ui-border-0); border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); }
.org-zoom-menu button { display: block; width: 100%; min-height: 32px; padding: var(--ui-space-4) var(--ui-space-8); border: 0; border-radius: var(--ui-radius-6); background: none; text-align: left; }
.org-zoom-menu button:hover { background: var(--ui-fill-3); }
.org-align { position: absolute; z-index: 6; left: 50%; top: 16px; display: flex; gap: 3px; transform: translateX(-50%); padding: 5px; border: var(--ui-border-0); border-radius: var(--ui-radius-12); background: var(--ui-bg); box-shadow: var(--ui-shadow-2); }
.org-align button { padding: 5px 8px; border: 0; border-radius: var(--ui-radius-6); background: transparent; font-size: var(--ui-font-size-caption); }
.org-align button:hover { background: var(--ui-fill-3); }
.org-align button:disabled { opacity: .4; }
.org-presentation .org-row-actions, .org-presentation .org-new-group { display: none; }
.org-board-comment-marker { position: absolute; width: 12px; height: 12px; border: 2px solid var(--ui-bg); border-radius: 50%; background: var(--ui-accent); transform: translate(-50%, -50%); pointer-events: none; }
.org-hide-comments [data-canvas-layer] [aria-label^="评论："], .org-hide-comments .org-board-comment-marker { display: none; }
.org-link-mode [data-canvas-layer] line[data-canvas-item] { pointer-events: none !important; }
.org-link-mode .org-canvas-links [data-organizer-link] { pointer-events: none; }
.org-composite-overlay { position: absolute; z-index: 20; inset: 0; display: grid; place-items: center; padding: 16px; background: var(--ui-slice-outline); }
.org-composite-dialog { width: min(820px, 100%); padding: 20px; border-radius: var(--ui-radius-16); background: var(--ui-bg); box-shadow: var(--ui-shadow-3); }
.org-composite-dialog header, .org-composite-options { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.org-composite-dialog header button { border: 0; background: none; font-size: var(--ui-font-size-title); }
.org-composite-preview { display: grid; place-items: center; min-height: 160px; max-height: 420px; overflow: auto; margin: 16px 0; background-color: var(--ui-bg); background-image: linear-gradient(45deg,var(--ui-fill-2) 25%,transparent 25%),linear-gradient(-45deg,var(--ui-fill-2) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--ui-fill-2) 75%),linear-gradient(-45deg,transparent 75%,var(--ui-fill-2) 75%); background-position: 0 0,0 8px,8px -8px,-8px 0; background-size: 16px 16px; }
.org-composite-preview canvas { max-width: 100%; max-height: 390px; }
.org-composite-options { justify-content: flex-start; }
.org-composite-options select { margin-left: 8px; padding: 5px 8px; border: var(--ui-border-0); border-radius: var(--ui-radius-6); background: var(--ui-bg); }
.org-composite-dialog [role="status"] { color: var(--ui-danger); font-size: var(--ui-font-size-callout); }
.org-composite-dialog footer { margin-top: 16px; text-align: right; }
.org-composite-dialog footer button { padding: 8px 14px; border: 0; border-radius: var(--ui-radius-8); background: var(--ui-accent); color: var(--ui-bg); font-weight: var(--ui-font-weight-headline); }
.organizer .org-status { position: absolute; z-index: 5; right: 16px; bottom: 60px; max-width: 360px; margin: 0; padding: 6px 10px; border-radius: var(--ui-radius-8); background: var(--ui-bg); box-shadow: var(--ui-shadow-2); color: var(--ui-text-secondary); font-size: var(--ui-font-size-caption); }
.organizer .org-status:empty { display: none; }
.organizer .org-wall { display: grid; grid-template-columns: repeat(auto-fill,minmax(145px,1fr)); gap: 12px; padding: 12px; }
.organizer .org-group { margin: 16px 24px 0 calc(var(--org-panel-visible-width) + 44px); border-radius: var(--ui-radius-12); background: var(--ui-bg); }
.organizer .org-group-head { display: flex; align-items: center; gap: 8px; padding: 12px; }
.organizer .org-group-head h3 { flex: 1; margin: 0; font-size: var(--ui-font-size-headline); }
.organizer .org-group-head button { padding: 4px 7px; border: 0; border-radius: var(--ui-radius-6); background: var(--ui-fill-3); }
.organizer .org-preview { display: flex; justify-content: center; align-items: center; width: 100%; height: 180px; padding: 8px; overflow: hidden; border: 0; border-radius: var(--ui-radius-8); background: var(--ui-bg-secondary); }
.organizer .org-preview[aria-current="true"] { outline: 2px solid var(--ui-accent); }
.organizer .org-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.organizer .org-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--ui-font-size-callout); }
.organizer .org-meta, .organizer .org-empty { color: var(--ui-text-secondary); font-size: var(--ui-font-size-caption); }
.organizer .org-trash { margin: 20px 24px 0 calc(var(--org-panel-visible-width) + 44px); padding: 12px; border-radius: var(--ui-radius-12); background: var(--ui-bg); list-style: none; }
.organizer .org-trash li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: var(--ui-border-0); }
.organizer .org-trash button { padding: 5px 9px; border: var(--ui-border-0); border-radius: var(--ui-radius-8); background: var(--ui-bg); }
@media (max-width: 600px) {
  .org-panel { top: 12px; left: 8px; width: min(var(--org-panel-visible-width), calc(100% - 16px)); max-height: 42%; }
  .organizer .org-map-surface { margin-left: calc(var(--org-panel-visible-width) + 24px); }
  .organizer .org-map-title, .organizer .org-group, .organizer .org-trash { margin-left: calc(var(--org-panel-visible-width) + 24px); }
  .organizer .org-wall { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .org-zoom { right: var(--ui-space-8); bottom: var(--ui-space-8); gap: 0; }
  .org-zoom [data-zoom-label] { min-width: 40px; }
}
