:root,:root[data-theme=light]{color-scheme:light;--bg: #f0eee6;--panel: #f5f4ed;--surface: #ffffff;--surface-hover: #f0eee6;--border: #dedcd1;--border-strong: #c2c0b6;--text: #141413;--muted: #73726c;--accent: #c96442;--accent-hover: #b55636;--accent-text: #ffffff;--accent-soft: rgba(201, 100, 66, .12);--success: #3d8a5a;--handle: #e2b13c;--handle-stroke: #8a6a12;--danger: #b53333;--warning-text: #a15c07;--shadow: 0 20px 50px rgba(20, 20, 19, .15);--toast-bg: #141413;--toast-text: #faf9f5}:root[data-theme=dark]{color-scheme:dark;--bg: #1a1918;--panel: #262624;--surface: #30302e;--surface-hover: #3a3a37;--border: #3e3e38;--border-strong: #55554f;--text: #faf9f5;--muted: #9c9a92;--accent: #d97757;--accent-hover: #e08a6d;--accent-text: #ffffff;--accent-soft: rgba(217, 119, 87, .18);--success: #6fbf86;--handle: #e2b93b;--handle-stroke: #a8841c;--danger: #e5625e;--warning-text: #e0a458;--shadow: 0 20px 50px rgba(0, 0, 0, .5);--toast-bg: #faf9f5;--toast-text: #141413}:root{font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,sans-serif;font-size:14px;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg)}button,input,select,textarea{font:inherit;color:inherit;touch-action:manipulation}button{padding:5px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);cursor:pointer;transition:background-color .1s,border-color .1s}button:hover:not(:disabled){background:var(--surface-hover);border-color:var(--border-strong)}button.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-text)}button.primary:hover:not(:disabled){border-color:var(--accent-hover);background:var(--accent-hover)}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}h2{margin:0 0 12px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}h3{margin:16px 0 8px;font-size:13px;font-weight:600}.hint{margin:0;color:var(--muted)}.app{display:flex;flex-direction:column;height:100%}.header{position:relative;z-index:10;background:var(--panel);border-bottom:1px solid var(--border)}.header-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:6px 12px 0}.logo{flex-shrink:0}.logo-tile{fill:var(--accent)}.logo-letter{fill:#fff}.title-block{display:flex;flex-direction:column;min-width:0}.name-input{width:320px;max-width:100%;padding:1px 6px;border:1px solid transparent;border-radius:6px;font-size:17px;background:transparent}.name-input:hover,.name-input:focus{border-color:var(--border);background:var(--surface)}.menu-row{display:flex;align-items:center;gap:12px}.save-state{font-size:12px;color:var(--muted)}.save-badge{padding:2px 10px;border:none;border-radius:4px;font-size:12px;background:var(--danger);color:#fff}.save-badge:hover:not(:disabled){background:var(--danger);filter:brightness(1.1)}.menubar{display:flex;flex-wrap:wrap}.menu-root{position:relative}.menubar-item{padding:3px 7px;border:none;border-radius:4px;background:transparent}.menubar-item:hover:not(:disabled),.menubar-item.open{background:var(--surface-hover)}.menu{position:absolute;top:calc(100% + 2px);left:0;z-index:50;min-width:230px;padding:4px;border:1px solid var(--border);border-radius:8px;background:var(--surface);box-shadow:var(--shadow)}.menu.up{top:auto;bottom:calc(100% + 2px)}.menu.submenu{top:-5px;left:100%}.menu-entry{position:relative}.menu-item{display:grid;grid-template-columns:20px 1fr auto;align-items:center;gap:6px;width:100%;padding:5px 8px 5px 4px;border:none;border-radius:5px;text-align:left;white-space:nowrap;background:transparent}.menu-item:hover:not(:disabled),.menu-item.active{background:var(--accent-soft)}.menu-check svg{display:block;margin:auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.menu-shortcut{padding-left:24px;font-size:12px;color:var(--muted)}.menu-hint{padding-left:24px;font-size:12px;font-style:italic;color:var(--muted)}.menu-item:disabled{opacity:1;color:var(--muted)}.menu-item:disabled .menu-label{opacity:.6}.menu-separator{height:1px;margin:4px 6px;background:var(--border)}.toolbar{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding:4px 10px}.toolbar-divider{flex-shrink:0;width:1px;height:20px;margin:0 6px;background:var(--border)}.toolbar-spacer{flex:1}.icon-button,.zoom-button{display:inline-flex;flex-shrink:0;align-items:center;gap:4px;padding:5px 7px;border:none;border-radius:6px;background:transparent}.zoom-button{min-width:72px;justify-content:space-between;font-variant-numeric:tabular-nums}.icon-button:hover:not(:disabled),.zoom-button:hover,.zoom-button.open{background:var(--surface-hover)}.icon-button.active{background:var(--accent-soft);color:var(--accent)}.icon{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.icon .icon-fill{fill:var(--accent-soft)}.dialog-backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:#0006}.dialog{width:min(520px,100%);max-height:100%;overflow-y:auto;padding:20px 22px 16px;border:1px solid var(--border);border-radius:12px;background:var(--panel);box-shadow:var(--shadow)}.dialog h2{margin-bottom:14px;font-size:16px;text-transform:none;letter-spacing:normal;color:var(--text)}.export-form{min-width:300px}.export-form .field input[type=number]{width:140px}.dialog-body{line-height:1.5}.about-developer{display:grid;justify-items:center;gap:4px;margin-bottom:16px;padding:18px 16px;border:1px solid var(--border);border-radius:12px;background:var(--bg);text-align:center}.about-logo{width:48px;height:48px;margin-bottom:4px}.about-title{font-size:18px;font-weight:800}.about-label{margin-top:4px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.about-name{font-size:16px;font-weight:800}.about-location{color:var(--muted);font-weight:700}.about-email{color:var(--accent);font-weight:700;text-decoration:none}.about-email:hover{text-decoration:underline}.about-terms-title{margin:14px 0 6px;font-size:14px;color:var(--text)}.about-terms{margin:0;padding-left:18px;color:var(--muted)}.about-terms li+li{margin-top:4px}.legal h3{margin:0 0 10px;font-size:14px}.legal h4{margin:14px 0 2px;font-size:13px;font-weight:700}.legal p{margin:0;color:var(--muted)}.legal a{color:var(--accent)}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.header-end{display:flex;align-items:center;gap:8px;margin-left:auto}.language-trigger{display:flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface);font-size:12px;font-weight:600;cursor:pointer}.language-trigger:hover{background:var(--surface-hover);border-color:var(--border-strong)}.language-flag{flex:0 0 auto;width:1.4em;aspect-ratio:4 / 3;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px #0000001f}.language-dialog{display:flex;flex-direction:column;width:min(24rem,100%);max-height:min(28rem,80vh);border:1px solid var(--border);border-radius:12px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.language-dialog-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border)}.language-dialog-title{font-weight:600}.language-dialog-close{padding:2px 8px;border:none;border-radius:6px;background:none;font-size:20px;line-height:1;cursor:pointer}.language-dialog-close:hover{background:var(--surface-hover)}.language-dialog-list{display:flex;flex-direction:column;gap:1px;padding:6px;overflow-y:auto}.language-item{display:flex;align-items:center;gap:10px;padding:7px 9px;border:none;border-radius:8px;background:transparent;font-size:13px;text-align:left;white-space:nowrap;cursor:pointer}.language-item:hover{background:var(--surface-hover)}.language-item.current{background:var(--surface-hover);font-weight:600}.language-dialog-note{padding:8px 14px 10px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}.theme-switch{display:flex;gap:2px;padding:2px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.theme-switch button{display:grid;place-items:center;padding:4px 8px;border:none;border-radius:7px;background:transparent;color:var(--muted)}.theme-switch button:hover:not(:disabled){background:var(--surface-hover);color:var(--text)}.theme-switch button.active{background:var(--accent-soft);color:var(--accent)}.theme-switch svg{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.workspace{display:flex;flex:1;min-height:0}.sidebar,.properties{flex-shrink:0;padding:14px;background:var(--panel);overflow-y:auto;overflow-x:hidden}.sidebar{border-right:1px solid var(--border)}.properties{border-left:1px solid var(--border)}.panel{display:flex;flex-shrink:0;min-height:0}.panel>aside{flex:1;min-width:0}.panel-resizer{position:relative;z-index:2;flex-shrink:0;width:7px;margin:0 -3px;cursor:col-resize;touch-action:none}.panel-resizer:after{content:"";position:absolute;inset:0 3px;transition:background-color .1s}.panel-resizer:hover:after,.panel-resizer:focus-visible:after,body.resizing-panel .panel-resizer:active:after{background:var(--accent)}.panel-resizer:focus-visible{outline:none}body.resizing-panel{cursor:col-resize;-webkit-user-select:none;user-select:none}.shape-search{display:flex;align-items:center;gap:6px;margin-bottom:10px;padding:0 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--muted)}.shape-search:focus-within{border-color:var(--accent)}.shape-search input{flex:1;min-width:0;padding:5px 0;border:none;outline:none;background:transparent;color:var(--text)}.search-results .hint{margin:0 0 8px;font-size:12px}.shape-group summary{margin:4px 0 8px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none}.shape-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:2px}.shape-item{display:grid;place-items:center;min-width:0;padding:6px 2px;border-color:transparent;background:transparent;cursor:grab}.shape-preview{fill:var(--surface);stroke:var(--muted);stroke-width:1.3}.shape-preview.lines,.shape-preview.container{fill:none}.shape-preview-fill{fill:var(--muted);stroke:var(--muted)}.shape-preview-label{fill:var(--panel);stroke:var(--muted);stroke-width:2}.shape-item:hover .shape-preview-fill{fill:var(--accent);stroke:var(--accent)}.shape-preview-text{fill:var(--muted);font-family:Helvetica,Arial,sans-serif}.shape-item:hover .shape-preview{stroke:var(--accent)}.shape-item:hover .shape-preview-text{fill:var(--accent)}.properties section{border-top:1px solid var(--border);margin-top:14px}.field{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.field>span{color:var(--muted)}.field input[type=number],.field select{width:100px;padding:4px 6px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.field input[type=color]{width:44px;height:28px;padding:2px;border:1px solid var(--border);border-radius:8px;background:var(--surface);cursor:pointer}.color-control{display:flex;align-items:center;gap:4px}.auto-toggle{padding:3px 7px;font-size:11px;color:var(--muted)}.auto-toggle.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.field-row{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}.field-row .field{flex-direction:column;align-items:stretch;gap:2px}.field-row .field input{width:100%}.button-row{display:flex;gap:6px}.button-row button{flex:1}.icon-row{display:flex;align-items:center;gap:2px}.icon-row-divider{width:1px;height:18px;margin:0 6px;background:var(--border)}.button-row button.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.field select.wide{width:140px}.field input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent)}.shortcuts{margin:0;padding-left:18px;color:var(--muted);line-height:1.6}.shortcuts b{color:var(--text);font-weight:500}.canvas-container{position:relative;flex:1;min-width:0;min-height:0;overflow:hidden}.canvas-column{display:flex;flex:1;flex-direction:column;min-width:0}.page-tabs{display:flex;flex-shrink:0;align-items:stretch;gap:2px;height:32px;padding:0 6px;border-top:1px solid var(--border);background:var(--panel)}.page-tabs-list{display:flex;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:thin}.page-tab{flex-shrink:0;max-width:200px;padding:0 12px;overflow:hidden;border:none;border-top:2px solid transparent;border-radius:0;background:transparent;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}.page-tab:hover{background:var(--surface-hover);color:var(--text)}.page-tab.active{border-top-color:var(--accent);background:var(--surface);color:var(--text);font-weight:600}.page-tab-input{width:140px;margin:3px 0;padding:0 8px}.page-tabs .icon-button{align-self:center}.scrollbars{position:absolute;inset:0;pointer-events:none}.scrollbar{position:absolute;pointer-events:auto}.scrollbar.horizontal{left:0;right:12px;bottom:0;height:12px}.scrollbar.vertical{top:0;right:0;bottom:12px;width:12px}.scrollbar-thumb{position:absolute;border-radius:6px;background:var(--border-strong);opacity:.55;transition:opacity .15s}.scrollbar.horizontal .scrollbar-thumb{top:3px;bottom:3px}.scrollbar.vertical .scrollbar-thumb{left:3px;right:3px}.scrollbar:hover .scrollbar-thumb,.scrollbar-thumb:active{opacity:1}.canvas{display:block;width:100%;height:100%;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}.canvas.panning{cursor:grabbing}.vertex{cursor:move}.edge{cursor:pointer}.image-placeholder{fill:none;stroke:var(--muted);stroke-dasharray:4 3}.guide{stroke:var(--accent);pointer-events:none}.cell-text{pointer-events:none}.ports circle{fill:var(--accent);stroke:var(--surface);opacity:0;cursor:crosshair;transition:opacity .1s}.vertex:hover .ports circle,.vertex.selected .ports circle{opacity:.9}.canvas.busy .ports{display:none}.selection-outline,.group-outline{fill:none;stroke:var(--accent);pointer-events:none}.edge-selection{stroke:var(--accent);stroke-opacity:.35}.resize-handle{fill:var(--surface);stroke:var(--accent)}.rotate-handle{cursor:grab}.rotate-handle circle{fill:var(--surface);stroke:var(--accent)}.rotate-handle path{stroke:var(--accent);stroke-linecap:round;stroke-linejoin:round}.canvas.busy .rotate-handle{cursor:grabbing}.segment-handle{fill:var(--handle);stroke:var(--handle-stroke)}.waypoint-handle{fill:var(--handle);stroke:var(--handle-stroke);cursor:move}.virtual-handle{fill:var(--surface);stroke:var(--handle-stroke);opacity:.8;cursor:copy}.endpoint-handle{fill:var(--surface);stroke:var(--accent);cursor:crosshair}.endpoint-handle.fixed{fill:var(--accent)}.rubber-band{fill:var(--accent-soft);stroke:var(--accent);pointer-events:none}.connect-preview{pointer-events:none}.connect-line{fill:none;stroke:var(--accent)}.target-outline{fill:none;stroke:var(--success)}.target-port{fill:var(--surface);stroke:var(--success)}.target-port.active{fill:var(--success)}.text-editor{position:absolute;box-sizing:border-box;padding:0;border:none;border-radius:2px;outline:2px solid var(--accent);outline-offset:2px;background:var(--surface);resize:none;overflow:hidden}.text-toolbar{display:flex;align-items:center;gap:2px;flex-wrap:wrap}.text-toolbar select{height:28px}.font-family-select{width:150px}.font-size-select{width:64px;margin-left:4px}.text-style-button{min-width:30px;justify-content:center;font-family:Georgia,serif;font-size:15px;line-height:1}.text-color-button{position:relative;cursor:pointer}.text-color-glyph{padding:0 3px;border-bottom:3px solid;font-weight:600;line-height:1.1}.text-color-button input[type=color]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);padding:8px 16px;border-radius:10px;background:var(--toast-bg);color:var(--toast-text);box-shadow:var(--shadow);z-index:20}.toast.error{background:var(--danger);color:#fff}