:root{font-family:Inter,system-ui,sans-serif;color:#20252d;background:#f5f6f8;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer;border:1px solid #dce0e6;border-radius:8px;background:white;padding:9px 14px;color:inherit}button:hover{background:#eef1f6}button:disabled{opacity:.45;cursor:default}.primary{background:#6055df;color:white;border-color:#6055df}.primary:hover{background:#5045cd}input,textarea{border:1px solid #dce0e6;border-radius:7px;padding:10px;width:100%;background:white}input:focus,textarea:focus{outline:2px solid #c9c4ff}label{display:block;color:#6a7281;font-size:12px;margin:14px 0 6px}h1{font-size:32px;letter-spacing:-1px}h2{font-size:18px}.muted{color:#858d9a}.brand{font-weight:800;letter-spacing:-.5px;font-size:20px}.brand span{color:#6055df}.login{width:380px;margin:14vh auto;background:white;border:1px solid #e1e4ea;border-radius:18px;padding:36px}.login button{width:100%;margin-top:24px}.error{color:#ba3344;margin-top:14px;min-height:18px}header{height:72px;background:white;border-bottom:1px solid #e1e4ea;display:flex;align-items:center;justify-content:space-between;padding:0 32px;gap:16px}.row{display:flex;align-items:center;gap:12px}.projects{max-width:1200px;margin:60px auto;padding:0 32px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}.card{text-align:left;padding:0;overflow:hidden;border-radius:14px}.thumb{height:168px;background:#e9e8f4;display:flex;align-items:center;justify-content:center}.mini-frame{width:160px;height:90px;background:white;box-shadow:0 5px 15px #302b5915;border-radius:3px;display:flex;align-items:center;justify-content:center;color:#b3afd7}.card-body{padding:22px}.card h2{margin:0 0 12px}.empty{padding:80px;text-align:center;border:1px dashed #cdd1db;border-radius:16px;grid-column:1/-1}.editor-header{height:64px;padding:0 20px}.editor-header input{width:240px;border:0;font-weight:600}.editor{display:grid;grid-template-columns:240px 1fr 260px;height:calc(100vh - 64px)}aside{background:white;padding:18px;border-right:1px solid #e1e4ea;overflow:auto}.inspector{border-left:1px solid #e1e4ea;border-right:0}aside h2{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#868c98;margin:12px 0 16px}.layer{display:block;width:100%;text-align:left;margin:5px 0;border:0;background:transparent;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer.selected{background:#eeecff;color:#6055df}.node-layer{padding-left:25px;font-size:12px}.workspace{position:relative;overflow:hidden;background-color:#edf0f4;background-image:radial-gradient(#c8ced8 1px,transparent 1px);background-size:20px 20px;touch-action:none}.canvas{position:absolute;transform-origin:0 0;width:1px;height:1px}.frame{position:absolute;box-shadow:0 3px 16px #25304618}.frame.selected{outline:3px solid #766aef}.frame-title{position:absolute;top:-30px;left:0;white-space:nowrap;font-size:18px;color:#566071;cursor:move}.node{position:absolute;overflow:hidden;user-select:none;cursor:move;white-space:pre-wrap;line-height:1.2}.node.selected{outline:3px solid #766aef}.node.hotspot{border:2px dashed #766aef;background:#766aef22}.zoom{position:absolute;bottom:20px;left:20px;display:flex;gap:8px;align-items:center;background:white;border-radius:10px;padding:6px;box-shadow:0 3px 14px #25304612}.zoom button{border:0}.toolbar{display:flex;gap:6px}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.inspector button{margin-top:14px;width:100%}#toast{position:fixed;bottom:25px;right:25px;background:#252c3c;color:white;border-radius:10px;padding:14px 20px;display:none;z-index:100}.preview{position:fixed;inset:0;background:#202532ed;z-index:90;display:flex;align-items:center;justify-content:center}.preview-stage{position:relative;overflow:hidden;flex-shrink:0}.preview button{position:absolute;top:20px;right:20px;z-index:1}.save-status{font-size:12px;color:#858d9a}@media(max-width:1000px){.editor{grid-template-columns:180px 1fr 220px}.toolbar button{padding:8px}.editor-header{gap:8px}.editor-header input{width:150px}.brand{font-size:16px}}@media(max-width:700px){.editor{grid-template-columns:140px 1fr}.inspector{position:absolute;right:0;bottom:0;max-height:45vh;width:220px;z-index:2}.editor-header{flex-wrap:wrap;height:auto;padding:10px}.editor{height:calc(100vh - 110px)}.save-status{display:none}.login{width:calc(100% - 32px)}}
select{width:100%;padding:10px;border:1px solid #dce0e6;border-radius:7px;background:white}.upload-button{display:block;text-align:center;padding:10px;background:#eeecff;color:#6055df;border-radius:8px;cursor:pointer}.asset-card{display:flex;align-items:center;gap:10px;width:100%;padding:8px;margin-top:8px;text-align:left}.asset-card img{width:45px;height:40px;object-fit:contain;background:#f1f2f6}.asset-card span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.preview-info{position:absolute;top:28px;left:24px;color:white}.preview .node.hotspot{background:transparent;border:0}
.frame-content{position:absolute;inset:0;overflow:hidden}
.editor{grid-template-columns:240px 1fr 300px}.mode-switch{display:flex;background:#eff0f5;border-radius:8px;padding:3px}.mode-switch button{border:0;background:transparent;padding:6px 10px}.mode-switch button.active{background:white;color:#6055df;box-shadow:0 1px 4px #252c3c18}.layer{border-radius:5px;position:relative;cursor:grab;border-top:2px solid transparent;border-bottom:2px solid transparent}.layer::before{content:'⠿';color:#a0a6b2;margin-right:6px}.layer.dragging{opacity:.35}.layer.drop-before{border-top-color:#766aef}.layer.drop-after{border-bottom-color:#766aef}.connections-svg{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none;z-index:5}.edge-hit{fill:none;stroke:transparent;stroke-width:30;pointer-events:stroke;cursor:pointer}.edge-line{fill:none;stroke:#766aef;stroke-width:5;pointer-events:none}.edge.active .edge-line{stroke:#4f39d7;stroke-width:8}.edge text{fill:#4f39d7;paint-order:stroke;stroke:#edf0f4;stroke-width:6;pointer-events:none}.pending{stroke-dasharray:16 12}.source-port{position:absolute;border-radius:50%;padding:0;border-style:solid;border-color:#766aef;background:white;transform:translate(-50%,-50%);z-index:6;cursor:crosshair}.source-port:hover{background:#766aef}.frame.connection-target{outline:8px solid #766aef}.interaction-row{text-align:left;color:#6055df;font-size:12px}.action-settings{margin-top:16px;padding:12px;background:#f6f6fa;border-radius:10px}.action-settings label:first-child{margin-top:0}.danger{color:#ba3344}.runtime-screens{position:absolute;inset:0}.runtime-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.preview #close-preview{z-index:100}.preview-info{z-index:100;pointer-events:none}@media(max-width:1150px){.editor-header{height:auto;min-height:64px;flex-wrap:wrap;padding:10px}.editor{height:calc(100vh - 110px);grid-template-columns:200px 1fr 260px}.toolbar{flex-wrap:wrap}}@media(max-width:700px){.editor{grid-template-columns:140px 1fr}}
.resize-handle{position:absolute;z-index:7;padding:0;border-style:solid;border-color:#766aef;background:white;border-radius:1px;transform:translate(-50%,-50%);touch-action:none}.resize-handle:hover{background:#eeecff}.resize-handle.nw,.resize-handle.se{cursor:nwse-resize}.resize-handle.ne,.resize-handle.sw{cursor:nesw-resize}
.layer{display:flex;align-items:center;gap:4px;min-height:36px;padding:7px 8px;white-space:normal}.layer::before{flex-shrink:0;margin-right:2px}.layer-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-control{width:24px;height:24px;padding:3px;border:0;background:transparent;flex-shrink:0;color:#9198a7;border-radius:4px;cursor:pointer}.layer-control svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.layer-control:hover,.layer-control.active{color:#6055df;background:#e4e0ff}.layer.is-hidden .layer-name{opacity:.4}.layer.is-locked{cursor:default}.node.locked{pointer-events:none;cursor:default}.node.locked.selected{outline-style:dashed}
.resize-handle.n,.resize-handle.s{cursor:ns-resize}.resize-handle.e,.resize-handle.w{cursor:ew-resize}.color-field{display:flex;gap:8px;align-items:center}.color-field input[type=color]{width:42px;height:40px;flex-shrink:0;padding:4px;cursor:pointer}.color-field input[data-hex]{min-width:0;font-family:ui-monospace,monospace;text-transform:uppercase}.frame-content{border-radius:inherit}
.runtime-persistent{position:absolute;inset:0;overflow:hidden;pointer-events:none}.runtime-screens{pointer-events:none}
.runtime-screen-group{position:absolute;inset:0;transform:translate(0,0)}
.runtime-components-overlay{position:absolute;inset:0;pointer-events:none;overflow:hidden}.node.group{background:transparent;overflow:visible}.group-content{position:absolute;transform-origin:0 0}.instance-layer{position:absolute;inset:0;pointer-events:none}.instance-layer .node{pointer-events:auto}.instance-background{z-index:0}.frame-content{position:absolute;inset:0;z-index:1;pointer-events:none}.frame-content .node{pointer-events:auto}.instance-overlay{z-index:2}

.inspector input[type=checkbox]{width:auto;margin-right:8px}.video-thumb{width:45px;height:40px;display:grid;place-items:center;background:#252c3c;color:white;border-radius:4px;flex-shrink:0}
.workspace,.zoom,.frame-title{user-select:none;-webkit-user-select:none}.editor-pointer-gesture,.editor-pointer-gesture *{user-select:none!important;-webkit-user-select:none!important}.workspace img,.workspace video{-webkit-user-drag:none}
.frame-viewport{position:absolute;inset:0;overflow:hidden;border-radius:inherit}
.layer-collapse{padding:0;width:20px;height:22px;flex:0 0 20px;border:0;background:transparent;line-height:1;font-size:16px}.layer-collapse-spacer{display:inline-block;width:20px;flex:0 0 20px}
.node.inline-text-editing{overflow:visible;cursor:text}.inline-text-input{position:absolute;inset:0;width:100%;height:100%;min-height:1.2em;margin:0;padding:0;border:0;border-radius:0;resize:none;background:transparent;color:inherit;font:inherit;line-height:inherit;text-align:inherit;letter-spacing:inherit;white-space:pre-wrap;outline:2px solid #766aef;user-select:text!important;-webkit-user-select:text!important;cursor:text;pointer-events:auto}