.mindmap-library-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}
.mindmap-library-head h2 { margin: 8px 0 5px; font-size: clamp(34px, 5vw, 52px); letter-spacing: -.05em; }
.mindmap-library-head p { margin: 0; color: var(--muted); line-height: 1.6; }
.mindmap-mode-head { display:flex; justify-content:space-between; align-items:end; gap:24px; margin:4px 0 16px; }
.mindmap-mode-head h3 { margin:7px 0 0; font-size:24px; }
.mindmap-mode-head p { max-width:480px; margin:0; color:var(--muted); font-size:12px; line-height:1.6; text-align:right; }
.mindmap-start-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 30px; }
.mindmap-start-card {
  position: relative;
  overflow: hidden;
  min-height: 226px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(255,255,255,.9);
  box-shadow: var(--shadow-sm);
}
.mindmap-start-card.manual { background: linear-gradient(140deg,#fff 0%,#fff0e7 100%); }
.mindmap-start-card.lesson { background:linear-gradient(140deg,#fff 0%,#edf6ff 100%); }
.mindmap-start-card.vocab { background:linear-gradient(140deg,#fff 0%,#f2edff 100%); }
.mindmap-start-card.project { background:linear-gradient(140deg,#fff 0%,#fff5d8 100%); }
.mindmap-start-card.revision { background:linear-gradient(140deg,#fff 0%,#edf8ec 100%); }
.mindmap-start-card.ai { background: linear-gradient(140deg,#fff 0%,#edf6ff 100%); }
.mindmap-start-card::after {
  content: "";
  position: absolute;
  width: 180px; height: 180px;
  right: -55px; bottom: -70px;
  border-radius: 50%;
  background: rgba(244,119,67,.13);
}
.mindmap-start-card.ai::after { background: rgba(75,148,214,.13); }
.mindmap-start-icon {
  width: 58px; height: 58px;
  display: grid; place-items: center;
  border-radius: 19px;
  background: #ffe2d0;
  font-size: 28px;
}
.mindmap-start-card.ai .mindmap-start-icon { background: #dcefff; }
.mindmap-start-card.lesson .mindmap-start-icon { background:#dcefff; }
.mindmap-start-card.vocab .mindmap-start-icon { background:#e9dfff; }
.mindmap-start-card.project .mindmap-start-icon { background:#fff0bd; }
.mindmap-start-card.revision .mindmap-start-icon { background:#dff2dd; }
.mindmap-start-card h3 { margin: 18px 0 7px; font-size: 22px; }
.mindmap-start-card p { max-width: 480px; margin: 0 0 18px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.mindmap-coming {
  display: inline-flex;
  padding: 7px 10px;
  border-radius: 999px;
  background: #e4f1fb;
  color: #327aaa;
  font-size: 10px;
  font-weight: 700;
}
.mindmap-library-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 34px 0 15px;
}
.mindmap-library-toolbar h3 { margin: 0; font-size: 23px; }
.mindmap-search {
  width: min(360px, 100%);
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.88);
  outline: none;
}
.mindmap-search:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(244,119,67,.12); }
.mindmap-library-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.mindmap-doc-card {
  position: relative;
  min-height: 220px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 23px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 25px rgba(80,54,40,.07);
}
.mindmap-doc-preview {
  position: relative;
  height: 95px;
  overflow: hidden;
  margin-bottom: 16px;
  border-radius: 17px;
  background-color: #f7fbff;
  background-image: radial-gradient(#cfdfea 1px, transparent 1px);
  background-size: 18px 18px;
}
.mindmap-doc-preview::before,
.mindmap-doc-preview::after {
  content: "";
  position: absolute;
  border-radius: 12px;
  background: white;
  border: 2px solid #6fa7d3;
}
.mindmap-doc-preview::before { width: 90px; height: 30px; left: 18px; top: 31px; border-color: var(--orange); }
.mindmap-doc-preview::after { width: 70px; height: 25px; right: 24px; top: 18px; box-shadow: 0 42px 0 -1px white, 0 42px 0 1px #8bb5d7; }
.mindmap-doc-card h4 { margin: 0 0 7px; font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mindmap-doc-meta { display: flex; gap: 7px; flex-wrap: wrap; color: var(--muted); font-size: 10px; }
.mindmap-source { padding: 5px 7px; border-radius: 999px; background: #fff0e7; color: var(--orange-dark); font-weight: 700; }
.mindmap-source.ai { background: #e5f2fb; color: #2e78a9; }
.mindmap-card-actions { display: flex; gap: 6px; margin-top: 16px; flex-wrap: wrap; }
.mindmap-card-actions button {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}
.mindmap-card-actions button:first-child { color: white; background: var(--orange); border-color: var(--orange); }
.mindmap-card-actions .danger { color: #b73e34; }
.mindmap-empty {
  grid-column: 1 / -1;
  min-height: 290px;
  display: grid;
  place-items: center;
  padding: 30px;
  border: 1px dashed #e4cab9;
  border-radius: 26px;
  background: rgba(255,255,255,.62);
  text-align: center;
}
.mindmap-empty i { display: block; margin-bottom: 10px; font-size: 47px; font-style: normal; }
.mindmap-empty h4 { margin: 0 0 7px; font-size: 21px; }
.mindmap-empty p { margin: 0 0 17px; color: var(--muted); }

.mindmap-editor-overlay {
  position: fixed;
  inset: 0;
  z-index: 150;
  display: none;
  background: #edf5fa;
}
.mindmap-editor-overlay.open { display: block; }
.mindmap-editor-shell { position: absolute; inset: 0; overflow: hidden; }
.mindmap-editor-top {
  position: absolute;
  z-index: 12;
  top: 14px; left: 14px; right: 14px;
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(74,109,135,.16);
  border-radius: 20px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 12px 35px rgba(39,69,91,.12);
  backdrop-filter: blur(16px);
}
.mindmap-editor-top > div { display: flex; align-items: center; gap: 7px; }
.mindmap-title-input {
  width: min(330px, 28vw);
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: var(--charcoal);
  font-weight: 800;
  outline: none;
}
.mindmap-title-input:focus { border-color: #d8e5ed; background: #fff; }
.mindmap-save-state {
  min-width: 76px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #e6f5e8;
  color: #2f7b42;
  font-size: 10px;
  font-weight: 700;
  text-align: center;
}
.mindmap-save-state.saving { background: #fff2d9; color: #9a6b15; }
.mindmap-icon-btn {
  min-width: 40px; height: 40px;
  padding: 0 11px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  cursor: pointer;
  font-weight: 700;
}
.mindmap-icon-btn:hover { background: #eef5f9; }
.mindmap-present-btn { color: white; background: #3c8bc3; }
.mindmap-present-btn:hover { background: #3179aa; }
.mindmap-editor-side {
  position: absolute;
  z-index: 10;
  top: 94px; left: 14px; bottom: 14px;
  width: 238px;
  overflow: auto;
  padding: 16px;
  border: 1px solid rgba(74,109,135,.15);
  border-radius: 21px;
  background: rgba(255,255,255,.93);
  box-shadow: 0 12px 32px rgba(39,69,91,.10);
}
.mindmap-editor-side h3 { margin: 0 0 4px; font-size: 15px; }
.mindmap-editor-side > p { margin: 0 0 16px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.mindmap-side-section { padding: 14px 0; border-top: 1px solid #e8eef1; }
.mindmap-side-section:first-of-type { border-top: 0; }
.mindmap-side-section b { display: block; margin-bottom: 9px; font-size: 10px; color: #5f707a; }
.mindmap-side-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.mindmap-side-actions button,
.mindmap-node-actions button {
  padding: 9px;
  border: 1px solid #dbe6ec;
  border-radius: 11px;
  background: white;
  cursor: pointer;
  font-size: 9px;
  font-weight: 700;
}
.mindmap-side-actions button:hover,
.mindmap-node-actions button:hover { border-color: #6ca6d0; background: #f2f8fc; }
.mindmap-node-actions { display: grid; gap: 7px; }
.mindmap-node-actions .danger { color: #b53e35; }
.mindmap-style-row { display: flex; gap: 7px; flex-wrap: wrap; }
.mindmap-color-dot {
  width: 30px; height: 30px;
  border: 3px solid white;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #dce5e9;
  cursor: pointer;
}
.mindmap-editor-canvas {
  position: absolute;
  inset: 0;
  overflow: hidden;
  touch-action: none;
  cursor: grab;
  background-color: #edf5fa;
  background-image: radial-gradient(#c9d8e1 1.1px, transparent 1.1px);
  background-size: 24px 24px;
}
.mindmap-editor-canvas.panning { cursor: grabbing; }
.mindmap-world {
  position: absolute;
  left: 0; top: 0;
  width: 6000px; height: 4000px;
  transform-origin: 0 0;
}
.mindmap-edges { position: absolute; inset: 0; width: 6000px; height: 4000px; overflow: visible; pointer-events: none; }
.mindmap-edge { fill: none; stroke: #8fb7d1; stroke-width: 4; stroke-linecap: round; }
.mindmap-node {
  position: absolute;
  min-width: 160px;
  max-width: 260px;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 17px;
  border: 2px solid #78a9ca;
  border-radius: 17px;
  background: #fff;
  color: #2f3437;
  box-shadow: 0 8px 20px rgba(48,78,97,.12);
  cursor: move;
  user-select: none;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}
.mindmap-node[data-color="orange"] { border-color: var(--orange); background: #fff5ef; }
.mindmap-node[data-color="blue"] { border-color: #5797c4; background: #f1f8fd; }
.mindmap-node[data-color="sage"] { border-color: #7aa679; background: #f3f9f1; }
.mindmap-node[data-color="lavender"] { border-color: #9c82c7; background: #f8f4fd; }
.mindmap-node[data-variant="root"] {
  min-width: 210px;
  min-height: 76px;
  border-width: 3px;
  border-radius: 23px;
  background: linear-gradient(135deg,#ff8150,#ed6530);
  color: white;
  font-size: 18px;
  box-shadow: 0 14px 32px rgba(229,96,43,.25);
}
.mindmap-node.selected { outline: 4px solid rgba(59,139,195,.27); outline-offset: 4px; }
.mindmap-node.drop-target { outline: 4px dashed #4f9bcf; outline-offset: 5px; }
.mindmap-node[contenteditable="true"] {
  cursor: text;
  user-select: text;
  outline: 4px solid rgba(244,119,67,.28);
  outline-offset: 4px;
}
.mindmap-node.editing {
  cursor: text;
  user-select: text;
  outline: 4px solid rgba(244,119,67,.32);
  outline-offset: 4px;
}
.mindmap-node-text[contenteditable="true"] {
  min-width: 70px;
  padding: 3px 5px;
  border-radius: 7px;
  background: rgba(255,255,255,.72);
  color: #2f3437;
  cursor: text;
  user-select: text;
  outline: none;
}
.mindmap-collapse {
  position: absolute;
  right: -12px; bottom: -12px;
  width: 26px; height: 26px;
  display: grid; place-items: center;
  padding: 0;
  border: 2px solid white;
  border-radius: 50%;
  background: #4d91bd;
  color: white;
  box-shadow: 0 4px 10px rgba(40,73,94,.18);
  cursor: pointer;
  font-size: 12px;
}
.mindmap-node-count {
  position: absolute;
  left: -8px; top: -8px;
  min-width: 23px; height: 23px;
  display: grid; place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: #68757c;
  color: white;
  font-size: 9px;
}
.mindmap-canvas-toolbar {
  position: absolute;
  z-index: 11;
  right: 18px; bottom: 18px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px;
  border: 1px solid rgba(75,107,126,.16);
  border-radius: 16px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 10px 28px rgba(44,70,87,.12);
}
.mindmap-canvas-toolbar button {
  min-width: 38px; height: 38px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  font-weight: 700;
}
.mindmap-canvas-toolbar button:hover { background: #edf5fa; }
.mindmap-zoom-label { min-width: 48px; text-align: center; font-size: 10px; font-weight: 700; }
.mindmap-shortcut-help {
  position: absolute;
  z-index: 9;
  left: 270px; bottom: 18px;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.88);
  color: #6c7d86;
  font-size: 9px;
  box-shadow: 0 7px 20px rgba(53,81,99,.09);
}
.mindmap-error {
  position: absolute;
  z-index: 30;
  left: 50%; top: 95px;
  transform: translateX(-50%);
  display: none;
  max-width: min(520px,calc(100% - 30px));
  padding: 11px 15px;
  border-radius: 13px;
  background: #fff0ee;
  color: #a43f36;
  box-shadow: 0 8px 25px rgba(104,48,42,.13);
  font-size: 11px;
  font-weight: 700;
}
.mindmap-error.show { display: block; }
.mindmap-present .mindmap-editor-top,
.mindmap-present .mindmap-editor-side,
.mindmap-present .mindmap-shortcut-help { display: none; }
.mindmap-present .mindmap-node { min-width: 210px; min-height: 72px; font-size: clamp(20px,2vw,29px); }
.mindmap-present .mindmap-node[data-variant="root"] { min-width: 260px; min-height: 90px; font-size: clamp(25px,2.5vw,36px); }
.mindmap-present-bar {
  position: absolute;
  z-index: 20;
  top: 18px; left: 50%;
  transform: translateX(-50%);
  display: none;
  align-items: center;
  gap: 7px;
  padding: 8px;
  border-radius: 16px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 10px 28px rgba(35,66,85,.16);
}
.mindmap-present .mindmap-present-bar { display: flex; }
.mindmap-lock.active { color: white; background: #3c8bc3; }

@media (max-width: 940px) {
  .mindmap-start-grid { grid-template-columns: repeat(2,1fr); }
  .mindmap-library-grid { grid-template-columns: repeat(2,1fr); }
  .mindmap-editor-side { width: 205px; }
  .mindmap-shortcut-help { display: none; }
}
@media (max-width: 680px) {
  .mindmap-start-grid,.mindmap-library-grid { grid-template-columns: 1fr; }
  .mindmap-mode-head { align-items:flex-start; flex-direction:column; }
  .mindmap-mode-head p { text-align:left; }
  .mindmap-library-head,.mindmap-library-toolbar { align-items: flex-start; flex-direction: column; }
  .mindmap-search { width: 100%; }
  .mindmap-editor-top { min-height: 58px; }
  .mindmap-title-input { width: 130px; }
  .mindmap-editor-top .desktop-only { display: none; }
  .mindmap-editor-side { top: 84px; left: 8px; bottom: 70px; width: 178px; padding: 12px; }
  .mindmap-editor-side.collapsed { display: none; }
}

@media print {
  body.mindmap-printing > * { display: none !important; }
}