:root{--chrome:#f0f0f0;--chrome-hover:#e2e6ea;--chrome-active:#d3e3f5;--border:#b6b6b6;--border-soft:#d6d6d6;--text:#1a1a1a;--text-dim:#5a5a5a;--accent:#3a76c8;--ui-font:"Segoe UI", system-ui, -apple-system, Arial, Helvetica, sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--ui-font);color:var(--text);background:var(--chrome);font-size:12px;overflow:hidden}#app{width:100%;height:100%}.modeler{background:var(--chrome);-webkit-user-select:none;user-select:none;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:auto minmax(0,1fr) auto;width:100%;height:100%;display:grid}.modeler-toolbar{background:var(--chrome);border-right:1px solid var(--border);flex-direction:column;grid-area:1/1;width:124px;padding:4px;display:flex;overflow:hidden}.modeler-toolbar-head,.modeler-toolbar-foot{flex:none}.modeler-toolbar-tools{flex-direction:column;flex:auto;gap:1px;min-height:0;display:flex;overflow-y:auto}.modeler-tool{font:inherit;text-align:left;color:var(--text);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:2px;padding:3px 7px}.modeler-tool:hover{background:var(--chrome-hover);border-color:var(--border-soft)}.modeler-tool.is-active{background:var(--chrome-active);border-color:var(--accent)}.modeler-toolbar-caption{color:var(--text-dim);padding:4px 7px 2px}.modeler-toolbar-row{border-bottom:1px solid var(--border-soft);flex-wrap:wrap;gap:1px;margin-bottom:3px;padding-bottom:3px;display:flex}.modeler-toolbar-foot .modeler-action{margin-top:1px}.modeler-action-small{text-align:center;flex:1 0 auto;min-width:34px;padding:3px 5px}.modeler-file-input{display:none}.modeler-stage{background:#fff;grid-area:1/2;min-width:0;min-height:0;position:relative;overflow:hidden}.modeler-canvas{touch-action:none;display:block;position:absolute;inset:0}.modeler-overlay{pointer-events:none;display:block;position:absolute;inset:0}.modeler-panel{background:var(--chrome);border-left:1px solid var(--border);flex-direction:column;grid-area:1/3;width:208px;display:flex}.modeler-panel.is-collapsed{width:208px}.modeler-panel-header{font:inherit;border:0;border-bottom:1px solid var(--border-soft);background:var(--chrome);color:var(--text);cursor:pointer;justify-content:space-between;align-items:center;padding:5px 8px;font-weight:600;display:flex}.modeler-panel-header:hover{background:var(--chrome-hover)}.modeler-panel-chevron{color:var(--text-dim)}.modeler-panel-body{color:var(--text-dim);background:#f7f7f7;flex:1;padding:8px}.modeler-statusbar{background:var(--chrome);border-top:1px solid var(--border);grid-area:2/1/auto/-1;align-items:center;gap:12px;height:26px;padding:0 8px;display:flex}.modeler-status{min-width:0;color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.modeler-measurements{align-items:center;gap:6px;display:flex}.modeler-drawer-toggle{font:inherit;white-space:nowrap;border:1px solid var(--border);color:var(--text);cursor:pointer;background:#fff;border-radius:2px;flex:none;padding:2px 8px;display:none}.modeler-drawer-toggle:hover{background:var(--chrome-hover)}.modeler-drawer-toggle[aria-expanded=true]{background:var(--chrome-active);border-color:var(--accent)}.modeler-measurements-label{color:var(--text-dim)}.modeler-measurements-input{font:inherit;text-align:right;border:1px solid var(--border);width:118px;color:var(--text);background:#fff;border-radius:2px;padding:2px 5px}.modeler-measurements-input:focus{outline:1px solid var(--accent);outline-offset:-1px}@media (width<=640px){.modeler{grid-template-columns:minmax(0,1fr);position:relative}.modeler-stage{grid-column:1}.modeler-toolbar,.modeler-panel{z-index:2;grid-area:1/1/2/2;position:absolute;top:0;bottom:0;box-shadow:0 0 8px #00000040}.modeler-toolbar{left:0;transform:translate(-100%)}.modeler-panel{right:0;transform:translate(100%)}.modeler-toolbar.is-open,.modeler-panel.is-open{transform:none}.modeler-toolbar:not(.is-open),.modeler-panel:not(.is-open){visibility:hidden;pointer-events:none}.modeler-drawer-toggle{display:block}.modeler-measurements-input{width:64px}.modeler-statusbar{gap:8px}}