:root{font-family:'DM Sans',Arial,sans-serif;color:#182a30;background:#f6f5f1}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{text-decoration:none;color:inherit}.app-shell{display:flex;height:100dvh;min-height:560px;overflow:hidden}.sidebar{width:242px;flex:none;background:#162b2e;color:#f1f7f5;display:flex;flex-direction:column;padding:0 14px}.brand{height:72px;display:flex;align-items:center;gap:13px;padding:0 13px;border-bottom:1px solid #ffffff20}.brand-mark{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700;letter-spacing:.03em}.brand-mark span{color:#75dfba}.brand-separator{height:21px;width:1px;background:#ffffff3a}.brand-app{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:19px;letter-spacing:-.05em;color:#b7e4d5}.sidebar-heading,.rail-heading,.inspector-head{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;font-size:10px;letter-spacing:.16em;font-weight:700;color:#8faeaa}.icon-button{border:0;background:transparent;color:inherit;font-size:23px;line-height:1;width:30px;height:30px;border-radius:7px}.icon-button:hover,.subtle-button:hover{background:#ffffff1d}.board-list{overflow:auto;display:grid;gap:4px}.board-item{border:0;width:100%;display:flex;align-items:center;gap:11px;text-align:left;padding:11px 12px;color:#adc8c4;background:transparent;border-radius:9px;font-size:13px}.board-item:hover{background:#ffffff12}.board-item.active{background:#294945;color:#e9fff5}.board-symbol{display:grid;place-items:center;width:24px;height:24px;flex:none;border-radius:6px;background:#89d8bd22;color:#91e0c4;font-family:'Space Grotesk',sans-serif;font-size:15px}.board-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-bottom{margin-top:auto;padding:16px 5px 17px}.sidebar-tip{padding:17px;background:#25403d;border:1px solid #385952;border-radius:12px}.tip-icon{color:#90e2c0;font-size:19px}.sidebar-tip strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:14px;margin:8px 0 5px}.sidebar-tip p{font-size:11px;line-height:1.55;color:#a6c4bd;margin:0}.account{margin-top:17px;padding:13px 8px 0;border-top:1px solid #ffffff21;color:#abc9c3;font-size:12px}.account a{text-decoration:underline}.main-area{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{height:72px;flex:none;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #e4e6e2;padding:0 25px}.breadcrumbs{display:flex;align-items:center;gap:10px;font-size:13px;color:#87979b}.breadcrumbs strong{color:#1d3639;font-weight:700}.crumb-arrow{color:#bec9ca}.subtle-button{border:0;background:transparent;color:#8ba1a2;border-radius:6px;padding:5px 9px}.top-actions{display:flex;align-items:center;gap:17px}.save-state{font-size:11px;color:#829996;white-space:nowrap}.save-dot{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#85d6b5}.save-state.error .save-dot{background:#ec9d84}.top-button{padding:9px 13px;background:#fff;border:1px solid #d9e1df;color:#385652;border-radius:7px;font-size:11px;font-weight:700}.top-button:hover{border-color:#8abfac}.workspace{display:flex;min-height:0;flex:1}.page-rail{width:196px;flex:none;background:#fbfbf8;border-right:1px solid #e6e8e4;display:flex;flex-direction:column;padding:0 11px}.rail-heading{padding:0 8px;color:#92a1a2}.rail-heading .icon-button{color:#53756d}.page-list{overflow:auto;display:grid;align-content:start;gap:5px}.page-item{border:1px solid transparent;background:transparent;text-align:left;border-radius:9px;padding:12px 12px;color:#647978;font-size:12px;display:flex;align-items:center;gap:10px}.page-item:hover{background:#eef3ee}.page-item.active{background:#e6f2ec;border-color:#cce5d7;color:#1c5045;font-weight:700}.page-symbol{width:20px;height:20px;border:1px solid currentColor;border-radius:5px;display:grid;place-items:center;font:10px 'Space Grotesk',sans-serif;flex:none}.page-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rail-footer{margin-top:auto;border-top:1px solid #e9ece8;padding:17px 8px;color:#a0aca9;font-size:10px}.canvas-panel{position:relative;flex:1;min-width:0;background:#f6f7f3;overflow:hidden}.canvas-top{height:59px;position:absolute;z-index:2;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:#f9faf7ea;border-bottom:1px solid #e8ebe6}.canvas-title{display:flex;align-items:center;gap:6px;font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:700}.canvas-title .subtle-button{font-family:Arial,sans-serif;font-size:15px}.canvas-hint{font-size:11px;color:#a5b0ac}.viewport{position:absolute;inset:59px 0 0;overflow:hidden;touch-action:none;background-image:radial-gradient(#c9d8ce 1px,transparent 1px);background-size:23px 23px;background-position:center}.world{position:absolute;left:0;top:0;transform-origin:0 0}.edges{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none}.edges path{fill:none;stroke:#84bbaa;stroke-width:2.2;stroke-linecap:round;pointer-events:stroke;cursor:pointer}.edges path.selected{stroke:#256d58;stroke-width:3.5}.node{position:absolute;min-width:150px;max-width:290px;min-height:58px;padding:14px 17px;background:#fff;border:1.5px solid #d6e1d9;border-radius:13px;box-shadow:0 10px 24px #40605216;color:#263d3b;user-select:none;touch-action:none}.node:hover{border-color:#9acdb7}.node.selected{border-color:#3aa879;box-shadow:0 0 0 3px #68c99d30,0 15px 28px #40605220}.node.topic{min-width:178px;background:#e3f4e9;border-color:#afd9bf;border-radius:27px;padding:16px 21px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:15px}.node.text{border-color:transparent;background:transparent;box-shadow:none;font-size:16px;line-height:1.5;max-width:300px;min-width:130px;white-space:pre-wrap}.node.text.selected{border-color:#3aa879;background:#ffffffb5;box-shadow:0 0 0 3px #68c99d30}.node.shape{min-width:145px;min-height:105px;display:grid;place-items:center;text-align:center;background:#fdeac7;border-color:#edce8d;border-radius:13px;font-family:'Space Grotesk',sans-serif;font-weight:600}.node.shape.ellipse{border-radius:50%}.node.shape.diamond{transform:rotate(45deg);width:130px;height:130px;min-width:0}.node.shape.diamond .node-content{transform:rotate(-45deg)}.node.file{width:215px;max-width:215px;padding:12px}.node.file img{width:100%;height:130px;object-fit:cover;border-radius:8px;display:block;margin-bottom:11px}.node.file .file-icon{width:43px;height:43px;display:grid;place-items:center;background:#e7ecf4;color:#6183a3;border-radius:9px;font-size:20px;margin-bottom:10px}.node-content{white-space:pre-wrap;overflow-wrap:anywhere}.node.file .node-content{font-size:12px;font-weight:700}.node.file small{display:block;margin-top:5px;color:#81918f;font-size:10px}.node.file a{color:#30755c;text-decoration:underline}.empty-canvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;max-width:340px;pointer-events:none}.empty-canvas[hidden]{display:none}.empty-canvas>*{pointer-events:auto}.empty-spark{font-size:39px;color:#62bd8f}.empty-canvas h2{font-family:'Space Grotesk',sans-serif;letter-spacing:-.04em;font-size:25px;margin:12px 0 9px}.empty-canvas p{font-size:12px;line-height:1.6;color:#82948e;margin:0 0 18px}.primary-button{border:0;border-radius:8px;background:#1e654b;color:#fff;padding:12px 17px;font-size:12px;font-weight:700}.primary-button:hover{background:#167d55}.canvas-toolbar{position:absolute;z-index:4;left:50%;bottom:23px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:7px;background:#fff;border:1px solid #dfe9e1;border-radius:13px;box-shadow:0 16px 36px #274a3a23}.canvas-toolbar button{border:0;background:transparent;border-radius:8px;padding:7px 12px;color:#667c76;font-size:10px;font-weight:700;display:grid;justify-items:center;gap:2px;min-width:54px}.canvas-toolbar button:hover,.canvas-toolbar button.active{background:#e9f5eb;color:#1e704e}.tool-icon{font-family:'Space Grotesk',sans-serif;font-size:21px;line-height:23px;color:#276d55}.topic-icon{font-size:18px}.shape-icon{font-size:24px}.toolbar-divider{height:31px;width:1px;background:#e3e9e4;margin:0 3px}.zoom-controls{position:absolute;z-index:4;bottom:28px;right:23px;display:flex;align-items:center;gap:3px;background:#fff;border:1px solid #e0e7e0;border-radius:9px;padding:5px;box-shadow:0 10px 26px #274a3a16}.zoom-controls button{border:0;background:transparent;color:#567266;width:24px;height:25px;font-size:17px;border-radius:4px}.zoom-controls button:hover{background:#e8f3e9}.zoom-controls span{font-size:10px;color:#6a8377;min-width:37px;text-align:center}.inspector{width:234px;flex:none;background:#fff;border-left:1px solid #e6e8e4;display:flex;flex-direction:column}.inspector-head{padding:0 17px;border-bottom:1px solid #eef0ec;color:#91a19f}.inspector-head .icon-button{color:#819795}.inspector-body{padding:20px 17px;overflow:auto}.inspector-empty{text-align:center;color:#9daead;font-size:12px;line-height:1.6;padding-top:60px}.inspector-empty span{display:block;font-size:27px;color:#97c5ad}.field-label{display:block;color:#819491;font-size:10px;font-weight:700;letter-spacing:.12em;margin:0 0 8px}.field-input,.field-textarea{width:100%;border:1px solid #dce6df;border-radius:8px;background:#fcfdfa;color:#29433b;padding:10px;font-size:12px;outline:none}.field-input:focus,.field-textarea:focus{border-color:#56ae7c}.field-textarea{min-height:105px;resize:vertical;line-height:1.5}.field-group{margin-bottom:23px}.inspector-type{font-size:12px;font-weight:700;color:#315c49;margin-bottom:20px}.shape-options{display:flex;gap:5px}.shape-options button{padding:7px 9px;border:1px solid #dce6df;background:#fff;border-radius:6px;font-size:10px}.shape-options button.active{border-color:#5aaa79;background:#e6f4e9;color:#2c7550}.inspector-button{border:1px solid #e7c9c0;background:#fff9f7;color:#a35d4e;border-radius:7px;padding:9px 11px;font-size:11px;font-weight:700}.link-list{display:grid;gap:7px}.link-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#6a8178}.link-row button{border:0;background:none;color:#ab756b;font-size:16px}.toast{position:fixed;z-index:20;bottom:22px;left:50%;transform:translateX(-50%) translateY(16px);background:#1d4035;color:#fff;border-radius:8px;padding:10px 16px;font-size:12px;box-shadow:0 10px 30px #183d3133;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.welcome{position:fixed;z-index:10;inset:0;background:#f3f6efed;display:grid;place-items:center}.welcome[hidden]{display:none}.welcome-card{width:min(440px,calc(100vw - 32px));padding:42px;background:#fff;border:1px solid #dfe8df;border-radius:18px;box-shadow:0 25px 70px #28473720}.welcome-mark{font-size:34px;color:#58bd81}.welcome-kicker{font-size:10px;color:#4e9b6d;font-weight:700;letter-spacing:.17em;margin:18px 0 10px}.welcome-card h1{font:700 43px/1.05 'Space Grotesk',sans-serif;letter-spacing:-.06em;margin:0 0 16px}.welcome-card>p:not(.welcome-kicker){color:#82938b;font-size:14px;line-height:1.65;margin:0 0 26px}.welcome-card>a{display:block;color:#277e55;font-size:13px;margin-top:16px;text-decoration:underline}
@media(max-width:1200px){.inspector{width:210px}.page-rail{width:164px}.sidebar{width:207px}}@media(max-width:950px){.sidebar{width:70px;padding:0 8px}.brand{justify-content:center;padding:0}.brand-mark,.brand-separator,.sidebar-heading span,.board-name,.sidebar-tip,.account{display:none}.brand-app{font-size:20px}.board-item{justify-content:center;padding:9px}.sidebar-heading{justify-content:center}.page-rail{width:145px}.inspector{position:absolute;z-index:7;right:0;top:72px;bottom:0;box-shadow:-10px 0 30px #223b2c17}.inspector:not(.open){display:none}}@media(max-width:650px){.topbar{padding:0 13px;height:59px}.workspace{position:relative}.sidebar{width:55px}.page-rail{width:92px;padding:0 5px}.page-item{padding:10px 6px;gap:5px;font-size:10px}.rail-heading{font-size:9px}.rail-footer,.top-actions .top-button,.canvas-hint{display:none}.canvas-top{padding:0 13px}.canvas-toolbar{bottom:14px;gap:0;padding:4px}.canvas-toolbar button{min-width:40px;padding:6px;font-size:8px}.tool-icon{font-size:17px}.zoom-controls{right:9px;bottom:78px}.inspector{top:59px;width:min(240px,75vw)}}
.dialog{position:fixed;z-index:30;inset:0;background:#142c2999;display:grid;place-items:center;padding:16px}.dialog[hidden]{display:none}.dialog-card{width:min(390px,100%);background:#fff;border-radius:16px;padding:27px;box-shadow:0 25px 75px #102a2960}.dialog-card .welcome-kicker{margin:0 0 9px}.dialog-card h2{font:700 25px/1.2 'Space Grotesk',Arial,sans-serif;letter-spacing:-.04em;margin:0 0 20px}.dialog-message{font-size:13px;line-height:1.6;color:#687e77;margin:0 0 20px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}.dialog-actions .primary-button{min-width:95px}.dialog-actions .primary-button.danger{background:#a95043}.dialog-actions .primary-button.danger:hover{background:#8d3c32}
.storage-summary{padding:12px 8px;border-top:1px solid #ffffff22;display:grid;gap:6px;font-size:11px;color:#b8d8cb}.storage-summary strong{font-size:12px;color:#e5f6ee}.storage-summary progress{width:100%;height:8px;accent-color:#86deb6}.boardy-settings{display:grid;place-items:center;margin:10px 8px 0;width:34px;height:34px;border:1px solid #4c7267;border-radius:8px;color:#a2e4c6;font-size:21px}.boardy-settings:hover{background:#34534b}.node.document{width:235px;max-width:235px;min-height:130px;background:#fffdf5;border-color:#e0d5b8}.node.document:before{content:'▤';display:block;color:#a88137;font-size:24px;margin-bottom:8px}.node.document .node-content{font-weight:700;font-size:14px}.node.document small{display:block;color:#7d8b84;font-size:11px;margin-top:8px;line-height:1.4}.side-panel{position:absolute;z-index:9;right:0;top:72px;bottom:0;width:min(330px,85vw);background:#fff;border-left:1px solid #dce6dd;box-shadow:-15px 0 30px #223b2c1c;display:flex;flex-direction:column}.side-panel[hidden]{display:none}.side-panel-head{height:60px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5ebe5}.side-panel-head button{border:0;background:none;color:#638076;font-size:24px}.side-panel-list{overflow:auto;flex:1;padding:13px}.side-panel-item{display:grid;gap:7px;padding:12px;border:1px solid #e3eae2;border-radius:10px;margin-bottom:9px;font-size:12px;color:#3a5850}.side-panel-item strong{overflow-wrap:anywhere}.side-panel-item small{color:#82978e}.side-panel-item button,.side-panel-item a{justify-self:start;background:#edf6ef;border:1px solid #c5e2cf;color:#245d45;border-radius:6px;padding:6px 9px;font-size:11px}.side-panel-item button.danger{background:#fff5f3;border-color:#e7c8bd;color:#a04f40}#panelMore{margin:10px;border:1px solid #c5e2cf;border-radius:8px;background:#edf6ef;color:#245d45;padding:10px}.rich-dialog{position:fixed;z-index:35;inset:0;background:#142c29ad;display:grid;place-items:center;padding:15px}.rich-dialog[hidden]{display:none}.rich-card{background:#fff;width:min(850px,100%);height:min(90vh,830px);display:flex;flex-direction:column;border-radius:16px;box-shadow:0 25px 80px #102a2966;overflow:hidden}.rich-head{display:flex;align-items:center;justify-content:space-between;padding:18px 25px;border-bottom:1px solid #e3ebe2}.rich-head .welcome-kicker{margin:0 0 7px}.rich-head input{border:0;outline:none;font:700 26px 'Space Grotesk',Arial,sans-serif;color:#29483a;width:min(580px,65vw)}.rich-head button{border:0;background:none;font-size:27px;color:#789083}.rich-toolbar{display:flex;flex-wrap:wrap;gap:5px;padding:9px 18px;border-bottom:1px solid #e3ebe2}.rich-toolbar button{background:#f3f7f2;border:1px solid #d7e4d6;color:#315b47;border-radius:6px;min-width:35px;padding:7px 10px;font-size:12px}.rich-toolbar button:hover{background:#dff1e2}.rich-editor{flex:1;overflow:auto;padding:28px 34px;outline:none;color:#213c32;font-size:15px;line-height:1.7}.rich-editor:empty:before{content:'Write your document…';color:#a3b2a8}.rich-editor h2{font-size:24px;line-height:1.3}.rich-editor p{margin:0 0 14px}.rich-editor img{max-width:100%;max-height:360px;display:block;margin:16px 0;border-radius:8px}.rich-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 22px;border-top:1px solid #e3ebe2;color:#7f9286;font-size:12px}@media(max-width:650px){.top-actions{gap:4px}.top-actions .action-button{display:inline-flex;padding:5px 7px;font-size:10px}.top-actions #activityAction{display:none}.save-state{display:none}.rich-editor{padding:20px}.rich-head{padding:14px 18px}}
.sidebar-tools{display:flex;align-items:center;justify-content:space-between;padding:0 8px}.boardy-trash{border:1px solid #4c7267;border-radius:8px;background:transparent;color:#a2e4c6;font-size:12px;padding:8px 11px}.boardy-trash:hover{background:#34534b}.sidebar-tools .boardy-settings{margin:10px 0 0}
.sidebar .board-list{max-height:24vh;flex:none}.storage-heading{border-top:1px solid #ffffff20;margin-top:8px;flex:none}.storage-actions{display:flex;flex-wrap:wrap;gap:5px;padding:0 7px 11px}.storage-actions button{border:1px solid #4c7267;background:#25403d;color:#ccebdd;border-radius:6px;padding:5px 7px;font-size:10px}.storage-actions button:hover{background:#345b4c}.storage-tree{flex:1;min-height:70px;overflow:auto}.storage-row{display:flex;align-items:center;min-width:0;padding-right:5px}.storage-item{border:0;background:none;color:#adc8c4;border-radius:7px;padding:7px 4px;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:12px}.storage-item:hover,.storage-item.active{background:#294945;color:#e9fff5}.storage-rename{border:0;background:none;color:#8fb8a8;font-size:12px;padding:6px;opacity:.45}.storage-row:hover .storage-rename{opacity:1}.config-card{width:min(500px,100%)}.config-card .field-label{margin:14px 0 7px}.config-card .field-textarea{min-height:180px;font-family:ui-monospace,SFMono-Regular,monospace}.config-card .dialog-message{color:#a95043;margin:10px 0}
@media(max-width:950px){.storage-heading span,.storage-actions button,.storage-rename{display:none}.storage-heading{justify-content:center}.storage-actions{justify-content:center}.storage-tree{min-height:20px}.storage-item{font-size:12px}}
@media(max-width:950px){.sidebar:hover,.sidebar:focus-within{width:220px;z-index:12}.sidebar:hover .storage-heading span,.sidebar:focus-within .storage-heading span,.sidebar:hover .storage-actions button,.sidebar:focus-within .storage-actions button,.sidebar:hover .storage-item,.sidebar:focus-within .storage-item,.sidebar:hover .storage-rename,.sidebar:focus-within .storage-rename,.sidebar:hover .board-name,.sidebar:focus-within .board-name{display:block}.sidebar:hover .brand-mark,.sidebar:focus-within .brand-mark{display:block}}
.storage-file-row{display:flex;align-items:center;min-width:0}.storage-file-row .page-item{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storage-file-settings{border:0;background:transparent;color:#7c9a8c;padding:7px;font-size:12px}.storage-file-settings:hover{color:#2b694b;background:#e6f2ec;border-radius:6px}
.storage-empty{padding:8px;color:#879991;font-size:11px;line-height:1.5}

/* Pointer and touch controls */
[hidden]{display:none!important}
.nav-toggle,.sidebar-close,.top-more{display:none}
.sidebar-backdrop{position:fixed;inset:0;z-index:11;background:#142c2999}
.canvas-context{position:fixed;z-index:18;min-width:170px;padding:6px;background:#fff;border:1px solid #d7e5da;border-radius:11px;box-shadow:0 15px 40px #17392a33}
.canvas-context button{display:block;width:100%;min-height:42px;border:0;border-radius:7px;background:transparent;text-align:left;padding:8px 12px;color:#244638;font-size:13px}
.canvas-context button:hover,.canvas-context button:focus-visible{background:#e8f5ec}
.viewport{cursor:grab}
.viewport:active,.viewport.space-pan{cursor:grabbing}
.viewport.space-pan .node{cursor:grabbing}
@media(hover:none),(any-pointer:coarse){
  .icon-button,.subtle-button,.zoom-controls button,.storage-rename,.storage-file-settings,.boardy-settings{min-width:44px;min-height:44px}
  .canvas-toolbar button{min-width:58px;min-height:56px}
  .storage-actions button,.board-item,.page-item,.storage-item,.boardy-trash,.top-button{min-height:44px}
  .storage-rename{opacity:1}
}
@media(max-width:1200px){
  .app-shell{min-height:0}
  .app-shell .sidebar,.app-shell .sidebar:hover,.app-shell .sidebar:focus-within{position:fixed;z-index:12;top:0;bottom:0;left:0;width:min(320px,85vw);padding:0 14px;transform:translateX(-105%);transition:transform .2s ease;box-shadow:12px 0 30px #10291c24}
  .app-shell .sidebar.open{transform:translateX(0)}
  .sidebar .brand{justify-content:flex-start;padding:0 9px}
  .sidebar .brand-mark,.sidebar .brand-separator,.sidebar .brand-app,.sidebar .sidebar-heading span,.sidebar .board-name,.sidebar .account,.sidebar .storage-heading span,.sidebar .storage-actions button,.sidebar .storage-rename{display:block}
  .sidebar .board-item{justify-content:flex-start;padding:11px 12px}
  .sidebar .sidebar-heading{justify-content:space-between}
  .sidebar .storage-actions{justify-content:flex-start}
  .sidebar .storage-tree{min-height:70px}
  .sidebar-close{display:grid;margin-left:auto;place-items:center;color:#d0eadd;min-width:44px;min-height:44px}
  .nav-toggle{display:grid;place-items:center;flex:none;color:#3a5c50;margin-right:8px;min-width:44px;min-height:44px}
  .topbar{position:relative;padding:0 14px;gap:6px}
  .breadcrumbs{min-width:0;overflow:hidden;white-space:nowrap}
  .breadcrumbs strong{overflow:hidden;text-overflow:ellipsis}
  .top-more{display:grid;place-items:center;color:#3d6452;min-width:44px;min-height:44px}
  #topActions:not(.open) .top-button{display:none}
  #topActions.open{position:absolute;z-index:15;top:calc(100% - 2px);right:8px;width:min(260px,calc(100vw - 16px));padding:12px;display:flex;flex-wrap:wrap;gap:8px;background:#fff;border:1px solid #dce6dd;border-radius:12px;box-shadow:0 14px 32px #17392a2b}
  #topActions.open .top-button:not([hidden]){display:inline-flex;align-items:center;min-height:44px}
  #topActions.open .save-state{width:100%}
  .inspector{position:absolute;z-index:7;right:0;top:72px;bottom:0;width:min(280px,75vw);box-shadow:-10px 0 30px #223b2c17}
  .inspector:not(.open){display:none}
  .page-rail{width:164px}
}
@media(max-width:650px){
  .page-rail{width:92px}
  .canvas-toolbar{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));transform:none;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;max-width:none}
  .canvas-toolbar::-webkit-scrollbar{display:none}
  .canvas-toolbar button{min-width:54px;min-height:52px;font-size:10px}
  .zoom-controls{bottom:calc(78px + env(safe-area-inset-bottom))}
  .inspector{top:59px}
  .side-panel{top:59px}
  #topActions.open{top:calc(100% - 2px)}
}

/* Filesystem navigation and pages inside each file */
.page-rail{position:relative}
.folder-tree{display:grid;align-content:start;gap:3px;max-height:42%;min-height:44px;overflow:auto;border-bottom:1px solid #e4ebe4;padding-bottom:9px}
.page-rail .page-list{flex:none;max-height:30%;overflow:auto}
.page-rail .folder-tree[hidden]~.page-list{flex:1;max-height:none}
.folder-rail-item,.file-page-item{display:block;width:100%;min-height:38px;border:0;border-radius:8px;background:transparent;color:#58756b;text-align:left;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:7px 9px}
.folder-rail-item:hover,.file-page-item:hover{background:#eef4ef}
.folder-rail-item.active,.file-page-item.active{background:#e1f2e7;color:#1f6049;font-weight:700}
.rail-subheading{padding:14px 8px 8px;color:#91a19a;font-size:10px;font-weight:700;letter-spacing:.14em}
.file-pages{flex:1;min-height:0;overflow:auto;border-top:1px solid #e4ebe4;margin-top:8px}
.file-pages-heading{display:flex;align-items:center;justify-content:space-between;padding-top:7px}
.file-pages-heading .icon-button{color:#53756d}
.file-page-list{display:grid;align-content:start;gap:3px}
.rail-create-menu{position:absolute;z-index:10;top:53px;left:8px;width:max(196px,calc(100% - 16px));padding:5px;background:#fff;border:1px solid #dce6dd;border-radius:10px;box-shadow:0 14px 30px #17392a25}
.rail-create-menu button{display:block;width:100%;min-height:39px;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:#305b49;text-align:left;font-size:12px}
.rail-create-menu button:hover,.rail-create-menu button:focus-visible{background:#e8f5ec}
#pageCreateMenu{position:static;width:100%;box-shadow:none}
.file-page-editor{position:absolute;inset:59px 0 0;overflow:auto;background:#f9faf7;padding:24px;display:flex;flex-direction:column;gap:14px}
.file-page-editor h2{font:700 22px 'Space Grotesk',Arial,sans-serif;margin:0;color:#264b38}
.markdown-editor,.file-rich-editor{width:100%;flex:1;min-height:260px;border:1px solid #dce6df;border-radius:10px;background:#fff;color:#244335;padding:18px;outline:none;font-size:14px;line-height:1.6}
.markdown-editor{font-family:ui-monospace,SFMono-Regular,monospace;resize:none}
.file-rich-editor{overflow:auto}
.file-rich-editor p{margin:0 0 12px}
.file-rich-editor h2{font-size:21px;margin:12px 0}
.file-pdf-preview{width:100%;flex:1;min-height:400px;border:1px solid #dce6df;border-radius:10px;background:#fff}
.file-text-preview{overflow:auto;max-height:70vh;white-space:pre-wrap;overflow-wrap:anywhere;background:#fff;border:1px solid #dce6df;border-radius:10px;padding:16px;font-size:12px}
@media(hover:none),(any-pointer:coarse){.folder-rail-item,.file-page-item,.rail-create-menu button{min-height:44px}}
@media(max-width:650px){.folder-rail-item,.file-page-item{font-size:10px;padding-right:4px}.file-page-editor{padding:14px}.file-page-editor h2{font-size:18px}}

/* One Folder / File / Page navigation on desktop and touch devices. */
[hidden]{display:none!important}
.page-rail{width:286px;padding:0 13px}
.folder-rail-row{display:flex;align-items:center;min-width:0}
.folder-rail-row .folder-rail-item{flex:1;min-width:0}
.folder-rail-settings{flex:none;border:0;background:transparent;color:#789486;border-radius:6px;min-width:30px;min-height:34px;font-size:17px}
.folder-rail-settings:hover{background:#e8f2ea;color:#225b40}
.rail-heading>div{display:flex;align-items:center;gap:2px}
.rail-close{display:none}
.page-rail .page-list{max-height:28%;min-height:50px}
.page-rail .folder-tree{max-height:38%}
.page-rail .rail-footer{padding:9px 4px 12px}
.rail-footer .sidebar-bottom{padding:0;margin:0}
.rail-footer .storage-summary{border-color:#e1eae2;color:#587369}
.rail-footer .storage-summary strong{color:#315d47}
.rail-footer .account{display:block;border-color:#e1eae2;color:#587369;margin-top:0}
.rail-footer .boardy-settings{border-color:#c8dbcf;color:#356849}
.rail-footer .boardy-settings:hover{background:#e6f2e9}
.nav-toggle{display:none}
@media(max-width:1200px){
  .page-rail{position:fixed;z-index:12;top:0;bottom:0;left:0;width:min(320px,88vw);transform:translateX(-105%);transition:transform .2s ease;box-shadow:10px 0 30px #18392829}
  .page-rail.open{transform:translateX(0)}
  .rail-close{display:grid;place-items:center;min-width:44px;min-height:44px}
  .nav-toggle{display:grid}
}
@media(max-width:650px){
  .page-rail{width:min(320px,88vw);padding:0 13px}
  .folder-rail-item,.file-page-item{font-size:12px}
  .page-item{font-size:12px;padding:11px}
  .rail-footer{display:block}
}

/* Two linked expanders: Folder → File, then active File → Page. */
.page-rail .folder-tree{flex:1 1 auto;max-height:none;min-height:80px;overflow:auto;border-bottom:1px solid #e4ebe4;padding:4px 0 12px}
.tree-row{display:flex;align-items:center;min-width:0;min-height:42px;margin:2px 0;padding-left:calc(var(--tree-depth) * 15px);border-radius:9px}
.tree-row:hover{background:#eef4ef}
.tree-row.active{background:#e1f2e7}
.tree-toggle,.tree-toggle-spacer{display:grid;place-items:center;flex:none;width:30px;min-height:40px}
.tree-toggle{border:0;border-radius:7px;background:transparent;color:#527861}
.tree-toggle:hover{background:#d9ece0}
.tree-toggle:focus-visible,.tree-label:focus-visible,.tree-action:focus-visible{outline:2px solid #79b792;outline-offset:-2px}
.tree-toggle[aria-expanded="true"] .tree-icon{transform:rotate(90deg)}
.tree-label{display:flex;align-items:center;gap:8px;flex:1;min-width:0;min-height:40px;padding:6px 2px;border:0;background:transparent;color:#426752;text-align:left;font-size:12px}
.tree-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tree-icon{display:block;flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tree-icon-chevron{width:15px;height:15px;transition:transform .16s ease}
.tree-icon-folder{color:#3e885c;fill:#d8ebde}
.tree-icon-file{color:#527a6a}
.tree-icon-mindmap{color:#58856b}
.tree-icon-attachment{color:#6e8290}
.tree-icon-more{width:18px;height:18px;fill:currentColor;stroke:none}
.tree-row.active .tree-label{color:#1f6049;font-weight:700}
.tree-action{display:grid;place-items:center;flex:none;min-width:30px;min-height:38px;border:0;border-radius:7px;background:transparent;color:#789486}
.tree-action:hover{background:#d9ece0;color:#225b40}
.page-rail .file-pages{display:flex;flex:0 1 43%;flex-direction:column;min-height:55px;max-height:50%;overflow:hidden;margin-top:0;border-top:0}
.page-rail .file-pages.collapsed{flex:none}
.file-pages-heading{display:flex;align-items:center;flex:none;min-height:49px;padding:5px 2px;gap:4px}
.file-pages-toggle{flex:1;min-width:0;min-height:38px;padding:5px 8px;border:0;border-radius:7px;background:#edf5ee;color:#285f46;text-align:left;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-pages-toggle:before{content:'▾';display:inline-block;margin-right:7px}
.file-pages-toggle[aria-expanded="false"]:before{content:'▸'}
.file-pages-heading .icon-button{flex:none;color:#2e7051}
.file-page-list{flex:1;min-height:0;overflow:auto;padding:2px 4px 8px 20px}
.file-page-item{min-height:37px}
@media(hover:none),(any-pointer:coarse){.tree-row,.tree-label,.tree-toggle,.tree-action,.file-pages-toggle,.file-page-item{min-height:44px}}

/* Folder/File navigation stays in the rail; the active File owns its Page tabs. */
.page-rail .folder-tree{border-bottom:0;padding-bottom:8px}
.file-page-bar{position:absolute;z-index:3;top:59px;left:0;right:0;height:50px;display:flex;align-items:stretch;gap:8px;padding:0 16px;background:#f9faf7;border-bottom:1px solid #dce7dd}
.file-page-bar .file-page-list{display:flex;align-items:stretch;flex:1;min-width:0;min-height:0;gap:4px;overflow-x:auto;overflow-y:hidden;padding:6px 0 0;scrollbar-width:thin}
.file-page-bar .file-page-item{flex:none;width:auto;max-width:220px;min-height:0;padding:0 16px;border:1px solid #dce7dd;border-bottom:0;border-radius:9px 9px 0 0;background:#f0f4ef;color:#547064;text-align:center;font-size:12px}
.file-page-bar .file-page-item:hover{background:#e7f1e9}
.file-page-bar .file-page-item.active{background:#fff;border-color:#bddac7;color:#1f6049;box-shadow:0 -2px 0 #61af7f inset;font-weight:700}
.page-tab-add{flex:none;align-self:center;width:34px;min-height:34px;border:0;border-radius:8px;background:transparent;color:#3c7955;font-size:23px;line-height:1}
.page-tab-add:hover,.page-tab-add:focus-visible{background:#e7f1e9}
.file-page-bar #pageCreateMenu{position:absolute;top:47px;right:12px;left:auto;width:190px;box-shadow:0 14px 30px #17392a25}
.canvas-panel.has-file .viewport{top:109px}
.canvas-panel.has-file .file-page-editor{top:109px}
@media(hover:none),(any-pointer:coarse){.file-page-bar .file-page-item,.page-tab-add{min-height:44px}}
@media(max-width:650px){.file-page-bar{padding:0 8px;gap:4px}.file-page-bar .file-page-item{padding:0 12px;max-width:150px;font-size:11px}}

/* App name and commands live in a desktop-style menu bar. */
.app-menubar{position:relative;z-index:10;gap:14px;padding:0 18px}
.app-menu-brand{flex:none;font:700 19px 'Space Grotesk',Arial,sans-serif;letter-spacing:-.04em;color:#1d6047}
.app-menus{display:flex;align-items:center;gap:2px;min-width:0}
.app-menu-root{position:relative;flex:none}
.app-menu-trigger{min-height:38px;padding:0 12px;border:0;border-radius:7px;background:transparent;color:#344d43;font-size:13px;font-weight:600}
.app-menu-trigger:hover,.app-menu-trigger[aria-expanded="true"],.app-menu-trigger:focus-visible{background:#e8f2e9;color:#1d6047}
.app-menu-popup{position:absolute;z-index:22;top:calc(100% + 9px);left:0;min-width:228px;max-height:calc(100dvh - 86px);overflow-y:auto;padding:6px;background:#fff;border:1px solid #d9e5dc;border-radius:10px;box-shadow:0 16px 38px #183b2b2a}
.app-menu-root:last-child .app-menu-popup{left:auto;right:0}
.app-menu-popup button,.app-menu-popup a{display:block;width:100%;min-height:36px;padding:8px 11px;border:0;border-radius:6px;background:transparent;color:#315745;text-align:left;font-size:12px}
.app-menu-popup button:hover:not(:disabled),.app-menu-popup a:hover,.app-menu-popup button:focus-visible,.app-menu-popup a:focus-visible{background:#e9f4eb}
.app-menu-popup button:disabled{opacity:.4}
.app-menu-separator{height:1px;margin:6px 4px;background:#e4ece4}
.app-menu-storage{display:grid;gap:5px;padding:10px 11px 5px;color:#6d8275;font-size:11px}
.app-menu-storage span{display:flex;justify-content:space-between;gap:12px}
.app-menu-storage progress{width:100%;height:7px;accent-color:#77c798}
.app-menu-account{padding:9px 11px 4px;color:#6d8275;font-size:11px;border-top:1px solid #e4ece4}
.app-menu-account a{text-decoration:underline}
.app-menu-context{display:flex;align-items:center;gap:16px;min-width:0;margin-left:auto;color:#637a6c;font-size:12px}
.app-history-controls{display:flex;flex:none;gap:2px;margin-left:3px}
.app-history-controls button{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:7px;background:transparent;color:#315745;font-size:21px;line-height:1}
.app-history-controls button:hover:not(:disabled),.app-history-controls button:focus-visible{background:#e8f2e9;color:#1d6047}
.app-history-controls button:disabled{opacity:.35;cursor:not-allowed}
@media(hover:none),(any-pointer:coarse){.app-history-controls button{width:40px;height:40px}}
.app-menu-context #workspaceTitle{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:300px}
.workspace.rail-hidden .page-rail{display:none}
@media(max-width:950px){.app-menu-context{display:none}}
@media(max-width:650px){.app-menubar{gap:5px;padding:0 8px}.app-menu-brand{font-size:16px}.app-menu-trigger{min-height:44px;padding:0 7px;font-size:12px}.app-menu-popup{min-width:210px;top:calc(100% + 3px)}}
@media(hover:none),(any-pointer:coarse){.app-menu-popup button,.app-menu-popup a{min-height:44px}}

/* The account storage root has no visible row or title. */
.folder-back{flex:none;align-self:flex-start;min-height:34px;margin:0 4px 5px;padding:5px 9px;border:0;border-radius:7px;background:transparent;color:#4b7960;text-align:left;font-size:12px}
.folder-back:hover,.folder-back:focus-visible{background:#e6f2e9;color:#226044}
.tree-row{position:relative}
.tree-item-menu{position:fixed;z-index:30;min-width:176px;padding:5px;background:#fff;border:1px solid #d9e5dc;border-radius:9px;box-shadow:0 12px 28px #183b2b2a}
.tree-item-menu button{display:block;width:100%;min-height:36px;padding:7px 10px;border:0;border-radius:6px;background:transparent;color:#315745;text-align:left;font-size:12px}
.tree-item-menu button:hover,.tree-item-menu button:focus-visible{background:#e9f4eb}
@media(hover:none),(any-pointer:coarse){.tree-item-menu button{min-height:44px}}
.tree-empty{margin:12px 8px;color:#81978a;font-size:12px;line-height:1.5}

/* Keep Mac shortcuts discoverable and keyboard focus visible on canvas items. */
.app-menu-popup button kbd{float:right;margin-left:18px;color:#81968a;font:inherit}
.node:focus-visible{outline:2px solid #2b8f67;outline-offset:3px}

/* Canvas text is edited in place; the surrounding node remains a drag handle. */
.node textarea.node-content{display:block;width:100%;min-width:0;min-height:28px;max-height:240px;margin:0;padding:0;border:0;outline:0;background:transparent;color:inherit;font:inherit;line-height:1.4;text-align:inherit;resize:none;overflow:auto;user-select:text;touch-action:manipulation;cursor:text}
.node textarea.node-content::placeholder{color:#81938a}
.node.shape,.node.shape.diamond{width:174px;height:112px;min-width:0;min-height:0;max-width:none;padding:8px;display:grid;place-items:center;background:transparent;border:0;border-radius:0;box-shadow:none;transform:none;overflow:visible}
.node.shape.ellipse{border-radius:0}
.node.shape.diamond .node-content{transform:none}
.node.shape:hover{border:0}
.node.shape.selected{outline:2px solid #3aa879;outline-offset:2px;box-shadow:none}
.node.shape .shape-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 7px 8px #40605220)}
.node.shape textarea.node-content{position:relative;z-index:1;width:72%;height:64px;max-height:64px;padding:4px;text-align:center}
.node.shape.line-shape{height:72px}
.node.shape.line-shape.vertical-line{width:72px;height:174px}
.node.shape.line-shape:not(.has-label) textarea.node-content{opacity:0;pointer-events:none}
.node.shape.line-shape.has-label textarea.node-content{width:70%;height:40px;max-height:56px;padding:4px;border-radius:5px;background:#fff;box-shadow:0 2px 7px #183b2b20}
.node.shape.line-shape.vertical-line.has-label textarea.node-content{width:65px}
.shape-art[fill="none"] path{vector-effect:non-scaling-stroke}
.shape-preview .shape-art[fill="none"] path{stroke-width:2.5px}
.inspector-shapes{overflow:auto;padding:9px 11px 14px}
.shape-group h3{margin:11px 4px 8px;color:#698274;font-size:11px;font-weight:700}
.shape-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.shape-choice{display:grid;justify-items:center;align-content:start;gap:5px;min-width:0;min-height:79px;padding:7px 4px;border:1px solid #e4ebe4;border-radius:8px;background:#fff;color:#385848;font-size:10px;line-height:1.25;text-align:center}
.shape-choice:hover,.shape-choice:focus-visible,.shape-choice.active{border-color:#65af7d;background:#eaf6ed;color:#1d6544}
.shape-preview{display:block;width:68px;max-width:100%;height:43px}
.shape-preview .shape-art{display:block;width:100%;height:100%}
.inspector-body.shape-inspector{padding:12px 12px 16px}
.shape-library-instruction{margin:0 0 12px;color:#607e6e;font-size:11px;line-height:1.45}
.inspector-title-row{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:43px;margin:-12px -12px 12px;padding:8px 12px;background:#fff;border-bottom:1px solid #eef0ec}
.inspector-title-row .inspector-type{min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inspector-title-row .inspector-button{flex:none;min-height:30px;padding:5px 9px}
.shape-inspector .field-group{margin-bottom:12px}
.shape-inspector .field-label{margin-bottom:5px}
.shape-inspector .field-textarea{min-height:60px;padding:8px}
.shape-inspector .inspector-shapes{max-height:none;overflow:visible;padding:0}
.shape-inspector .shape-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.shape-inspector .shape-group h3{margin:8px 2px 5px}
.shape-inspector .shape-choice{min-height:59px;padding:4px 2px;gap:2px;font-size:9px}
.shape-inspector .shape-preview{width:42px;height:28px}
@media(hover:none),(any-pointer:coarse){.shape-choice{min-height:84px}}

.snap-guides{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none}
.snap-guides line{stroke:#268b65;stroke-width:1.5;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.alignment-card{width:min(430px,100%)}
.alignment-card .field-label{margin-bottom:8px}
.alignment-card .field-input{font-size:16px}
.alignment-preview{min-height:20px;margin:10px 0 0;color:#3d7658;font-size:12px}
.alignment-error{margin:12px 0 0;color:#a95043}
