:root{--paper: #f4f5f1;--dot: #d9dbd4;--panel: #ffffff;--ink: #17191c;--ink-2: #5d6269;--line: #c9ccc5;--accent: #2646d6;--accent-soft: #dfe5fb;--root-bg: #17191c;--root-fg: #f4f5f1;--connector: #9ea49d;--danger: #b3261e;--xlink: #d0433a;--font-ui: -apple-system, "SF Pro Text", "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;--font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;--radius: 6px}[data-theme=night]{--paper: #15171a;--dot: #272a2f;--panel: #1f2226;--ink: #e8e9e6;--ink-2: #9aa0a6;--line: #3b4046;--accent: #7c9cff;--accent-soft: #2b3550;--root-bg: #f4f5f1;--root-fg: #15171a;--connector: #6b7178;--xlink: #f0625a}[data-theme=chalk]{--paper: #1f3a33;--dot: #2d4c44;--panel: #27463e;--ink: #f1f5ee;--ink-2: #b6c2b8;--line: #476b5e;--accent: #f5c451;--accent-soft: #4b5a3a;--root-bg: #f5c451;--root-fg: #1f3a33;--connector: #8fa89a;--xlink: #ff8f7a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font:14px/1.4 var(--font-ui);color:var(--ink);background:var(--paper);-webkit-text-size-adjust:100%;overscroll-behavior:none}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.home{max-width:680px;margin:0 auto;padding:56px 24px 80px}.home h1{font:400 42px/1.05 var(--font-display);letter-spacing:-.01em;margin:0 0 8px}.home .lede{color:var(--ink-2);margin:0 0 28px}.home .actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px}.btn{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);padding:9px 16px;cursor:pointer}.btn:hover{border-color:var(--ink-2)}.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.primary:hover{background:#000}.maplist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.maplist li{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line)}.maplist .open{flex:1;display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;background:none;border:0;padding:14px 4px;cursor:pointer}.maplist .open:hover .title{color:var(--accent)}.maplist .title{font-size:16px;font-weight:500}.maplist .meta{color:var(--ink-2);font-size:13px}.maplist .del{background:none;border:0;color:var(--ink-2);cursor:pointer;padding:8px;display:inline-flex}.maplist .del svg{width:18px;height:18px}.maplist .del:hover{color:var(--danger)}.home .empty,.home .error{padding:24px 0;color:var(--ink-2)}.home .error{color:var(--danger)}.home footer{margin-top:48px;color:var(--ink-2);font-size:12px}.editor{position:fixed;inset:0;display:flex;flex-direction:column;outline:none;background:var(--paper);color:var(--ink)}.editor .main{flex:1;display:flex;min-height:0;position:relative}.editor .main .viewport{flex:1;min-width:0}.editor.linking .node,.viewport.linking{cursor:crosshair}.iconbtn.on{background:var(--accent-soft);border-color:var(--accent)}.topbar{flex:none;display:flex;align-items:center;gap:6px;padding:env(safe-area-inset-top) 8px 0;min-height:calc(46px + env(safe-area-inset-top));background:var(--panel);border-bottom:1px solid var(--line)}.topbar .title{flex:1 1 100px;min-width:60px;border:1px solid transparent;border-radius:var(--radius);padding:5px 8px;font:500 16px var(--font-ui);background:transparent;color:var(--ink)}.topbar .title:hover{border-color:var(--line)}.topbar .title:focus{border-color:var(--accent);outline:none}.savestate{color:var(--ink-2);font-size:12px;min-width:42px}.savestate.error{color:var(--danger);background:none;border:1px solid var(--danger);border-radius:var(--radius);padding:3px 8px;cursor:pointer}.spacer{flex:0 1 24px}.iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;background:none;border-radius:var(--radius);cursor:pointer;color:var(--ink);padding:0}.iconbtn:hover:not(:disabled){background:var(--paper);border-color:var(--line)}.iconbtn:disabled{opacity:.3;cursor:default}.iconbtn svg{width:18px;height:18px}.segmented{flex:none;display:inline-flex;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.segmented button{border:0;background:none;padding:6px 10px;cursor:pointer;font-size:13px;white-space:nowrap}.segmented button.on{background:var(--ink);color:var(--paper)}.group{display:inline-flex;align-items:center;gap:2px}.zoompct{min-width:44px;text-align:center;font-variant-numeric:tabular-nums;font-size:13px;color:var(--ink-2)}.searchbar{flex:none;display:flex;align-items:center;gap:6px;padding:6px 10px;background:var(--panel);border-bottom:1px solid var(--line)}.searchbar>svg{width:18px;height:18px;color:var(--ink-2);flex:none}.searchbar .input{flex:1}.searchbar .count{color:var(--ink-2);font-size:12px;white-space:nowrap;min-width:60px;text-align:right}.input{font:14px var(--font-ui);color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:6px 8px;min-width:0;width:100%}.input:focus{outline:none;border-color:var(--accent)}.input.note{resize:vertical;min-height:80px;line-height:1.4}.hint{position:absolute;top:10px;left:50%;transform:translate(-50%);z-index:9;background:var(--ink);color:var(--paper);padding:6px 12px;border-radius:999px;font-size:13px;pointer-events:none}.viewport{position:relative;flex:1;overflow:hidden;touch-action:none;cursor:grab;background-color:var(--paper);background-image:radial-gradient(var(--dot) 1px,transparent 1.3px);background-size:24px 24px}.viewport.panning{cursor:grabbing}.stage{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0}.links{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}.links path{fill:none;stroke:var(--connector);stroke-width:1.6px}.links path.sel{stroke:var(--accent);stroke-width:2px}.node{position:absolute;left:0;top:0;width:max-content;min-width:44px;min-height:32px;max-width:260px;padding:6px 12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 1px #17191c0d;white-space:pre-wrap;overflow-wrap:break-word;user-select:none;-webkit-user-select:none;cursor:default;touch-action:none;transition:transform .15s ease,box-shadow .1s ease}.node .text{min-height:1.35em}.node.root{background:var(--root-bg);color:var(--root-fg);border-color:var(--root-bg);font-weight:600;font-size:16px;padding:10px 16px;max-width:300px;border-radius:8px}.node.depth-1{font-weight:500}.node.selected{box-shadow:0 0 0 2px var(--accent-soft),0 0 0 3px var(--accent);border-color:var(--accent)}.node.primary,.node.editing{box-shadow:0 0 0 2px var(--accent);border-color:var(--accent)}.node.editing{cursor:text;user-select:text;-webkit-user-select:text}.node.drop{box-shadow:0 0 0 2px var(--accent);background:var(--accent-soft)}.node.root.drop{background:#2c3654}.node.dragging{opacity:.45}.node.collapsed{box-shadow:2px 2px 0 var(--panel),3px 3px 0 var(--line)}.node.shape-rect{border-radius:0}.node.shape-ellipse{border-radius:999px;padding:8px 18px;text-align:center}.node.bold{font-weight:700}.node.hit{box-shadow:0 0 0 3px #f5c451}.node.hit.primary{box-shadow:0 0 0 2px var(--accent),0 0 0 4px #f5c451}.node.icon-left,.node.icon-right{display:flex;align-items:center;gap:8px}.node.icon-top,.node.icon-bottom{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}.node .nodeicon{flex:none;display:block;max-width:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.node.icon-center{background-size:contain;background-repeat:no-repeat;background-position:center;display:flex;align-items:flex-end;justify-content:center}.node.icon-center .text,.node.icon-center .edit{background:#fffc;color:#17191c;border-radius:4px;padding:1px 6px}.node .marks{position:absolute;right:-6px;bottom:-8px;display:flex;gap:2px}.node .mark{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;background:var(--panel);border:1px solid var(--line);color:var(--ink-2);font:12px/1 var(--font-ui);text-decoration:none}.node a.mark:hover{color:var(--accent);border-color:var(--accent)}.node.root .mark{background:var(--root-bg);color:var(--root-fg);border-color:var(--root-fg)}.xlinks{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;color:var(--xlink)}.xlinks .hitarea{fill:none;stroke:transparent;stroke-width:14px;pointer-events:stroke;cursor:pointer}.xlinks .line{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round}.xlinks .arrow{fill:currentColor;stroke:none}.xlinks g.sel{color:var(--accent)}.xlinks g.sel .line{stroke-width:2.5px}.node.collapsed.selected{box-shadow:0 0 0 2px var(--accent),3px 3px 0 var(--line)}.node .edit{outline:none;min-width:24px;min-height:1.35em;white-space:pre-wrap;caret-color:var(--accent)}.node.root .edit{caret-color:var(--root-fg)}.badge{position:absolute;top:50%;transform:translateY(-50%);right:-12px;background:var(--accent);color:#fff;border:0;border-radius:999px;font-size:11px;line-height:20px;height:20px;min-width:20px;padding:0 6px;cursor:pointer}.node.side-left .badge{right:auto;left:-12px}.node.side-down .badge{inset:auto auto -12px 50%;transform:translate(-50%)}.ghost{position:fixed;z-index:20;pointer-events:none;max-width:240px;padding:6px 12px;background:var(--panel);border:1px solid var(--accent);border-radius:var(--radius);box-shadow:0 8px 20px #17191c2e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.actionbar{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translate(-50%);z-index:10;display:flex;gap:2px;padding:4px;max-width:calc(100% - 16px);background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #17191c1f}.actionbar .iconbtn{width:40px;height:40px}.actionbar .sep{width:1px;background:var(--line);margin:6px 3px}.panel{flex:none;width:300px;overflow:auto;background:var(--panel);border-left:1px solid var(--line);padding:0 14px 20px}.panel-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;background:var(--panel);border-bottom:1px solid var(--line)}.panel-scope{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel section{padding:12px 0 4px}.panel h3{margin:0 0 8px;font:500 12px var(--font-ui);color:var(--ink-2)}.panel .row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}.panel .field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ink-2);flex:1}.panel select{font:14px var(--font-ui);color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:5px 6px}.btn.small{padding:5px 10px;font-size:13px}a.btn{text-decoration:none;color:inherit;display:inline-flex;align-items:center}.btn.on{border-color:var(--accent);background:var(--accent-soft)}.segmented.small button{padding:4px 8px;font-size:12px}.swatches{display:flex;flex-wrap:wrap;gap:6px}.swatch{width:24px;height:24px;border-radius:999px;border:1px solid var(--line);padding:0;cursor:pointer;position:relative}.swatch.on{box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--accent)}.swatch.none{background:var(--panel)}.swatch.none:after{content:"";position:absolute;inset:4px;border-top:1px solid var(--danger);transform:rotate(-45deg) translateY(7px)}.swatch.custom{overflow:hidden;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.swatch.custom input{opacity:0;width:100%;height:100%;cursor:pointer}.iconrow{display:flex;gap:10px;align-items:flex-start}.iconpreview{width:56px;height:56px;object-fit:contain;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);flex:none}.iconctl{display:flex;flex-direction:column;gap:6px;min-width:0}.iconctl .segmented{flex-wrap:wrap}.symbols{display:grid;grid-template-columns:repeat(auto-fill,34px);gap:4px;margin-top:8px}.symbol{width:34px;height:34px;border:1px solid transparent;border-radius:var(--radius);background:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--ink)}.symbol:hover{border-color:var(--line);background:var(--paper)}.menu{position:fixed;z-index:25;min-width:220px;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 30px #0000002e}.menu-item{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:7px 10px;border:0;background:none;border-radius:var(--radius);text-align:left;cursor:pointer;font-size:13px}.menu-item:hover:not(:disabled){background:var(--accent-soft)}.menu-item:disabled{opacity:.4;cursor:default}.menu-item kbd{font:11px var(--font-ui);color:var(--ink-2)}.menu-sep{height:1px;background:var(--line);margin:4px 6px}.help-backdrop{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:20px;background:#17191c59}.help{width:100%;max-width:540px;max-height:85vh;overflow:auto;padding:18px 22px 22px;background:var(--panel);border:1px solid var(--line);border-radius:10px}.help-head{display:flex;align-items:center;justify-content:space-between}.help h2{font:400 26px/1.2 var(--font-display);margin:0}.help-note{color:var(--ink-2);margin:6px 0 14px}.help table{width:100%;border-collapse:collapse;font-size:13px}.help td{padding:6px 0;border-top:1px solid var(--line);vertical-align:top}.help td:first-child{width:46%;padding-right:12px}.help kbd{font:12px var(--font-ui);border:1px solid var(--line);border-radius:4px;padding:1px 5px;background:var(--paper)}.loading,.empty-state{padding:48px 24px;color:var(--ink-2)}.empty-state p{margin:0 0 16px;max-width:60ch}.empty-state .mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}@media (max-width: 640px){.desktop-only{display:none}.home{padding:32px 18px 60px}.home h1{font-size:34px}.savestate{display:none}.actionbar .iconbtn{width:34px;height:34px}.segmented button{padding:6px 8px}.panel{position:absolute;left:0;right:0;bottom:0;width:auto;max-height:min(55vh,100%);border-left:0;border-top:1px solid var(--line);border-radius:12px 12px 0 0;box-shadow:0 -8px 24px #00000026;padding-bottom:calc(20px + env(safe-area-inset-bottom))}.editor.panel-open .actionbar{display:none}.menu{min-width:200px}}@media (prefers-reduced-motion: reduce){.node,.stage{transition:none!important}}@media (pointer: coarse),(max-width: 640px){.input,.panel select,.searchbar .input{font-size:16px}.swatch{width:30px;height:30px}.swatches{gap:8px}.segmented.small button,.btn.small{padding:8px 10px;font-size:14px}.symbol{width:40px;height:40px}.symbols{grid-template-columns:repeat(auto-fill,40px)}.menu-item{padding:10px 12px;font-size:15px}}
