*{box-sizing:border-box}body{margin:0;font:14px system-ui,sans-serif;color:#203246;background:#eef2f7}button,input,select{font:inherit}button{cursor:pointer;background:#fff;border:1px solid #bfcedb;border-radius:5px;padding:6px 10px;color:inherit}button:hover{background:#e4f2fb}button:disabled{opacity:.45;cursor:default}input,select{border:1px solid #bac9d6;border-radius:4px;padding:6px;min-width:0}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #e9a62f;outline-offset:1px}.app{height:100vh;display:grid;grid-template-columns:200px 1fr;grid-template-rows:58px 1fr 30px}header{grid-column:1/3;display:flex;align-items:center;gap:16px;padding:10px 20px;background:#17374c;color:#fff;box-shadow:0 2px 8px #182b3b33;z-index:20000}header strong{font-size:23px}header span{color:#a9cadd;margin-right:auto}header label{display:flex;align-items:center;gap:5px;white-space:nowrap}aside{background:#fff;border-right:1px solid #cfdae4;padding:20px 14px}aside h2{font-size:16px;margin:0}aside p{color:#64788b;font-size:12px;line-height:1.6;margin:18px 0}aside button{display:block;width:100%;text-align:left;margin:10px 0}aside button[aria-pressed=true]{background:#eaf3f9;border-color:#82acc5}.canvas{overflow:auto;background-image:radial-gradient(#b8c8d8 1px,transparent 1px);background-size:20px 20px}.stage{position:relative;min-width:1600px;min-height:900px;width:100%;height:100%}.panel{position:absolute;display:flex;flex-direction:column;background:#fff;border:1px solid #b9c9d7;border-radius:7px;box-shadow:0 6px 20px #22405b24;overflow:hidden;min-width:280px;min-height:250px}.panel.active{border-color:#267ea8;box-shadow:0 5px 20px #1b617533}.title{height:40px;flex-shrink:0;background:#e6edf4;display:flex;align-items:center;justify-content:space-between;padding:0 10px;cursor:move;touch-action:none;-webkit-user-select:none;user-select:none}.active .title{background:#d7ebf4}.title button{border:0;background:transparent;font-size:22px;padding:0 6px}.search{display:flex;gap:8px;padding:8px}.search>input{width:100%}.search label{display:flex;align-items:center;font-size:12px}.columns{display:grid;grid-template-columns:64px 1fr;background:#f0f5f9;border-bottom:1px solid #dbe4ec}.columns button{border:0;background:none;text-align:left}.rows{overflow-y:auto;flex:1;position:relative;min-height:0;scrollbar-gutter:stable}.rows[aria-busy=true]{opacity:.5}.row{position:absolute;left:0;right:0;height:30px;display:grid;grid-template-columns:64px 1fr;align-items:center;border-bottom:1px solid #ecf0f4;cursor:pointer;font-size:13px}.row span{padding:0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row:hover{background:#f0f7fb}.row[aria-selected=true]{background:#c5e5f5;font-weight:600}.panel footer{height:34px;display:flex;justify-content:space-between;align-items:center;gap:5px;padding:2px 16px 2px 6px;background:#f4f7fa;border-top:1px solid #dbe4ec;font-size:11px}.panel footer button{padding:0 8px;font-size:20px}.resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 50%,#78a0ba 51%,transparent 60%,#78a0ba 70%,transparent 80%)}.connections{position:absolute;inset:0;width:100%;height:100%;z-index:10000;pointer-events:none;overflow:visible}.connections line{stroke:#167ba6;stroke-width:2;opacity:.75}.status{grid-column:1/3;background:#dce7ee;padding:6px 18px;font-size:12px}.empty{text-align:center;padding:30px;color:#6b7d8e}.login{max-width:460px;margin:12vh auto;padding:30px;background:#fff;border-radius:8px;box-shadow:0 6px 30px #17374c20}.login label{display:block}.login input{display:block;width:100%;margin:10px 0}.login h1{color:#17374c}.login small{font-size:14px;color:#607e93}.login p{color:#667e91;line-height:1.5}.login [role=alert]{color:#a63030}aside{overflow:auto}.editor h2{margin:12px 0 8px}.editor label{display:block;margin:6px 0;font-size:12px}.editor input,.editor select{display:block;width:100%;margin-top:3px}.editor .actions{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}.editor .actions button{width:auto;margin:0;padding:5px;font-size:12px}.editor [role=alert]{color:#9c2525;white-space:pre-wrap}.draft{border:1px solid #87acbd;padding:6px;margin-top:8px}.modal{position:fixed;inset:0;background:#122e4388;display:grid;place-items:center;z-index:100000}.modal>div{background:#fff;padding:24px;border-radius:8px;min-width:400px;box-shadow:0 10px 50px #0005}.modal button{display:inline-block;width:auto;margin:10px}.login label{display:block;margin:12px 0}.login input{display:block;width:100%}.app{grid-template-rows:58px minmax(0,1fr) 30px}aside{overflow:auto;min-height:0}aside input:not([type=checkbox]),aside select,aside textarea{width:100%}aside label{display:block;margin-top:8px}.layouts ul{padding-left:14px;list-style:none}.layouts li button{padding:4px;margin:3px 0}.layouts summary,.table-editor summary{cursor:pointer;padding:7px 0}.layouts p{overflow-wrap:anywhere}.column-tools{display:flex;flex-wrap:wrap;gap:4px;padding:4px}.column-tools label{font-size:11px}.splitter{display:flex;align-items:center;font-size:11px;flex-shrink:0;padding:2px 7px;background:#e6edf4}.splitter input{flex:1;min-width:60px}.form-scroll{flex-shrink:0;overflow:auto;border-top:1px solid #bfcedb}.form-area{padding:5px}.form-canvas{position:relative}.form-canvas.design{background:repeating-linear-gradient(0deg,#e9f2f7 0px,#e9f2f7 1px,transparent 1px,transparent 10px)}.form-control{position:absolute;display:flex;align-items:center}.form-control input:not([type=checkbox]),.form-control select{width:100%;height:100%}.form-control.selected{outline:2px solid #267ea8}.design .form-control{border:1px dashed #6c8da3;touch-action:none}.control-hit{position:absolute;inset:0;cursor:move}.control-resize{position:absolute;right:0;bottom:0;width:12px;height:12px;background:#267ea8;cursor:nwse-resize}.designer-tools{display:flex;flex-wrap:wrap;gap:5px}.designer-tools fieldset{width:100%;display:flex;flex-wrap:wrap;gap:4px}.designer-tools fieldset label{display:flex;width:100%;justify-content:space-between}.designer-tools fieldset input{max-width:160px}.designer-tools label{font-size:11px}.form-control [role=note]{font-size:11px;background:#fff0c2}