*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{color:#111;-webkit-font-smoothing:antialiased;background:#f5f5f5;font-family:-apple-system,Inter,BlinkMacSystemFont,Segoe UI,sans-serif}input,textarea,button,select{font-family:inherit}button{cursor:pointer;background:0 0;border:none}textarea{resize:none}#home{background:#fafafa;flex-direction:column;display:flex;position:absolute;inset:0}.h-topbar{z-index:10;background:#fff;border-bottom:1px solid #ebebeb;flex-shrink:0;align-items:center;gap:16px;height:56px;padding:0 24px;display:flex}.h-logo{color:#4355f4;letter-spacing:-.5px;cursor:pointer;flex-shrink:0;font-size:20px;font-weight:700}.h-search{color:#333;background:#f5f5f5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") 10px no-repeat;border:1px solid #e8e8e8;border-radius:8px;outline:none;flex:1;max-width:380px;height:34px;padding:0 12px 0 34px;font-size:13px;transition:border-color .15s,background .15s}.h-search:focus{background-color:#fff;border-color:#4355f4}.h-btn-new{color:#fff;white-space:nowrap;background:#4355f4;border-radius:8px;flex-shrink:0;height:34px;padding:0 16px;font-size:13px;font-weight:500;transition:background .15s}.h-btn-new:hover{background:#3344e0}.h-body{flex:1;display:flex;overflow:hidden}.h-nav{background:#fff;border-right:1px solid #ebebeb;flex-direction:column;flex-shrink:0;gap:2px;width:216px;padding:20px 10px;display:flex}.h-nav-sect{color:#bbb;letter-spacing:.6px;text-transform:uppercase;padding:8px 10px 4px;font-size:10px;font-weight:600}.h-nav-item{color:#555;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:10px;height:34px;padding:0 10px;font-size:13px;transition:background .1s;display:flex}.h-nav-item:hover{background:#f5f5f5}.h-nav-item.active{color:#4355f4;background:#eef0ff;font-weight:500}.h-nav-icon{text-align:center;flex-shrink:0;width:18px;font-size:15px}.h-main{flex:1;padding:32px 32px 80px;overflow-y:auto}.h-main-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.h-main-header h2{color:#111;font-size:17px;font-weight:600}.board-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;display:grid}.board-card-wrap{position:relative}.board-card{cursor:pointer;text-align:left;background:#fff;border:1px solid #e8e8e8;border-radius:12px;width:100%;padding:0;font-family:inherit;transition:box-shadow .18s,transform .18s;display:block;position:relative;overflow:hidden}.board-card:hover{transform:translateY(-2px);box-shadow:0 8px 28px #00000017}.board-card:focus-visible,.new-card:focus-visible,.h-nav-item:focus-visible{outline-offset:2px;outline:2px solid #4355f4}.board-actions{opacity:0;gap:6px;transition:opacity .12s;display:flex;position:absolute;top:10px;right:10px}.board-card-wrap:hover .board-actions,.board-card-wrap:focus-within .board-actions{opacity:1}.board-actions button{color:#555;cursor:pointer;background:#fffffff5;border:1px solid #dedede;border-radius:7px;padding:6px 8px;font:600 11px/1 inherit;box-shadow:0 2px 8px #00000014}.board-actions button:hover,.board-actions button:focus-visible{color:#4355f4;border-color:#4355f4;outline:none}.board-actions [data-board-action=delete]:hover,.board-actions [data-board-action=delete]:focus-visible{color:#c73939;border-color:#c73939}.board-thumb{background:#f9f9f9;height:140px;display:block;position:relative;overflow:hidden}.board-info{border-top:1px solid #f0f0f0;padding:12px 14px 14px}.board-name{color:#111;margin-bottom:3px;font-size:14px;font-weight:600}.board-meta{color:#aaa;font-size:11px}.new-card{cursor:pointer;color:#b0b0b0;background:#fff;border:2px dashed #e0e0e0;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;min-height:200px;font-family:inherit;transition:all .15s;display:flex}.new-card:hover{color:#4355f4;background:#f7f8ff;border-color:#4355f4}.new-card-icon{font-size:30px;line-height:1}.new-card-label{font-size:13px;font-weight:500}.board-grid-empty{text-align:center;color:#999;padding:40px 0;font-size:13px}@media (width<=640px){.h-topbar{flex-wrap:wrap;gap:8px;height:auto;min-height:56px;padding:8px 12px}.h-logo{order:1}.h-btn-new{order:2;margin-left:auto}.h-search{flex:100%;order:3;max-width:none}.h-body{flex-direction:column;overflow:hidden auto}.h-nav{border-bottom:1px solid #ebebeb;border-right:none;flex-direction:row;align-items:center;width:100%;padding:8px 12px;overflow-x:auto}.h-nav-sect{display:none}.h-main{padding:16px}.board-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}}#canvas-screen{flex-direction:column;display:none;position:absolute;inset:0}#canvas-screen.visible{display:flex}.c-topbar{z-index:100;background:#fff;border-bottom:1px solid #ebebeb;flex-shrink:0;align-items:center;gap:8px;height:50px;padding:0 12px;display:flex;box-shadow:0 1px 4px #0000000a}.c-back{color:#555;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;gap:6px;height:32px;padding:0 10px;font-size:13px;font-weight:500;transition:background .1s;display:flex}.c-back:hover{color:#111;background:#f0f0f0}.history-btn{color:#666;border-radius:7px;justify-content:center;align-items:center;width:30px;height:30px;font-size:17px;transition:background .1s;display:flex}.history-btn:hover:not(:disabled){color:#111;background:#f0f0f0}.history-btn:disabled{color:#d5d5d5;cursor:default}#board-name{color:#111;cursor:pointer;background:0 0;border:none;border-radius:7px;outline:none;min-width:60px;max-width:240px;padding:4px 8px;font-size:14px;font-weight:600;transition:background .1s}#board-name:hover{background:#f5f5f5}#board-name:focus{cursor:text;background:#f5f5f5}.c-tool-btn{color:#555;border-radius:7px;flex-shrink:0;align-items:center;gap:5px;height:31px;padding:0 10px;font-size:13px;transition:background .1s;display:flex}.c-tool-btn:hover{background:#f0f0f0}.c-tool-btn.active{color:#4355f4;background:#eef0ff}.c-tool-btn .k{color:#bbb;background:#f2f2f2;border-radius:3px;padding:1px 4px;font-family:SF Mono,Fira Code,monospace;font-size:10px;line-height:1.5}.c-tool-btn.active .k{color:#89f;background:#e4e8ff}.c-spacer{flex:1}#save-status{color:#aaa;text-align:right;min-width:42px;font-size:11px}.c-share{color:#fff;background:#4355f4;border-radius:7px;flex-shrink:0;height:31px;padding:0 16px;font-size:13px;font-weight:500;transition:background .1s}.c-share:hover{background:#3344e0}.c-share:disabled,.c-share:disabled:hover{color:#9aa1aa;cursor:not-allowed;background:#eef0f3}#canvas-area{z-index:0;cursor:default;-webkit-user-select:none;user-select:none;background-color:#f5f5f5;background-image:radial-gradient(circle,#d0d0d0 1.2px,#0000 1.2px);background-size:24px 24px;flex:1;position:relative;overflow:hidden}#canvas-area.cur-grab{cursor:grab}#canvas-area.cur-grabbing{cursor:grabbing}#canvas-area.cur-pen,#canvas-area.cur-frame{cursor:crosshair}#viewport{transform-origin:0 0;will-change:transform;z-index:2;position:absolute;top:0;left:0}#conn-svg{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}#conn-under-svg,#conn-hit-svg{pointer-events:none;width:1px;height:1px;position:absolute;top:0;left:0;overflow:visible}#conn-under-svg{z-index:2}#conn-hit-svg,#conn-svg{z-index:3}#pen-svg{pointer-events:none;z-index:10;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}#pen-svg.active-pen{pointer-events:all;cursor:crosshair}.stroke-hit{pointer-events:stroke;cursor:move}.stroke-selection{fill:#4355f409;stroke:#4355f4;stroke-width:1.5px;stroke-dasharray:5 4;pointer-events:none}.stroke-resize-handle{fill:#fff;stroke:#4355f4;stroke-width:2px;pointer-events:all}.stroke-resize-handle[data-stroke-resize=nw],.stroke-resize-handle[data-stroke-resize=se]{cursor:nwse-resize}.stroke-resize-handle[data-stroke-resize=ne],.stroke-resize-handle[data-stroke-resize=sw]{cursor:nesw-resize}#frame-ghost{pointer-events:none;z-index:200;background:#4355f40a;border:2px dashed #4355f4;border-radius:12px;display:none;position:absolute}.frame{cursor:grab;-webkit-user-select:none;user-select:none;z-index:5;will-change:transform;background:#fff;border:1.5px solid #e4e4e4;border-radius:12px;min-width:120px;min-height:60px;transition:border-color .12s,box-shadow .12s;position:absolute;overflow:visible;box-shadow:0 2px 8px #0000000f,0 0 #4355f400}.frame:hover{border-color:#c8c8c8}.frame.is-dragging{cursor:grabbing;z-index:50;box-shadow:0 10px 36px #0000001f}.frame.selected{z-index:20;border:2px solid #4355f4}.frame.selected:hover{border-color:#4355f4}.frame.multi-selected{z-index:19;border:2px solid #4355f4}.frame.formula-frame{border-left:3.5px solid #4355f452}.frame.formula-frame.selected{border-left:3.5px solid #4355f4}.frame.sticky-frame{background:#fff9c4!important;border:none!important;border-radius:4px!important;box-shadow:2px 4px 16px #0000001a!important}.frame.sticky-frame.selected{outline-offset:1px;outline:2px solid #4355f4}.frame.text-frame{box-shadow:none!important;background:0 0!important;border:1.5px dashed #d5d5d5!important}.frame.text-frame:hover{border-color:#aaa!important}.frame.text-frame.selected{border:2px solid #4355f4!important}.frame-clip{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.frame-inner{flex-direction:column;height:100%;padding:11px 13px 9px;display:flex;position:relative}.frame-label{color:#b5b5b5;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;min-height:14px;margin-bottom:5px;font-size:10px;font-weight:600;overflow:hidden}.frame-body{flex:1;align-items:flex-start;min-height:0;display:flex;overflow:hidden}.frame.role-metric .frame-body,.frame.role-calculation .frame-body{align-items:center}.frame.formula-frame .frame-body{flex-shrink:0;min-height:28px}.val-number{color:#0a0a0a;letter-spacing:-.5px;font-size:28px;font-weight:700;line-height:1}.val-text{color:#333;word-break:break-word;white-space:pre-wrap;font-size:13px;line-height:1.55;overflow:hidden}.val-sticky{color:#3a3020;word-break:break-word;white-space:pre-wrap;font-size:14px;line-height:1.5;overflow:hidden}.val-placeholder{color:#ccc;font-size:12px;font-style:italic}.val-error{color:#e44;font-size:18px;font-weight:600}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.val-img-wrap{justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden}.val-img-wrap img{object-fit:contain;border-radius:6px;max-width:100%;max-height:100%}.frame img{-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.val-file-wrap{align-items:center;gap:10px;width:100%;display:flex}.val-file-icon{flex-shrink:0;font-size:28px}.val-file-info{flex:1;min-width:0}.val-file-name{color:#111;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.val-file-size{color:#aaa;margin-top:2px;font-size:11px}.val-url-wrap{align-items:flex-start;gap:8px;width:100%;display:flex}.val-url-icon{border-radius:4px;flex-shrink:0;width:20px;height:20px;margin-top:1px}.val-url-info{flex:1;min-width:0}.val-url-title{color:#222;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;font-weight:600;display:-webkit-box;overflow:hidden}.val-url-domain{color:#4355f4;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:10.5px;overflow:hidden}.val-textfile-wrap{flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}.val-textfile-head{flex-shrink:0;align-items:center;gap:6px;margin-bottom:4px;display:flex}.val-textfile-head .val-file-icon{font-size:15px}.val-textfile-head .val-file-name{color:#555;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;overflow:hidden}.val-textfile-preview{color:#444;white-space:pre-wrap;word-break:break-word;flex:1;margin:0;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:10.5px;line-height:1.45;overflow:hidden}.frame-unit{color:#c5c5c5;white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;margin-top:4px;font-size:10.5px;overflow:hidden}.frame-formula-hint{color:#c5c5c5;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;margin-top:4px;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:9px;overflow:hidden}.frame-tags{flex-wrap:wrap;flex-shrink:0;gap:3px;margin-top:4px;display:flex}.frame-cells{flex-direction:column;flex-shrink:0;gap:2px;margin-top:5px;display:flex}.frame-cell{border-top:1px solid #f0f0f2;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding-top:2px;font-size:10px;line-height:1.35;display:grid}.frame-cell-label{color:#8c9099;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.frame-cell-value{color:#262932;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:650}.tag-chip{color:#6573ea;white-space:nowrap;cursor:pointer;background:#eef0ff;border-radius:4px;padding:1px 6px;font-size:9.5px;font-weight:600;line-height:1.5;transition:background .1s,color .1s}.tag-chip:hover{color:#fff;background:#4355f4}.frame.tag-dimmed{opacity:.22;filter:grayscale(.4)}.frame.tag-matched{box-shadow:0 0 0 2px #4355f4,0 6px 18px #4355f42e}#tag-filter-bar{color:#fff;z-index:80;white-space:nowrap;background:#1c1e2e;border-radius:20px;align-items:center;gap:8px;padding:7px 12px;font-size:12px;display:none;position:absolute;top:14px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #0000002e}#tag-filter-bar.visible{display:flex}#tag-filter-bar button{color:#b7bcff;border-radius:6px;padding:2px 6px;font-size:11px}#tag-filter-bar button:hover{color:#fff;background:#ffffff1f}.port{z-index:30;opacity:0;cursor:crosshair;background:#4355f4;border:2.5px solid #fff;border-radius:50%;width:10px;height:10px;transition:opacity .15s,transform .12s;position:absolute;transform:scale(.7)}.frame:hover .port,.frame.selected .port{opacity:1;transform:scale(1)}.port:hover{background:#23c;transform:scale(1.35)!important}.port[data-port=top]{top:-5px;left:calc(50% - 5px)}.port[data-port=right]{top:calc(50% - 5px);right:-5px}.port[data-port=bottom]{bottom:-5px;left:calc(50% - 5px)}.port[data-port=left]{top:calc(50% - 5px);left:-5px}.resize-handle{cursor:se-resize;z-index:30;opacity:0;background:#fff;border:2px solid #4355f4;border-radius:3px;width:12px;height:12px;transition:opacity .15s;position:absolute;bottom:-4px;right:-4px}.frame.selected .resize-handle{opacity:1}.frame-editor{border-radius:inherit;z-index:40;background:#fffffff7;flex-direction:column;padding:11px 13px 9px;display:none;position:absolute;inset:0}.frame-editor.open{display:flex}.sticky-frame .frame-editor{background:#fff9c4f7}.text-frame .frame-editor{background:#fffffff5}.fe-label-input{color:#aaa;text-transform:uppercase;letter-spacing:.5px;cursor:text;background:0 0;border:none;outline:none;flex-shrink:0;width:100%;height:14px;min-height:14px;margin:0 0 5px;padding:0;font-size:10px;font-weight:600;line-height:14px}.fe-label-input:hover,.fe-label-input:focus{color:#666;box-shadow:inset 0 -1px #aeb6ff}.fe-label-input::placeholder{color:#d0d0d0}.fe-value{color:#333;resize:none;background:0 0;border:none;outline:none;flex:1;width:100%;min-height:0;margin:0;padding:0;font-family:inherit;font-size:13px;font-weight:400;line-height:1.55;overflow:auto}.fe-value::placeholder{color:#ccc;font-size:13px;font-style:italic;font-weight:400}.sticky-frame .fe-value{color:#3a3020;font-size:14px;line-height:1.5}.fe-unit{color:#bbb;background:0 0;border:none;outline:none;flex-shrink:0;width:100%;margin:4px 0 0;padding:0;font-size:10.5px;line-height:normal}.fe-unit::placeholder{color:#ddd}.fe-hint{color:#aaa;pointer-events:none;background:#ffffffe0;border-radius:4px;padding:2px 5px;font-size:9px;position:absolute;bottom:7px;right:9px}#left-rail{z-index:80;background:#fff;border:1px solid #e8e8e8;border-radius:13px;flex-direction:column;gap:2px;padding:8px 5px;display:flex;position:absolute;top:50%;left:14px;transform:translateY(-50%);box-shadow:0 4px 20px #00000014}.rail-btn{color:#666;cursor:pointer;border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:17px;transition:background .1s;display:flex}.rail-btn:hover{background:#f0f0f0}.rail-btn.active{color:#4355f4;background:#eef0ff}.rail-btn.text-tool{font-size:15px;font-weight:700}#statusbar{color:#b0b0b0;z-index:100;background:#fff;border-top:1px solid #ebebeb;flex-shrink:0;justify-content:space-between;align-items:center;height:24px;padding:0 16px;font-size:11px;display:flex;overflow:hidden}.sb-hints{gap:14px;display:flex;overflow:hidden}.sb-hint{flex-shrink:0;align-items:center;gap:4px;display:inline-flex}.kbd{color:#999;background:#f2f2f2;border-radius:3px;padding:0 4px;font-family:SF Mono,monospace;font-size:10px;line-height:1.6}@media (width<=760px){.sb-hints{display:none}}#calc-suggestions{z-index:95;white-space:nowrap;background:#fff;border:1px solid #dedede;border-radius:12px;align-items:center;gap:4px;padding:7px;display:none;position:absolute;bottom:38px;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #0000001c}#calc-suggestions.visible{display:flex}.calc-intro{color:#777;padding:0 7px;font-size:11px}.calc-chip{color:#333;background:#f6f6f6;border-radius:8px;align-items:center;gap:5px;height:30px;padding:0 10px;font-size:11px;display:flex}.calc-chip:hover{color:#4355f4;background:#eef0ff}.calc-chip strong{font-size:12px}.calc-preview{color:#999;font-variant-numeric:tabular-nums}#connected-calc{z-index:120;white-space:nowrap;background:#fff;border:1px solid #d8d8d8;border-radius:12px;align-items:center;gap:4px;padding:8px;display:none;position:absolute;transform:translate(-50%);box-shadow:0 8px 30px #00000024}#connected-calc.visible{display:flex}.connected-title{color:#555;padding:0 8px 0 5px;font-size:11px;font-weight:600}#connection-toolbar{z-index:130;white-space:nowrap;background:#fff;border:1px solid #dcdcdc;border-radius:11px;align-items:center;gap:3px;max-width:calc(100vw - 32px);padding:6px;display:none;position:absolute;overflow-x:auto;transform:translate(-50%,-100%);box-shadow:0 7px 26px #00000021}#connection-toolbar.visible{display:flex}@media (width<=760px){#connection-toolbar{gap:2px;padding:4px}#connection-toolbar .conn-tool-btn{padding:0 6px;font-size:10px}#connection-toolbar [data-action^=route-]{padding:0 8px;font-size:0}#connection-toolbar [data-action^=route-]:before{font-size:12px}#connection-toolbar [data-action=route-curved]:before{content:"⌒"}#connection-toolbar [data-action=route-straight]:before{content:"╱"}#connection-toolbar [data-action=route-orthogonal]:before{content:"⌐"}#connection-toolbar [data-action=reset-route]:before{content:"↺"}}.conn-tool-group{align-items:center;gap:2px;display:flex}.conn-tool-sep{background:#e7e7e7;width:1px;height:20px;margin:0 3px}.conn-tool-btn{color:#555;border-radius:7px;justify-content:center;align-items:center;gap:5px;min-width:29px;height:29px;padding:0 8px;font-size:11px;display:inline-flex}.conn-tool-btn:hover{color:#4355f4;background:#f2f3ff}.conn-tool-btn.active{color:#3447dd;background:#e9edff}.conn-tool-btn.danger:hover{color:#d93535;background:#fff0f0}.conn-swatch{border-radius:50%;width:8px;height:8px}.conn-swatch.data{background:#00b894}.conn-swatch.formula{background:#4355f4}#zoom-hud{z-index:80;background:#fff;border:1px solid #e8e8e8;border-radius:9px;align-items:center;display:flex;position:absolute;bottom:34px;right:14px;overflow:hidden;box-shadow:0 2px 12px #00000012}.zhud-btn{color:#666;cursor:pointer;justify-content:center;align-items:center;width:30px;height:30px;font-size:18px;line-height:1;transition:background .1s;display:flex}.zhud-btn:hover{background:#f5f5f5}.zhud-btn.fit{font-size:14px}#zoom-label{color:#666;text-align:center;font-variant-numeric:tabular-nums;border-left:1px solid #ebebeb;border-right:1px solid #ebebeb;min-width:42px;padding:0 6px;font-size:12px;line-height:30px}#pen-strip{z-index:80;background:#fff;border:1px solid #e1e4eb;border-radius:14px;flex-direction:column;align-items:stretch;gap:5px;width:132px;padding:8px;display:none;position:absolute;top:300px;left:76px;box-shadow:0 4px 20px #00000017}#pen-strip.visible{display:flex}.pen-style,.pen-eraser{color:#31343a;text-align:left;border:1px solid #0000;border-radius:8px;align-items:center;gap:8px;min-height:34px;padding:0 9px;font-size:11px;font-weight:600;display:flex}.pen-style:hover,.pen-eraser:hover{background:#f4f5f8}.pen-style.active,.pen-eraser.active{color:#4355f4;background:#eef0ff;border-color:#d8ddff}.pen-style-icon{justify-content:center;align-items:center;width:25px;font-size:17px;display:inline-flex}.pen-style[data-pen-style=fine] .pen-style-icon{font-size:12px}.pen-style[data-pen-style=highlighter] .pen-style-icon{color:#f1b500;opacity:.75}.pen-eraser .pen-style-icon{font-size:20px}.pen-colors{border-top:1px solid #eceef2;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:3px;padding:7px 5px 3px;display:grid}.pen-color{cursor:pointer;border:2.5px solid #0000;border-radius:50%;flex-shrink:0;justify-self:center;width:24px;height:24px;transition:transform .12s}.pen-color:hover{transform:scale(1.2)}.pen-color.active{border-color:#fff;box-shadow:0 0 0 2.5px #555}#ctx-menu{z-index:2000;background:#fff;border:1px solid #e0e0e0;border-radius:10px;min-width:164px;padding:5px;display:none;position:fixed;box-shadow:0 8px 28px #0000001f}#ctx-menu.visible{display:block}.ctx-item{color:#333;cursor:pointer;border-radius:7px;align-items:center;gap:8px;padding:7px 12px;font-size:13px;transition:background 80ms;display:flex}.ctx-item:hover{background:#f5f5f5}.ctx-item.danger{color:#d93535}.ctx-item.danger:hover{background:#fff2f2}.ctx-sep{background:#ebebeb;height:1px;margin:4px 0}.ctx-label{color:#8b909a;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px 4px;font-size:10px;font-weight:750}.ctx-layer-actions{grid-template-columns:repeat(4,1fr);gap:4px;padding:0 5px 5px;display:grid}.ctx-layer-actions button{color:#505561;background:#fff;border:1px solid #e1e3e8;border-radius:7px;min-width:0;height:34px;font-size:16px}.ctx-layer-actions button:hover{color:#4355f4;background:#f2f4ff;border-color:#7b88f7}#autocomplete{z-index:3000;background:#fff;border:1px solid #ddd;border-radius:10px;min-width:190px;max-height:200px;padding:4px;display:none;position:fixed;overflow-y:auto;box-shadow:0 8px 28px #0000001f}#autocomplete.visible{display:block}.ac-item{color:#333;cursor:pointer;border-radius:7px;padding:7px 12px;font-size:13px;transition:background 80ms}.ac-item:hover,.ac-item.ac-selected{color:#4355f4;background:#eef0ff}.ac-empty{color:#bbb;padding:10px 12px;font-size:12px;font-style:italic}.frame.shape-frame{box-shadow:none;background:var(--shape-fill,#fff);border-color:#59636e;border-radius:10px}.frame.shape-frame .frame-inner{justify-content:center;align-items:center;padding:12px}.frame.shape-frame .frame-label,.frame.shape-frame .frame-unit,.frame.shape-frame .frame-formula-hint{display:none}.frame.shape-frame .frame-body{text-align:center;justify-content:center;overflow:visible}.shape-visual{pointer-events:none;position:absolute;inset:0}.frame:not(.shape-frame) .shape-visual{display:none}.frame.shape-frame .val-text,.frame.shape-frame .val-placeholder{color:#27313b;z-index:2;font-size:13px;font-style:normal;position:relative}.frame.shape-start,.frame.shape-end,.frame.shape-ellipse{border-radius:50%}.frame.shape-end{border-width:4px}.frame.shape-gateway{background:0 0;border:none}.frame.shape-gateway:before{content:"";background:var(--shape-fill,#fff);border:2px solid #59636e;position:absolute;inset:12%;transform:rotate(45deg)}.frame.shape-gateway.shape-border-dashed:before{border-style:dashed}.frame.shape-data-object{border-radius:3px}.frame.shape-data-object:after{content:"";background:linear-gradient(225deg,#f5f5f5 49%,#59636e 50% 53%,#0000 54%);width:25px;height:25px;position:absolute;top:-1px;right:-1px}.frame.shape-subprocess{border-radius:12px}.shape-marker{z-index:3;color:#59636e;font-weight:700;position:absolute}.shape-subprocess .shape-marker{border:1px solid #59636e;width:14px;height:14px;font-size:13px;line-height:11px;bottom:3px;left:50%;transform:translate(-50%)}.shape-gateway .shape-marker{font-size:28px;top:50%;left:50%;transform:translate(-50%,-54%)}.frame.shape-border-dashed{border-style:dashed}.frame.connection-target{outline-offset:4px;outline:3px solid #00b89459}.frame.connection-invalid{outline-offset:4px;outline:3px solid #b84a4a57}.connection-path-hover{opacity:1!important}.connection-focus{outline-offset:3px;outline:2px dashed #f09b2d}.connection-selection-path{stroke:#f09b2d;stroke-width:2.5px;stroke-dasharray:7 5;stroke-linecap:round;filter:drop-shadow(0 0 2px #f09b2d4d)}.connection-handle{fill:#fff;stroke:#4355f4;stroke-width:2px;cursor:grab;pointer-events:all}.connection-handle:focus{stroke:#f09b2d;stroke-width:4px;outline:none}.connection-ghost{fill:none;stroke:#9aa1aa;stroke-width:2px;stroke-dasharray:4 4;opacity:.7}.connection-label{fill:#303642;paint-order:stroke;stroke:#fff;stroke-width:4px;pointer-events:none;font:600 12px system-ui}#connection-label-input{z-index:2600;border:2px solid #4355f4;border-radius:7px;width:180px;padding:6px 8px;display:none;position:fixed}#connection-label-input.visible{display:block}#connected-object-palette{z-index:2400;background:#fff;border:1px solid #ddd;border-radius:10px;grid-template-columns:1fr 1fr;gap:4px;padding:7px;display:none;position:fixed;box-shadow:0 8px 28px #00000029}#connected-object-palette.visible{display:grid}#connected-object-palette strong{grid-column:1/-1;padding:2px 4px;font-size:11px}#connected-object-palette button{background:#f5f5f7;border-radius:6px;padding:7px;font-size:11px}#connection-inspector{z-index:125;background:#fff;border-left:1px solid #ddd;width:270px;padding:18px;display:none;position:absolute;top:48px;bottom:24px;right:0;box-shadow:-5px 0 22px #00000014}#connection-inspector.visible{display:block}#connection-inspector h3{margin:0 0 14px;font-size:14px}#connection-inspector dl{grid-template-columns:88px 1fr;gap:9px;font-size:12px;display:grid}#connection-inspector dt{color:#777}#connection-inspector dd{margin:0;font-weight:600}#object-inspector{z-index:500;isolation:isolate;pointer-events:auto;background:#fff;border-left:1px solid #ddd;flex-direction:column;width:320px;display:none;position:absolute;top:48px;bottom:24px;right:0;box-shadow:-5px 0 22px #00000014}#object-inspector.visible{display:flex}.oi-head{border-bottom:1px solid #ececf0;padding:17px 18px 13px}.oi-kicker{color:#9296a0;text-transform:uppercase;letter-spacing:.55px;font-size:10px;font-weight:700}.oi-head h3{text-overflow:ellipsis;white-space:nowrap;margin:4px 0 0;font-size:16px;overflow:hidden}.oi-body{flex:1;padding:16px 18px 22px;overflow:auto}.oi-section-title{justify-content:space-between;align-items:center;margin-bottom:9px;font-size:12px;font-weight:700;display:flex}.oi-primary{margin-bottom:18px}.oi-attributes{border-bottom:1px solid #ececf0;margin-bottom:18px;padding-bottom:18px}.oi-primary-card{background:#f7f8fc;border:1px solid #dfe2ea;border-radius:9px;grid-template-columns:1fr 84px;gap:6px;padding:10px;display:grid}.oi-primary-card input{color:#20242c;background:#fff;border:1px solid #d5d8e2;border-radius:6px;width:100%;min-width:0;height:32px;padding:0 8px;font-size:12px}.oi-primary-card [data-primary-field=value]{font-size:14px;font-weight:700}.oi-primary-meta{color:#777d89;grid-column:1/-1;justify-content:space-between;align-items:center;min-width:0;font-size:10px;display:flex}.oi-layer-section{margin:0}.oi-layer{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.oi-layer button{color:#505561;background:#fff;border:1px solid #d7d9e2;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:1px;min-height:44px;font-size:15px;display:flex}.oi-layer button small{font-size:8px;font-weight:650}.oi-layer button:hover{color:#4355f4;background:#f2f4ff;border-color:#7b88f7}.oi-primary-preview{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.oi-kind{color:#4d5878;background:#e9ecf8;border-radius:999px;flex:none;padding:2px 6px;font-weight:700}.oi-empty{color:#969aa4;text-align:center;border:1px dashed #d8dae2;border-radius:9px;padding:14px 10px;font-size:11px}.oi-cells{flex-direction:column;gap:9px;display:flex}.oi-cell{background:#fafafa;border:1px solid #e3e4e9;border-radius:9px;grid-template-columns:1fr 84px;gap:6px;padding:10px;display:grid;position:relative}.oi-cell input,.oi-cell select{color:#262932;background:#fff;border:1px solid #d9dbe2;border-radius:6px;width:100%;min-width:0;height:29px;padding:0 7px;font-size:11px}.oi-cell [data-cell-field=label]{grid-column:1/-1;padding-right:30px;font-weight:650}.oi-cell [data-cell-delete]{color:#b34848;border-radius:7px;width:36px;height:36px;font-size:17px;position:absolute;top:7px;right:7px}.oi-cell [data-cell-delete]:hover{background:#feecec}.oi-add{grid-template-columns:1fr 104px;gap:6px;margin:0 0 10px;display:grid}.oi-add select,.oi-add button{color:#505561;background:#fff;border:1px solid #d7d9e2;border-radius:7px;min-width:0;min-height:40px;padding:0 9px;font-size:10.5px}.oi-add button:hover{color:#4355f4;background:#f2f4ff;border-color:#7b88f7}.oi-frame-properties{border-bottom:1px solid #ececf0;margin-bottom:18px;padding-bottom:18px}.oi-field{color:#6d7280;flex-direction:column;gap:6px;font-size:11px;font-weight:650;display:flex}.oi-field input{color:#20242c;background:#fff;border:1px solid #d7d9e2;border-radius:7px;width:100%;height:36px;padding:0 9px;font:500 12px/1 inherit}.oi-frame-actions{grid-template-columns:1fr 1fr;gap:7px;display:grid}.oi-frame-actions button{color:#505561;background:#fff;border:1px solid #d7d9e2;border-radius:7px;min-height:40px;padding:0 9px;font-size:11px}.oi-frame-actions button:hover{color:#4355f4;background:#f2f4ff;border-color:#7b88f7}.oi-frame-actions button.danger:hover{color:#c73939;background:#fff2f2;border-color:#c73939}.oi-layer-help{color:#777d89;margin:0 0 9px;font-size:10.5px;line-height:1.45}.oi-layer button:disabled{opacity:.38;cursor:not-allowed;background:#f7f7f8}#canvas-screen.inspector-open #canvas-area{margin-right:320px}@media (width<=760px){#canvas-screen.inspector-open #canvas-area{margin-right:0}#object-inspector{width:min(88vw,320px);box-shadow:-12px 0 36px #00000029}#connection-inspector{width:min(88vw,300px)}#frame-toolbar,#connection-toolbar,#shape-toolbar{overscroll-behavior-x:contain;max-width:calc(100vw - 24px);overflow-x:auto}}#undo-toast{z-index:300;color:#fff;background:#242933;border-radius:8px;align-items:center;gap:9px;padding:8px 11px;font-size:12px;display:none;position:absolute;bottom:42px;left:50%;transform:translate(-50%)}#undo-toast.visible{display:flex}#undo-toast button{color:#9eabff;font-weight:700}#connection-cycle{color:#666;padding:0 4px;font-size:10px}#shape-palette{z-index:140;background:#fff;border:1px solid #dedede;border-radius:12px;grid-template-columns:1fr 1fr;gap:4px;width:210px;padding:7px;display:none;position:absolute;top:50%;left:58px;transform:translateY(-50%);box-shadow:0 8px 28px #00000024}#shape-palette.visible{display:grid}.shape-choice{color:#3f4852;text-align:left;background:#fafafa;border-radius:8px;min-height:34px;padding:6px 7px;font-size:11px}.shape-choice:hover{color:#3447dd;background:#eef0ff}#shape-toolbar{z-index:130;white-space:nowrap;background:#fff;border:1px solid #dcdcdc;border-radius:11px;align-items:center;gap:3px;padding:6px;display:none;position:absolute;transform:translate(-50%,-100%);box-shadow:0 7px 26px #00000021}#shape-toolbar.visible{display:flex}.shape-tool-select,.shape-tool-btn{color:#4b5560;background:#f7f7f7;border:0;border-radius:7px;height:29px;padding:0 8px;font-size:11px}.shape-tool-btn:hover,.shape-tool-select:hover{color:#3447dd;background:#eef0ff}.shape-swatch{width:18px;padding:0}#drop-feedback{color:#fff;opacity:0;pointer-events:none;z-index:150;background:#263238;border-radius:8px;padding:7px 11px;font-size:11px;transition:opacity .15s;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}#drop-feedback.visible{opacity:1}.frame.structural-frame{box-shadow:none;z-index:1;background:#4355f409;border:2px solid #8d98f7;border-radius:8px;min-width:160px;min-height:90px}.frame.structural-frame .frame-clip{pointer-events:none;overflow:visible}.frame.structural-frame .frame-inner{padding:0}.frame.structural-frame .frame-label{color:#4554c7;text-transform:none;letter-spacing:0;background:#f5f5f5;border-radius:4px;max-width:calc(100% - 16px);padding:2px 6px;font-size:12px;display:block;position:absolute;top:-23px;left:8px}.frame.structural-frame .frame-body,.frame.structural-frame .frame-unit,.frame.structural-frame .frame-formula-hint,.frame.structural-frame .port{display:none}.frame.structural-frame.selected{z-index:2;border-color:#4355f4;box-shadow:inset 0 0 0 1px #4355f4}.frame.structural-frame.locked:after{content:"🔒";font-size:12px;position:absolute;top:6px;right:7px}.frame.structural-frame.containment-target{background:#4355f41f;box-shadow:0 0 0 3px #4355f438}.frame.canvas-focused:not(.selected):not(.multi-selected){outline-offset:4px;outline:3px dotted #f09b2d!important}#canvas-area.grid-off{background-image:none!important}#marquee{pointer-events:none;z-index:70;background:#4355f41a;border:1px solid #4355f4;display:none;position:absolute}#marquee.rtl{background:#00b8941a;border-style:dashed;border-color:#00a77f}#alignment-guides{pointer-events:none;z-index:69;width:100%;height:100%;position:absolute;inset:0}#alignment-guides line{stroke:#ee4c9b;stroke-width:1px;stroke-dasharray:4 3}#frames-panel{z-index:78;background:#fff;border:1px solid #ddd;border-radius:10px;width:190px;max-height:270px;position:absolute;top:14px;right:14px;overflow:hidden;box-shadow:0 5px 20px #0000001a}#frames-panel summary{cursor:pointer;padding:8px 10px;font-size:12px;font-weight:650}#frames-list{max-height:220px;padding:0 6px 7px;overflow:auto}.frames-help{color:#858a95;padding:0 4px 6px;font-size:9.5px;line-height:1.35}.frames-item{cursor:pointer;text-align:left;color:#30343c;border-radius:6px;align-items:center;gap:6px;width:100%;padding:7px 6px;font:500 11px/1.2 inherit;display:flex}.frames-item:hover,.frames-item:focus-visible{color:#4355f4;background:#f0f2ff;outline:none}.frames-item-title{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}#minimap{z-index:77;cursor:crosshair;background:#fffffff0;border:1px solid #ccc;border-radius:8px;width:180px;height:120px;position:absolute;bottom:72px;right:14px}.empty-hidden,[hidden]{display:none!important}#empty-board-hint{z-index:55;text-align:center;background:#fffffff5;border:1px solid #e0e2e8;border-radius:14px;width:min(520px,100% - 180px);padding:22px;position:absolute;top:43%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 28px #1e233c14}#empty-board-hint h2{color:#1c1c1e;margin:0 0 6px;font-size:18px;font-weight:650}#empty-board-hint p{color:#6f7480;margin:0 0 16px;font-size:12px}.empty-actions{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.empty-actions button{color:#30343b;background:#fff;border:1px solid #c7cad5;border-radius:8px;padding:8px 11px;font-size:12px}.empty-actions button:hover{color:#4355f4;background:#f4f6ff;border-color:#5b76fe}.empty-tip{color:#a0a4ad;margin-top:13px;font-size:10px;display:block}.zhud-btn:disabled{color:#c6c8ce;cursor:not-allowed;background:#fafafa}#frame-delete-choice{z-index:190;background:#fff;border:1px solid #d7d7d7;border-radius:10px;align-items:center;gap:5px;padding:7px;display:none;position:absolute;top:62px;left:50%;transform:translate(-50%);box-shadow:0 8px 28px #00000029}#frame-delete-choice.visible{display:flex}#frame-delete-choice button{background:#f3f3f3;border-radius:7px;padding:7px 9px;font-size:11px}#frame-delete-choice [data-delete=frame-only]{color:#fff;background:#4355f4}#frame-toolbar{z-index:135;white-space:nowrap;background:#fff;border:1px solid #ddd;border-radius:9px;gap:3px;padding:5px;display:none;position:absolute;transform:translate(-50%,-100%);box-shadow:0 6px 22px #00000021}#frame-toolbar.visible{display:flex}#frame-toolbar button{background:#f6f6f6;border-radius:6px;padding:6px 8px;font-size:11px}@keyframes dashFlow{to{stroke-dashoffset:-200px}}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}