/* Application shell: shared color, controls and page composition.
   Vector layout and editing geometry live in mindmap.css. */
.mindmap-page {--workspace-control-font-size:13px;--map-ink:#201d2c;--map-muted:#716b7c;--map-line:#e7e3ed;--map-soft:#f4f0fa;--map-focus:#5935d5;--action:#5935d5;--action-hover:#4524b2;background:#fdfaf6;color:var(--map-ink)}
.mindmap-page .topbar {height:72px;padding:0 28px;justify-content:space-between;gap:32px;background:#fdfaf6;border-bottom:1px solid #eae6ef}
.mindmap-page .topbar img {width:146px;height:36px}
.mindmap-page .button {min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:11px 18px;border:1px solid transparent;border-radius:10px;font:550 14px/20px ui-sans-serif,system-ui,sans-serif;text-decoration:none;cursor:pointer;white-space:normal;transition:background .16s,border-color .16s,box-shadow .16s;color:#201d2c;box-shadow:none}
.mindmap-page .button.primary {background:#5935d5;border-color:#5935d5;color:#fff}
.mindmap-page .button.primary:hover {background:#4524b2;border-color:#4524b2}
.mindmap-page .button.secondary {background:#fff;border-color:#dcd5e6;color:#443a57}
.mindmap-page .button.secondary:hover {background:#f4f0fa;border-color:#b8a6d8}
.mindmap-page .button svg {width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mindmap-page :is(input,textarea,select) {font-family:inherit;border-color:#dcd5e6;border-radius:9px;color:#201d2c;background:#fff}
.mindmap-page .notices {max-width:1280px;margin:16px auto;padding:0 28px}
.mindmap-page .notice {border-radius:10px;font-size:14px;padding:14px 18px}
.mindmap-page .page-heading {display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:32px}
.mindmap-page .page-heading h1 {margin:0;font-size:36px;line-height:1.15;letter-spacing:-1.2px;font-weight:600}
.mindmap-page .page-heading p {margin:12px 0 0;font-size:15px;line-height:1.6;color:#716b7c}

/* Create: the input and its result share a single first viewport. */
.map-create main {max-width:1360px;margin:auto;padding:40px 28px 48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,1.1fr);grid-template-rows:1fr auto;column-gap:64px;row-gap:12px;min-height:calc(100svh - 72px);align-items:center}
.map-intro {grid-column:1;grid-row:1;display:block;width:auto;align-self:center}
.map-intro .library-welcome-map {width:min(100%,380px);margin:0 0 28px}
.map-intro h1 {font-size:54px;line-height:1.07;letter-spacing:-2.4px;font-weight:600;margin:0}
.map-intro h1 span {color:#5935d5}
.map-intro>p {font-size:15px;line-height:1.7;max-width:none;margin:20px 0 0;color:#716b7c}
.map-composer {grid-column:2;grid-row:1;width:100%;margin:0}
.map-composer .source-form {border:1px solid #ded6ea;border-radius:20px;padding:24px;background:#fff;box-shadow:0 8px 32px #35214e08}
.map-composer .source-form>label {font-size:15px;line-height:1.5;font-weight:600;color:#342b44;letter-spacing:0;margin-bottom:16px}
.map-composer .idea-label {display:flex;align-items:center;gap:10px}
.idea-label svg {width:28px;height:28px;padding:4px;background:#f1ebfc;border-radius:7px;fill:none;stroke:#7954c7;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.map-composer .source-form textarea {font-size:17px;line-height:1.65;min-height:176px;max-height:360px;letter-spacing:0;color:#201d2c;background:#fbf9ff;border:1px solid #e8e0f2;border-radius:12px;padding:16px;resize:none}
.map-composer .source-form textarea::placeholder {color:#81758e}
.idea-input-meta {display:flex;justify-content:flex-end;margin:8px 2px 20px;font-size:11px;line-height:1.5;color:#81758e;font-variant-numeric:tabular-nums}
.idea-input-meta .at-limit {color:#8d481b;font-weight:550}
.map-title-field label {display:flex;align-items:baseline;gap:8px;margin:0 0 8px;font-size:15px;font-weight:600;color:#342b44}
.map-title-field label span {font-size:12px;font-weight:400;color:#81758e}
.map-title-field input {width:100%;min-height:44px;padding:10px 13px;border:1px solid #e4ddeb;border-radius:10px;background:#fff;font-size:16px;color:#201d2c;box-shadow:none}
.map-title-field input::placeholder {color:#8a7e98}
.map-composer .input-footer {padding:20px 0 0;display:block}
.map-composer .button.primary {width:100%;min-height:48px;justify-content:space-between;padding:12px 16px}
.map-composer .field-error {margin:0 0 20px;padding:12px 14px;border:1px solid #eed6cf;border-radius:10px;background:#fff5f1;color:#854227;font-size:13px;line-height:1.6}
.map-composer .field-error:focus {outline:2px solid #7954c7;outline-offset:3px}
.map-examples {align-items:center;gap:8px;margin:16px 0 0}
.map-examples>span {font-size:12px;width:auto;margin:0 4px 0 0;color:#716b7c}
.map-examples button {min-height:44px;padding:8px 12px;font-size:12px;color:#655675;background:#fff;border:1px solid #e7e1ed;border-radius:10px}
.map-examples button:nth-of-type(3n+1) {background:#f0f7ff;border-color:#dceafa;color:#285b87}
.map-examples button:nth-of-type(3n+2) {background:#eff9f3;border-color:#dceee3;color:#2f6950}
.map-examples button:nth-of-type(3n) {background:#fff3eb;border-color:#f4e2d6;color:#94502f}
.map-examples button:hover {background:#f4effb;border-color:#b8a6d8;color:#4524b2}

/* Saved maps: one aligned list, without stacked status labels. */
.map-utility .list-page {max-width:1120px;margin:auto;padding:52px 28px}
.map-utility .list-page h1 {font-size:36px;font-weight:600;line-height:1.2;color:#201d2c;letter-spacing:-1.2px;margin:0 0 20px}
.map-library .page-heading h1 {margin:0}
.map-library .project-list {border:1px solid #e4ddeb;background:#fff;border-radius:16px}
.map-library .project-row {display:flex;align-items:center;border-bottom:1px solid #eee9f3;padding:0 16px 0 0;gap:0}
.map-library .project-row:last-child {border-bottom:0}
.map-library .project-row:first-child {border-radius:16px 16px 0 0}
.map-library .project-row:last-child {border-radius:0 0 16px 16px}
.map-library .project-link {flex:1;min-width:0;display:grid;grid-template-columns:48px minmax(0,1fr) auto 20px;align-items:center;gap:20px;padding:22px 16px 22px 24px;text-decoration:none;border-radius:12px}
.map-library .project-delete {display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:10px;color:#80758c;text-decoration:none}
.map-library .project-delete:hover {color:#a63549;background:#fbecef}
.project-delete svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.library-guidance {display:grid;grid-template-columns:1.2fr 1fr;gap:28px;margin:0 0 28px;padding:24px;background:#f3eff9;border:1px solid #e9e1f1;border-radius:16px}
.library-guidance>div {display:flex;align-items:flex-start;gap:14px}
.library-guidance svg {flex:0 0 24px;width:24px;height:24px;fill:none;stroke:#7954a4;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.library-guidance>div+div svg {stroke:#3e7c67}
.library-guidance h2 {margin:0 0 6px;font-size:14px;font-weight:600;color:#382e49;letter-spacing:0}
.library-guidance p {margin:0;font-size:13px;line-height:1.65;color:#6c617b;max-width:44ch}
.map-delete-dialog {width:440px;max-width:calc(100% - 32px);max-height:calc(100% - 32px);padding:28px;border:1px solid #e4ddeb;border-radius:20px;background:#fffdfa;color:#201d2c;box-shadow:0 20px 80px #241b3626}
.map-delete-dialog::backdrop {background:#241b3666}
.map-library .map-delete-dialog form {margin:0}
.map-delete-dialog h2,.map-delete-fallback h1 {margin:0 0 18px;font-size:24px;letter-spacing:-.6px}
.map-delete-dialog p,.map-delete-fallback p {font-size:14px;line-height:1.6;color:#716b7c}
.map-delete-dialog .delete-map-title,.map-delete-fallback .delete-map-title {margin:0 0 12px;font-size:16px;font-weight:600;color:#382e49;overflow-wrap:anywhere}
.delete-actions {display:flex;justify-content:flex-end;gap:10px;margin-top:24px}
.map-library .delete-confirm {background:#a63549;border-color:#a63549;color:#fff}
.map-library .delete-confirm:hover:not(:disabled) {background:#872a3b;border-color:#872a3b;color:#fff}
.map-delete-fallback {max-width:480px;margin:64px auto;padding:28px}
.map-library :is(.project-link,.project-delete,.delete-actions .button):focus-visible {outline:3px solid #7954c7;outline-offset:3px}
.map-library .project-row:hover {background:#f7f3fd}
.project-symbol {width:48px;height:48px;border-radius:12px;background:#ece8fc;fill:#65508e;stroke:#65508e;stroke-width:1.5}
.project-symbol path {fill:none}
.map-library .project-row:nth-child(3n+2) .project-symbol {background:#e1f4ea;fill:#2f6950;stroke:#2f6950}
.map-library .project-row:nth-child(3n) .project-symbol {background:#ffebdd;fill:#94502f;stroke:#94502f}
.map-library .project-name {min-width:0}
.map-library .project-name strong {display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;line-height:1.5;font-weight:550;color:#2f273b}
.map-library .project-name small {display:block;font-size:12px;line-height:1.6;color:#716b7c;margin-top:4px}
.map-library time {font-size:12px;color:#716b7c;white-space:nowrap;font-variant-numeric:tabular-nums}
.map-library .project-open {color:#8a75a4;font-size:20px}
/* The first visit has its own centered composition, separate from saved rows. */
.library-welcome {min-height:calc(100svh - 72px);max-width:760px;margin:0 auto;padding:48px 24px 64px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.library-welcome-label {margin:0 0 22px;font-size:13px;line-height:1.5;font-weight:550;color:#716b7c}
.library-welcome-map {display:block;width:min(100%,440px);height:auto;flex-shrink:0;margin:0 0 24px;overflow:visible}
.library-welcome h1 {margin:0;font-size:clamp(36px,4vw,52px);font-weight:600;line-height:1.08;letter-spacing:-1.8px;color:#201d2c}
.library-welcome h1 span {display:block;color:#5935d5}
.library-welcome-copy {margin:18px 0 28px;font-size:16px;line-height:1.6;color:#716b7c}
.library-welcome .library-welcome-action {min-height:48px;padding:12px 22px;gap:10px;box-shadow:0 3px 8px #5935d51a}
.library-welcome-action svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.library-welcome-privacy {max-width:360px;width:100%;margin:22px 0 0;color:#716b7c;font-size:12px;line-height:1.6}
.library-welcome-privacy summary {display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:4px 0;cursor:pointer;list-style:none;font-weight:400;color:inherit}
.library-welcome-privacy summary::-webkit-details-marker {display:none}
.library-welcome-privacy summary::after {content:'+';font-size:15px;color:#8d829b}
.library-welcome-privacy[open] summary::after {content:'−'}
.library-welcome-privacy summary>svg {width:14px;height:14px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.library-welcome-privacy summary:hover {color:#5935d5}
.library-welcome-privacy p {margin:4px 0 0;font-size:12px;line-height:1.7}
@media(max-width:600px) {
 .library-welcome {padding:36px 24px 40px;min-height:calc(100svh - 64px)}
 .library-welcome-label {margin-bottom:18px}
 .library-welcome-map {margin-bottom:24px}
 .library-welcome h1 {letter-spacing:-1.2px}
 .library-welcome-copy {font-size:15px;margin:16px 0 24px}
 .library-welcome-privacy {max-width:310px;margin-top:18px}
}
.map-utility form {margin:24px 0}
.map-utility form :is(textarea,input) {width:100%;padding:14px}
.map-utility form textarea {min-height:180px}

/* Export: the map is the preview, formats form one compact control column. */
.map-export .map-export-content {max-width:1280px;margin:auto;padding:28px 28px 48px}
.back-link {min-height:44px;display:inline-flex;align-items:center;gap:10px;font:500 13px/1.5 ui-sans-serif,system-ui,sans-serif;color:#716b7c;text-decoration:none;margin-bottom:20px}
.back-link:hover {color:#5935d5}
.export-layout {display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
.export-preview {min-width:0}
.map-export .export-preview .explorer {border-color:#e4ddeb;border-radius:16px}
.map-export .export-preview .explorer-head {background:#fbf9fd;border-color:#eee9f4}
.map-export .explorer[data-family=mindmap] .graph-scroll {height:420px;min-height:0}
.map-export .export-preview .explorer-footnote {bottom:82px;max-width:none;right:20px}
.map-export .export-preview .explorer {padding-bottom:110px}
.map-export .share-options {display:flex;flex-direction:column;gap:0;margin:0;border:1px solid #e4ddeb;border-radius:16px;overflow:hidden;background:#fff}
.map-export .share-options>div {padding:24px;border:0;border-bottom:1px solid #eee9f3;border-radius:0;background:transparent;box-shadow:none}
.map-export .share-options>div:last-child {border-bottom:0}
.map-export .share-options h2 {font-size:19px;font-weight:600;letter-spacing:-.4px;line-height:1.4;margin:0 0 14px;color:#2f273b}
.map-export .share-options h2 span {display:block;font-size:12px;letter-spacing:0;font-weight:450;line-height:1.5;color:#716b7c;margin-top:4px}
.map-export .share-options p {font-size:13px;line-height:1.7;color:#716b7c;margin:0 0 22px}
.map-export .share-options form {margin:0}
.map-export .share-options .button {width:100%;font-size:13px}

/* Loading and recovery inherit the same action and surface language. */
.generation-state {border-color:#e4ddeb;background:#fff;color:#201d2c}
.generation-mark>rect {fill:#5935d5}
.generation-mark .generation-branches path:nth-child(-n+2) {stroke:#9070e6}
.generation-mark .generation-branches path:nth-child(n+3) {stroke:#34a381}
.generation-leaves rect:nth-child(1) {fill:#ded0ff}
.generation-leaves rect:nth-child(2) {fill:#f3cedc}
.generation-leaves rect:nth-child(3) {fill:#c9eee0}
.generation-leaves rect:nth-child(4) {fill:#ffdec5}
.generation-cancel {color:#716b7c}
.generation-cancel:hover {background:#f4effb;color:#5935d5}
.generation-recovery a,.generation-source {color:#5935d5}
.mindmap-page .mindmap-save {background:#5935d5;border-color:#5935d5}
.mindmap-page .mindmap-save:hover:not(:disabled) {background:#4524b2}

@media(max-width:1100px) and (min-width:761px) {
 .map-create main {grid-template-columns:minmax(0,1fr) minmax(360px,440px);column-gap:28px;padding-top:42px}
 .map-intro h1 {font-size:46px}
 .export-layout {gap:20px;grid-template-columns:minmax(0,1fr) 300px}
}
@media(max-width:760px) {
 .mindmap-page .topbar {height:64px;padding:0 20px}
 .mindmap-page .topbar img {width:132px}
 .map-create main {display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:12px 20px 28px;gap:14px}
 .map-intro .library-welcome-map {width:156px;margin:0 0 8px}
 .map-intro {align-self:stretch}
 .map-intro h1 {font-size:36px;letter-spacing:-1.4px}
 .map-intro>p {font-size:14px;margin-top:8px}
 .map-intro>p br {display:none}
 .map-composer .source-form {padding:18px 16px}
 .map-composer .source-form>label {margin-bottom:12px}
 .map-composer .idea-input-meta {margin-bottom:14px}
 .map-composer .source-form textarea {min-height:156px;font-size:16px}
 .map-composer .input-footer {padding:16px 0 0}
 .map-create .create-howto-link {margin:0;align-self:center}
 .map-examples {gap:6px;margin-top:12px}.map-examples button {padding-inline:9px;font-size:11px}
 .map-examples>span {display:none}
 .mindmap-page .page-heading {align-items:flex-start;gap:20px;margin-bottom:28px}
 .mindmap-page .page-heading h1,.map-utility .list-page h1 {font-size:30px;letter-spacing:-1px}
 .mindmap-page .page-heading p {font-size:14px;max-width:26ch}
 .map-utility .list-page {padding:32px 20px}
 .map-library .page-heading {flex-direction:column}
 .map-library .project-row {padding:0 8px 0 0}
 .map-library .project-link {grid-template-columns:40px minmax(0,1fr);gap:12px;padding:18px 8px 18px 16px}
 .map-library .project-open {display:none}
 .library-guidance {grid-template-columns:1fr;gap:20px;padding:20px}
 .map-library .project-symbol {width:40px;height:40px;border-radius:10px}
 .map-library .project-row time {display:none}
 .map-library .project-name strong {font-size:14px}
 .map-library .project-name small {font-size:12px}
 .map-export .map-export-content {padding:20px}
 .back-link {margin-bottom:16px}
 .export-layout {grid-template-columns:1fr;gap:20px}
 .map-export .share-options {order:-1}
 .map-export .explorer[data-family=mindmap] .graph-scroll {height:260px}
 .map-export .export-preview .explorer-footnote {bottom:80px;right:14px}
 .map-export .share-options>div {padding:24px}
 .generation-state {min-height:calc(100svh - 220px)}
 .generation-state--compact {min-height:0}
}
@media(max-width:760px) and (max-height:820px) {
 .map-intro .library-welcome-map {width:112px;margin-bottom:4px}
 .map-intro h1 {font-size:30px}
 .map-intro>p {margin-top:6px}
 .map-create main {gap:12px}
}
@media(prefers-reduced-motion:reduce) {.mindmap-page .button {transition:none}}

.generation-note,.generation-copy p,.generation-recovery {color:#716b7c}

/* Navigation is a compact workspace control, not a pair of text links. */
.topbar-actions {display:flex;align-items:center;gap:20px}
.topbar :is(.nav-full-app,.nav-mindmapping-tools) {display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:8px 16px;border:1px solid #e6ba71;border-radius:12px;background:linear-gradient(135deg,#ffe8bd,#f6ce8a);color:#50330e;font:650 13px/20px ui-sans-serif,system-ui,sans-serif;text-decoration:none;white-space:nowrap;box-shadow:0 2px 5px #79501a0a,inset 0 1px 0 #ffffff80;transition:background .16s,border-color .16s,box-shadow .16s}
.topbar :is(.nav-full-app,.nav-mindmapping-tools) svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.topbar :is(.nav-full-app,.nav-mindmapping-tools):hover {background:linear-gradient(135deg,#ffdfaa,#f2bd6b);border-color:#c79546;box-shadow:0 3px 10px #79501a18}
.topbar :is(.nav-full-app,.nav-mindmapping-tools):focus-visible {outline:3px solid #5935d5;outline-offset:3px}
.topbar :is(.nav-full-app,.nav-mindmapping-tools):active {box-shadow:inset 0 1px 3px #79501a26}
@media(prefers-reduced-motion:reduce) {.topbar :is(.nav-full-app,.nav-mindmapping-tools) {transition:none}}
.topbar .nav-mindmapping-tools {border-color:#a4cc97;background:linear-gradient(135deg,#def4d2,#b4dfad);color:#254a2b;box-shadow:0 2px 5px #315c260a,inset 0 1px 0 #ffffff80}
.topbar .nav-mindmapping-tools:hover {background:linear-gradient(135deg,#cfedbf,#9ed192);border-color:#7cae6d;box-shadow:0 3px 10px #315c2618}
.topbar .nav-mindmapping-tools:active {box-shadow:inset 0 1px 3px #315c2626}
.topbar nav.workspace-nav {display:flex;align-items:center;gap:4px;padding:4px;border:1px solid #e7e1ed;border-radius:14px;background:#f4f0f7}
.topbar .workspace-nav a {min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:8px 14px;border:0;border-radius:10px;color:#655675;text-decoration:none;font:550 var(--workspace-control-font-size,13px)/20px ui-sans-serif,system-ui,sans-serif;white-space:nowrap}
.topbar .workspace-nav svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.topbar .workspace-nav .nav-library:hover,.topbar .workspace-nav .nav-library[aria-current=page] {background:#fff;color:#4524b2;box-shadow:0 1px 3px #38235410;border:0}
.topbar .workspace-nav .nav-new,.topbar .workspace-nav .nav-new[aria-current=page] {background:#5935d5;color:#fff;border:0;box-shadow:0 1px 3px #3823540c}
.topbar .workspace-nav .nav-new:hover,.topbar .workspace-nav .nav-new[aria-current=page]:hover {background:#4524b2;color:#fff}
.topbar .workspace-nav a:focus-visible {outline:2px solid #5935d5;outline-offset:3px}
@media(max-width:767px) {
 .topbar,.mindmap-page .topbar {height:auto;min-height:64px;padding:10px 16px;gap:8px 12px;display:grid;grid-template-columns:auto minmax(0,1fr)}
 .topbar-actions {display:contents}
 .topbar :is(.nav-full-app,.nav-mindmapping-tools) {grid-column:1/-1;grid-row:1;justify-self:stretch;padding:7px 12px;border-radius:8px;gap:8px;font-size:12px}
 .topbar>a[aria-label="mindmap.com home"] {grid-column:1;grid-row:2}
 .topbar-actions>nav {grid-column:2;grid-row:2;justify-self:end}
}
@media(max-width:600px) {
 .mindmap-page {--workspace-control-font-size:12px}
 .topbar nav.workspace-nav {gap:4px;padding:4px;border-radius:13px}
 .topbar .workspace-nav a {display:inline-flex!important;min-height:38px;padding:7px 10px;gap:7px}
 .topbar .workspace-nav .nav-new {width:38px;padding:7px}
 .topbar .workspace-nav .nav-new span {display:none}
 .topbar .workspace-nav .nav-library svg {width:16px;height:16px}
}

/* Growth actions explain the relationship before asking for a new title. */
.explorer[data-family=mindmap] .map-add-actions {display:flex;gap:8px;border:0;margin:18px 0 0;padding:0}
.explorer[data-family=mindmap] .map-grow-action {display:flex;flex:1;min-width:0;flex-direction:column;align-items:flex-start;gap:8px;min-height:86px;padding:12px;border:1px solid #e7e1ed;border-radius:10px;background:#fbf9fd;color:#443653;cursor:pointer;text-align:left}
.explorer[data-family=mindmap] .map-grow-action:hover {background:#f4effb;border-color:#bda7df}
.map-grow-action svg {width:24px;height:24px;fill:none;stroke:#9274ca;stroke-width:1.5;flex:none}
.map-grow-origin {fill:#e0d4f5;stroke:none}
.map-grow-new {fill:#6943d3;stroke:none}
.map-grow-action>span {display:flex;flex-direction:column;gap:4px}
.map-grow-action strong {font:600 12px/1.4 ui-sans-serif,system-ui,sans-serif}
.map-grow-action small {font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;color:#716b7c}
.explorer[data-family=mindmap] .map-grow-action:focus-visible {outline:2px solid #5935d5;outline-offset:3px}
.explorer[data-family=mindmap] .map-add-context {padding:18px 0 0;display:grid;gap:4px}
.map-add-context>span {font:400 12px/1.5 ui-sans-serif,system-ui,sans-serif;color:#716b7c}
.map-add-context strong {font:550 14px/1.5 ui-sans-serif,system-ui,sans-serif;color:#443653;padding:0;overflow-wrap:anywhere}
.explorer[data-family=mindmap] .map-create-idea {gap:14px;margin-top:24px}
.explorer[data-family=mindmap] .map-create-idea>label:first-child {font-size:13px;color:#3c304d}
.explorer[data-family=mindmap] .map-create-idea>label:first-child input {font-size:16px;min-height:48px;border-color:#bdabd9}
.map-optional-note {border:0;margin:0}
.map-optional-note summary {min-height:44px;display:flex;align-items:center;gap:8px;color:#716b7c;font:500 12px/1.5 ui-sans-serif,system-ui,sans-serif;cursor:pointer}
.map-optional-note summary::before {content:'';width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);margin:0 4px 0 1px}
.map-optional-note[open] summary::before {transform:rotate(45deg)}
.explorer[data-family=mindmap] .mindmap-rename .map-repeat {display:flex;flex-direction:row;align-items:center;gap:10px;min-height:44px;font-size:13px;font-weight:450;color:#51455e;cursor:pointer}
.explorer[data-family=mindmap] .map-repeat input {appearance:auto;width:18px;height:18px;min-height:18px;padding:0;margin:0;accent-color:#5935d5;box-shadow:none;flex:none}
.explorer[data-family=mindmap] .map-key-hint {font:400 11px/1.5 ui-sans-serif,system-ui,sans-serif;color:#716b7c;margin:0;text-align:center}
.explorer[data-family=mindmap] .map-add-back {min-height:44px;padding:8px;border:0;background:transparent;color:#716b7c;font:500 12px/1.5 ui-sans-serif,system-ui,sans-serif;cursor:pointer;border-radius:8px}
.explorer[data-family=mindmap] .map-add-back:hover {background:#f4f0fa;color:#5935d5}
@media(max-width:600px) {
 .explorer[data-family=mindmap] .map-grow-action {flex-direction:row;align-items:center;gap:8px;min-height:68px;padding:10px}
 .map-grow-action svg {width:24px;height:24px}
 .map-grow-action strong {font-size:12px}
 .map-grow-action small {font-size:11px}
 .explorer[data-family=mindmap] .map-create-idea {margin-top:16px;gap:8px}
 .explorer[data-family=mindmap] .map-add-context {padding-top:14px}
}

.explorer[data-family=mindmap] .map-create-idea :is(input,textarea):focus-visible {outline-color:#5935d5}
/* Legacy views share the same navigation and narrow-screen fit. */
.topbar nav.workspace-nav a {display:inline-flex}
@media(max-width:400px) {
 .topbar>a[aria-label="mindmap.com home"] {padding:0;flex-shrink:0}
 .topbar>a[aria-label="mindmap.com home"] img {width:110px;height:auto}
}

/* Fine interaction states use the same surface, focus and icon treatment. */
.mindmap-page {min-height:100svh;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}
.topbar>a[aria-label="mindmap.com home"] {display:flex;align-items:center;min-height:44px;border-radius:6px}
.topbar .workspace-nav a,.map-grow-action,.map-examples button,.project-row {transition:background .16s,border-color .16s,box-shadow .16s}
.map-composer .source-form {transition:border-color .16s,box-shadow .16s}
.map-composer .source-form:focus-within {border-color:#a58acb;box-shadow:0 0 0 4px #5935d508,0 8px 28px #35214e06}
.map-composer .source-form textarea:focus-visible {outline:2px solid #5935d5;outline-offset:2px}
.map-composer .input-options summary::after,.map-branch-tools summary::after {content:'';width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:auto;margin-right:4px}
.map-composer .input-options[open] summary::after,.map-branch-tools[open] summary::after {transform:rotate(225deg)}
.map-library .project-open {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.map-editor .panel-tabs button:hover,.map-editor .panel-tabs button[aria-expanded=true] {background:#f0eaf8;color:#5935d5}
.map-editor .workspace .panel-open {border-color:var(--map-line);box-shadow:0 8px 32px #35214e12}
.explorer[data-family=mindmap] .detail-close {display:grid;place-items:center}
.detail-close svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.explorer[data-family=mindmap] .mindmap-rename :is(input,textarea):focus-visible {outline:2px solid var(--map-focus);outline-offset:2px;border-color:#baa8d6}
.explorer[data-family=mindmap] .mindmap-rename textarea::placeholder {color:#776d84}
.explorer[data-family=mindmap] .mindmap-save {border-radius:10px;font-size:14px;box-shadow:inset 0 1px 0 #ffffff18}
.explorer[data-family=mindmap] .mindmap-save:disabled {background:#f1edf5;border-color:#f1edf5;color:#81758e;box-shadow:none}
.explorer[data-family=mindmap] .map-branch-tools {border-top:1px solid var(--map-line);padding-top:8px;margin-top:20px}
.explorer[data-family=mindmap] .detail-provenance {padding-top:16px;margin-top:12px;font-size:11px;line-height:1.6}
.explorer[data-family=mindmap] .map-repeat input {appearance:none;display:grid;place-content:center;width:18px;height:18px;min-height:18px;border:1px solid #b6a9c7;border-radius:5px;background:#fff}
.explorer[data-family=mindmap] .map-repeat input:checked {background:#5935d5;border-color:#5935d5}
.explorer[data-family=mindmap] .map-repeat input:checked::after {content:'';width:8px;height:4px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:translateY(-1px) rotate(-45deg)}
@media(max-width:600px) {
 .map-grow-action small {letter-spacing:0}
 .explorer[data-family=mindmap] .map-grow-action {min-height:72px;gap:6px}
 .explorer[data-family=mindmap] .map-key-hint {display:none}
 .explorer[data-family=mindmap] .map-create-idea {gap:8px;margin-top:16px}
 .map-library .project-row {align-items:center}
}
@media(prefers-reduced-motion:reduce) {
 .topbar .workspace-nav a,.map-grow-action,.map-examples button,.project-row,.map-composer .source-form {transition:none}
}

/* Title, panel navigation and map actions share real layout space. */
.map-editor .project-heading>div:not(.map-actions) {min-width:0;flex:1}
.project-heading .map-actions {display:flex;align-items:center;gap:8px;flex:none;min-width:0}
.project-heading .map-actions .button {margin:0}
.map-editor .project-heading h1 {max-width:none}
.map-editor .project-heading .panel-tabs {position:static;flex:none;padding:0;gap:2px}
.map-editor .project-heading .button {flex:none;min-height:44px;padding:10px 14px;gap:9px;font-size:var(--workspace-control-font-size);font-weight:500;line-height:20px}
.map-editor .project-heading .button svg {width:18px;height:18px}
.map-editor .project-heading .button:focus-visible {outline:2px solid #5935d5;outline-offset:3px}
@media(max-width:760px) {
 .map-editor .project-heading {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;padding:12px 16px 8px}
 .map-editor .project-heading h1 {max-width:none;font-size:16px}
 .map-editor .project-heading .map-actions {grid-column:2;grid-row:1}
 .map-editor .project-heading .button {padding:9px 10px;gap:6px}
 .map-editor .project-heading .button svg {width:16px;height:16px}
 .map-editor .project-heading .panel-tabs {grid-column:1/-1;grid-row:2;margin-left:-10px}
 .map-editor .project-heading .panel-tabs button {padding-inline:10px}
}
@media(max-width:380px) {.map-create main {padding-inline:16px}.map-composer .source-form {padding-inline:12px}}
@media(max-width:400px) and (min-height:821px) {.map-intro h1 {font-size:34px}.map-examples button {font-size:11px;padding-inline:8px}}

/* AI refinement has one job; direct editing stays on the canvas. */
.map-editor .workspace #inspect-panel.panel-open:has(.map-refine-content) {width:380px;padding:24px;max-width:calc(100% - 40px)}
.map-refine-content h2 {margin:0 0 10px;font-size:21px!important}
.map-refine-content p {font-size:13px;line-height:1.65;color:var(--map-muted)}
.map-refine-content .refine-edit-hint {padding:12px 14px;background:var(--map-soft);border-radius:10px;font-size:12px;margin:16px 0 22px}
.map-refine-content .refine-request {border:0;margin:0;padding:0}
.map-refine-content label {font-size:13px;font-weight:550;margin:16px 0 8px}
.map-refine-content textarea {min-height:112px;padding:12px;resize:vertical}
.map-refine-content select {padding:11px 12px}
.map-refine-content textarea::placeholder {color:#776d84}
.map-refine-content .refine-preserved {font-size:12px;margin:12px 0 0}
.map-refine-content summary {cursor:pointer;min-height:44px;align-content:center;font-size:13px;color:var(--map-muted)}
.map-refine-content h3 {font-size:14px;margin:18px 0 12px}
.refine-comparison {border:1px solid var(--map-line);border-radius:10px;overflow:hidden;margin-bottom:12px}
.refine-comparison>div {padding:12px 14px}
.refine-comparison>div+div {background:#f4effb;border-top:1px solid var(--map-line)}
.refine-comparison span {font-size:11px;color:var(--map-muted)}
.refine-comparison p {margin:4px 0 0;color:var(--map-ink)}
.refine-decisions {display:flex;gap:8px;margin-bottom:24px}
.map-refine-content .refine-decisions form {flex:1;border:0;margin:0;padding:0}
.map-refine-content .refine-decisions button {padding-inline:8px;font-size:12px}
@media(max-width:600px) {.map-editor .workspace #inspect-panel.panel-open:has(.map-refine-content) {left:10px;right:10px;width:auto;max-width:none;max-height:calc(100dvh - 200px);padding:20px}}

.js-panels .map-editor #inspect-panel:has(.map-refine-content):not(.versions-only)>#versions-panel {display:none}
.js-panels .map-editor #inspect-panel.versions-only>.map-refine-content {display:none}
.refine-heading,.panel-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-6px -10px 8px 0}
.refine-heading h2,.panel-heading :is(h2,h3) {margin:0}
.map-editor .refine-heading .refine-close,.map-editor .panel-heading .panel-close {display:grid;place-items:center;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;border-radius:10px;color:var(--map-muted);cursor:pointer}
.refine-close svg,.panel-close svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.map-editor .refine-heading .refine-close:hover,.map-editor .panel-heading .panel-close:hover {background:var(--map-soft)}
@media(max-width:600px) {.map-editor .workspace #inspect-panel.panel-open:has(.map-refine-content) {position:fixed;top:auto;bottom:12px;margin-bottom:0;z-index:11;box-shadow:0 -6px 30px #35214e18}}

/* Panel dismissal and version history use the same quiet control hierarchy. */
.mindmap-page :is(a,button,input,textarea,select,summary):focus-visible {outline:2px solid var(--map-focus);outline-offset:3px}
.panel-heading :is(h2,h3):focus,.refine-heading h2:focus {outline:none}
html:not(.js-panels) .map-editor .panel-heading .panel-close {display:none}
.map-editor .versions {list-style:none;padding:0;margin:8px 0 0}
.map-editor .versions li {display:block;padding:18px 0;border-top:1px solid var(--map-line);font-size:13px}
.map-editor .version-heading {display:flex;align-items:center;justify-content:space-between;gap:12px}
.map-editor .version-number {font-size:13px;font-weight:600;color:var(--map-ink)}
.map-editor .version-current {font-size:11px;font-weight:500;color:#5935d5;background:#f4effb;border-radius:5px;padding:3px 8px}
.map-editor .version-summary {font-size:13px;line-height:1.5;color:var(--map-muted);margin:6px 0 0}
.map-editor .versions li form {border:0;padding:0;margin:12px 0 0}
.map-editor .versions .button {min-height:44px;font-size:12px;font-weight:500;padding:9px 12px}
@media(max-width:760px) {
 .map-library .project-name strong {white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.45;overflow:hidden}
}

.map-verification{margin-top:16px;min-width:0}
.map-verification [data-verification-status]{font-size:13px;line-height:1.5;color:var(--muted,#625d70);margin:8px 0 0}
.source-form button[type=submit]:disabled{opacity:.55;cursor:not-allowed}

.create-howto-link {grid-column:1/-1;justify-self:center;display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:16px;color:#7954a4;font-size:12px;line-height:1.6;text-decoration:none}
.create-howto-link:hover {color:#5935d5;text-decoration:underline;text-underline-offset:4px}
.create-howto-link:focus-visible {outline:3px solid #7954c7;outline-offset:4px;border-radius:4px}

@media(max-width:600px) {
 .map-editor .map-actions .button {width:44px;padding:10px}
 .map-editor .map-actions .button>span {display:none}
 .map-editor .map-actions .button svg {width:18px;height:18px}
}