:root{--bg:#f3f4f6;--panel:#fff;--border:#e5e7eb;--ink:#111827;--muted:#6b7280;--accent:#2563eb;--accent-soft:#dbeafe;--danger:#dc2626;--radius:8px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:var(--bg);font-size:13px;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.app{grid-template-rows:44px 1fr 26px;grid-template-columns:280px 1fr 300px;height:100%;display:grid}.topbar{background:var(--panel);border-bottom:1px solid var(--border);grid-column:1/-1;align-items:center;gap:6px;padding:0 10px;display:flex}.topbar .brand{align-items:center;gap:6px;margin-right:12px;font-size:15px;font-weight:700;display:flex}.topbar .brand svg{width:20px;height:20px}.topbar .spacer{flex:1}.topbar .doc-name{background:0 0;border:1px solid #0000;border-radius:6px;min-width:160px;padding:4px 8px}.topbar .doc-name:focus{border-color:var(--border);background:var(--bg);outline:none}.menu{position:relative}.menu>button{background:0 0;border:none;border-radius:6px;padding:6px 10px}.menu>button:hover,.menu.open>button{background:var(--bg)}.menu-list{z-index:50;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);min-width:220px;padding:4px;position:absolute;top:100%;left:0;box-shadow:0 8px 24px #0000001f}.menu-list button{text-align:left;background:0 0;border:none;border-radius:6px;justify-content:space-between;gap:16px;width:100%;padding:7px 10px;display:flex}.menu-list button:hover:not(:disabled){background:var(--accent-soft)}.menu-list button:disabled{color:var(--muted);cursor:default}.menu-list .sep{background:var(--border);height:1px;margin:4px 0}.menu-list kbd{color:var(--muted);font-family:var(--font);font-size:11px}.left,.right{background:var(--panel);flex-direction:column;display:flex;overflow:hidden}.left{border-right:1px solid var(--border)}.right{border-left:1px solid var(--border)}.center{flex-direction:column;min-width:0;display:flex;position:relative}.canvas-host{background:#e9ebef radial-gradient(#d4d7dd 1px,#0000 1px) 0 0/16px 16px;flex:1;position:relative;overflow:hidden}.canvas-host canvas{display:block}.toolbar{background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:2px;padding:4px 8px;display:flex}.toolbar .group{border-right:1px solid var(--border);gap:2px;margin-right:6px;padding-right:6px;display:flex}.toolbar .group:last-child{border-right:none}.tbtn{width:32px;height:30px;color:var(--ink);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;display:inline-flex}.tbtn:hover:not(:disabled){background:var(--bg)}.tbtn.active{background:var(--accent-soft);color:var(--accent)}.tbtn:disabled{opacity:.35;cursor:default}.tbtn svg{width:18px;height:18px}.tbtn.wide{gap:6px;width:auto;padding:0 10px;font-size:12px}.statusbar{background:var(--panel);border-top:1px solid var(--border);color:var(--muted);grid-column:1/-1;align-items:center;gap:12px;padding:0 10px;font-size:12px;display:flex}.statusbar .spacer{flex:1}.statusbar button{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px 6px}.statusbar button:hover{background:var(--bg)}.lib-search{border-bottom:1px solid var(--border);gap:6px;padding:8px;display:flex}.lib-search input{border:1px solid var(--border);background:var(--bg);border-radius:6px;flex:1;padding:6px 8px}.lib-search input:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}.lib-body{flex:1;overflow-y:auto}.lib-cat{border-bottom:1px solid var(--border)}.lib-cat>header{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:8px 10px;font-weight:600;display:flex}.lib-cat>header:hover{background:var(--bg)}.lib-cat>header .count{color:var(--muted);font-weight:400}.lib-grid{grid-template-columns:repeat(4,1fr);gap:4px;padding:4px 8px 10px;display:grid}.lib-item{cursor:grab;background:0 0;border:1px solid #0000;border-radius:6px;flex-direction:column;align-items:center;gap:2px;padding:4px 2px;display:flex}.lib-item:hover{border-color:var(--border);background:var(--bg)}.lib-item .preview{justify-content:center;align-items:center;width:48px;height:44px;display:flex}.lib-item .preview svg{max-width:48px;max-height:44px}.lib-item .label{color:var(--muted);text-align:center;max-width:62px;max-height:23px;font-size:10px;line-height:1.15;overflow:hidden}.lib-empty{color:var(--muted);text-align:center;padding:20px}.lib-special{gap:6px;padding:8px;display:grid}.lib-special button{border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);text-align:left;align-items:center;gap:8px;padding:8px;display:flex}.lib-special button:hover{background:var(--accent-soft);border-color:var(--accent)}.lib-special button b{display:block}.lib-special button span{color:var(--muted);font-size:11px}.props{flex-direction:column;flex:1;gap:10px;padding:8px 10px;display:flex;overflow-y:auto}.props h4{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:6px 0 2px;font-size:11px}.row{align-items:center;gap:6px;display:flex}.row label{width:74px;color:var(--muted);flex-shrink:0}.row input[type=number],.row input[type=text],.row select{border:1px solid var(--border);background:var(--bg);border-radius:6px;flex:1;min-width:0;padding:4px 6px}.row input[type=range]{flex:1}.row .pair{flex:1;gap:6px;display:flex}.row .pair input{width:50%}.color-input{flex:1;align-items:center;gap:6px;display:flex}.color-input .swatch{border:1px solid var(--border);background:0 0;border-radius:6px;width:26px;height:24px;padding:0;position:relative;overflow:hidden}.color-input .swatch input{cursor:pointer;border:none;width:200%;height:200%;padding:0;position:absolute;inset:-6px}.color-input .hex{border:1px solid var(--border);background:var(--bg);border-radius:6px;width:76px;padding:4px 6px;font-family:ui-monospace,Menlo,monospace;font-size:12px}.color-input .none{border:1px dashed var(--border);color:var(--muted);background:0 0;border-radius:6px;padding:3px 6px;font-size:11px}.color-input .none.active{border-color:var(--accent);color:var(--accent)}.btn-row{flex-wrap:wrap;gap:4px;display:flex}.btn{border:1px solid var(--border);background:var(--panel);border-radius:6px;align-items:center;gap:6px;padding:6px 10px;display:inline-flex}.btn:hover:not(:disabled){background:var(--bg)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover:not(:disabled){background:#1d4ed8}.btn.danger{color:var(--danger)}.btn:disabled{opacity:.5;cursor:default}.btn svg{width:16px;height:16px}.props .hint{color:var(--muted);font-size:12px;line-height:1.4}.props textarea{border:1px solid var(--border);background:var(--bg);resize:vertical;border-radius:6px;width:100%;min-height:70px;padding:6px}.swatches{flex-wrap:wrap;gap:4px;display:flex}.swatches button{border:1px solid #00000026;border-radius:4px;width:18px;height:18px;padding:0}.modal-backdrop{z-index:100;background:#11182759;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--panel);border-radius:12px;flex-direction:column;width:min(960px,94vw);max-height:92vh;display:flex;box-shadow:0 20px 60px #00000040}.modal.narrow{width:min(520px,94vw)}.modal>header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 18px;font-size:15px;font-weight:600;display:flex}.modal>header button{color:var(--muted);background:0 0;border:none;font-size:18px}.modal>.body{flex-direction:column;flex:1;gap:12px;padding:14px 18px;display:flex;overflow-y:auto}.modal>footer{border-top:1px solid var(--border);justify-content:flex-end;gap:8px;padding:12px 18px;display:flex}.modal .grid2{grid-template-columns:1fr 1fr;gap:10px 16px;display:grid}.modal .grid3{grid-template-columns:repeat(3,1fr);gap:10px 16px;display:grid}.field{flex-direction:column;gap:4px;display:flex}.field label{color:var(--muted);font-size:12px}.field input,.field select,.field textarea{border:1px solid var(--border);background:var(--bg);border-radius:6px;padding:6px 8px}.field textarea{resize:vertical;min-height:64px;font-family:inherit}.stage-card{border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.stage-card header{align-items:center;gap:8px;font-weight:600;display:flex}.stage-card header .spacer{flex:1}.stage-card header .color-input{flex:0}.stage-card .icon-btn{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px 4px}.stage-card .icon-btn:hover{background:var(--bg);color:var(--ink)}.template-list{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;display:grid}.template-card{border:1px solid var(--border);border-radius:var(--radius);text-align:left;background:var(--panel);flex-direction:column;gap:6px;padding:12px;display:flex}.template-card:hover{border-color:var(--accent);background:var(--accent-soft)}.template-card b{font-size:14px}.template-card span{color:var(--muted);font-size:12px}.radio-list{flex-wrap:wrap;gap:10px;display:flex}.radio-list label{align-items:center;gap:4px;display:flex}.toast{color:#fff;z-index:200;background:#111827;border-radius:8px;padding:8px 14px;font-size:13px;position:fixed;bottom:40px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0003}.check{align-items:center;gap:6px;display:flex}.format-list{flex-direction:column;gap:6px;display:flex}.format-option{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;align-items:flex-start;gap:10px;padding:8px 10px;display:flex}.format-option.active{border-color:var(--accent);background:var(--accent-soft)}.format-option input{margin-top:3px}.format-option .desc{color:var(--muted);font-size:12px}.modal.wide{width:min(1400px,96vw);height:92vh}.onto-body{gap:8px}.onto-columns{flex:1;grid-template-columns:460px 1fr;gap:14px;min-height:0;display:grid}.onto-left{flex-direction:column;gap:8px;min-height:0;padding-right:4px;display:flex;overflow-y:auto}.tabs{border-bottom:1px solid var(--border);gap:4px;display:flex}.tabs button{color:var(--muted);background:0 0;border:none;border-bottom:2px solid #0000;padding:6px 10px}.tabs button.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}.onto-tree{border:1px solid var(--border);border-radius:var(--radius);max-height:300px;font-size:12px;overflow-y:auto}.onto-row{cursor:pointer;border-left:3px solid #0000;align-items:center;gap:4px;padding:2px 6px 2px 0;display:flex}.onto-row:hover{background:var(--bg)}.onto-row.selected{background:var(--accent-soft);border-left-color:var(--accent)}.onto-row.hidden-node .name{color:var(--muted);text-decoration:line-through}.onto-row .name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.onto-row .dot{border:1px solid #0003;border-radius:50%;flex-shrink:0;width:9px;height:9px}.onto-row .spacer{flex:1}.onto-row .icon-btn{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px;display:inline-flex}.onto-row .icon-btn:hover{color:var(--ink);background:#fff}.onto-row .icon-btn.on{color:var(--accent);background:#fff}.onto-list{flex-direction:column;gap:4px;padding:6px 0;display:flex}.onto-list input[type=text],.onto-list input:not([type]){border:1px solid var(--border);border-radius:6px;flex:1;padding:4px 6px}.onto-list .icon-btn{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px 4px}.onto-appearance{flex-direction:column;gap:10px;display:flex}.onto-preview{border:1px solid var(--border);border-radius:var(--radius);background:#fff;flex-direction:column;min-height:0;display:flex}.onto-preview .preview-meta{color:var(--muted);border-bottom:1px solid var(--border);align-items:center;gap:6px;padding:4px 10px;font-size:12px;display:flex}.onto-preview .preview-meta .spacer{flex:1}.onto-preview .preview-meta .icon-btn{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px;display:inline-flex}.onto-preview .preview-meta .icon-btn:hover{background:var(--bg);color:var(--ink)}.onto-preview .preview-box{flex:1;padding:10px;overflow:auto}.onto-preview .preview-box.fit svg{max-width:100%;height:auto}.template-card.active{border-color:var(--accent)}details>summary{cursor:pointer;padding:4px 0;font-weight:600}.stage-card header input{border:1px solid var(--border);border-radius:6px;padding:4px 6px}.topbar .lab-mark{opacity:.8;color:var(--ink);border-radius:6px;align-items:center;margin-left:4px;padding:3px;display:inline-flex}.topbar .lab-mark:hover{opacity:1;background:var(--bg)}.topbar .lab-mark img{width:30px;height:30px;display:block}.topbar .github-mark svg{fill:currentColor;width:20px;height:20px;display:block}.about p{margin:0;line-height:1.5}.about .hint{color:var(--muted);font-size:12px;line-height:1.5}.about .hint a{color:inherit}.about-head{align-items:center;gap:12px;display:flex}.about-title{font-size:17px;font-weight:700}.about-version{color:var(--muted);margin-left:4px;font-size:13px;font-weight:500}.about-links{flex-direction:column;gap:4px;font-size:13px;display:flex}.about-ack{border-top:1px solid var(--border);flex-direction:column;gap:6px;padding-top:12px;display:flex}.about-ack-title{font-weight:600}.about-cite{background:var(--bg);border:1px solid var(--border);border-radius:6px;align-items:flex-start;gap:8px;padding:8px 10px;display:flex}.about-cite code{white-space:normal;-webkit-user-select:all;user-select:all;flex:1;font-size:12px;line-height:1.5}.lib-cat>header .by{color:var(--muted);margin-left:4px;font-size:11px;font-weight:400}.lib-cat>header .icon-btn{color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px;display:inline-flex}.lib-cat>header .icon-btn:hover{color:var(--ink);background:var(--panel)}.lib-templates{gap:4px;padding:0 8px 8px;display:grid}.lib-templates button{border:1px solid var(--border);background:var(--panel);text-align:left;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:flex}.lib-templates button:hover{background:var(--accent-soft);border-color:var(--accent)}.lib-templates button span{color:var(--muted);font-size:11px}.lib-cta{color:var(--muted);flex-direction:column;gap:6px;padding:8px 10px 12px;font-size:12px;line-height:1.5;display:flex}.lib-card{border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:6px;padding:10px 12px;display:flex}.lib-card-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.lib-chip{border:1px solid var(--border);border-radius:999px;align-items:center;gap:4px;margin:2px 4px 2px 0;padding:1px 8px;font-size:11px;display:inline-flex}.lib-chip button{color:var(--muted);background:0 0;border:none;padding:0 2px;font-size:13px}.save-preview{background:var(--bg);border:1px solid var(--border);border-radius:6px;justify-content:center;align-items:center;min-height:64px;padding:8px;display:flex}.save-preview .preview{justify-content:center;align-items:center;width:120px;height:100px;display:flex}.save-preview .preview svg{max-width:100%;max-height:100%}.modal .hint{color:var(--muted);font-size:12px;line-height:1.5}