*{box-sizing:border-box}body{margin:0;font:13px Inter,Arial,sans-serif;color:#d9dbe1;background:#17181c;overflow:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #35363e;background:#24252b;color:#d9dbe1;border-radius:7px;padding:9px 12px}button:hover{background:#363740}button:disabled{opacity:.35;cursor:default}.primary{background:#c9f17b;color:#172113;border-color:#c9f17b;font-weight:700}.primary:hover{background:#dcffa0}header{height:66px;display:flex;align-items:center;gap:9px;padding:0 20px;border-bottom:1px solid #303137;background:#1b1c21;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:10px;margin-right:30px;white-space:nowrap}.logo{font-size:27px;color:#c9f17b}.brand strong{font-size:16px}.beta{font-size:8px;letter-spacing:1px;background:#30352a;color:#c9f17b;padding:5px;border-radius:4px}input,select,textarea{background:#24252b;color:#e6e6e9;border:1px solid #373840;border-radius:5px;padding:9px;width:100%;min-width:0}#projectName{max-width:230px;background:transparent;border-color:transparent}#projectName:focus{border-color:#7e9c50}#saved{margin-left:auto;font-size:11px;color:#95969e;white-space:nowrap}aside{position:absolute;top:66px;bottom:0;background:#1c1d22;z-index:2}.left{left:0;width:224px;border-right:1px solid #303137}.right{right:0;width:260px;border-left:1px solid #303137;overflow:auto}.panel-title{font-size:9px;color:#82838d;letter-spacing:1.7px;padding:24px 18px 10px}.tabs{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #303137;padding:20px 18px}.tabs span{font-size:10px;color:#7f818b}#layers{padding:12px 8px;overflow:auto;max-height:calc(100% - 260px)}.layer{padding:10px 8px;margin-bottom:3px;display:flex;gap:8px;align-items:center;border-radius:5px;cursor:pointer;user-select:none}.layer:hover{background:#292a31}.layer.selected{background:#343d28;color:#d6f5a5}.layer.child{padding-left:23px;font-size:11px}.layer span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.layer button{padding:0 3px;border:0;background:none;font-size:11px}.left-bottom{position:absolute;bottom:25px;padding:0 20px;font-size:11px;color:#b7b8c0}.left-bottom p{color:#737581}.left-bottom small{line-height:1.7;color:#737581}.green{display:inline-block;width:6px;height:6px;border-radius:50%;background:#c9f17b;margin-right:7px}#viewport{position:absolute;inset:66px 260px 0 224px;overflow:hidden;background-color:#131418;background-image:radial-gradient(#34353b .8px,transparent .8px);background-size:20px 20px;touch-action:none}#world{position:absolute;transform-origin:0 0}.frame{position:absolute}.frame-label{position:absolute;top:-28px;left:0;white-space:nowrap;color:#a0a2ad;font-size:16px}.frame-content{position:absolute;inset:0;overflow:hidden}.element{position:absolute;transform-origin:center;user-select:none;white-space:pre-wrap;overflow:hidden;line-height:1.12;cursor:move}.element img{width:100%;height:100%;object-fit:cover;pointer-events:none}.selection{position:absolute;border:2px solid #c9f17b;pointer-events:none;z-index:9999;transform-origin:center}.handle{position:absolute;bottom:-6px;right:-6px;width:12px;height:12px;border:2px solid #a5c965;background:white;pointer-events:auto;cursor:nwse-resize}.canvas-label{position:absolute;top:24px;left:25px;color:#5e616c;font-size:9px;letter-spacing:1.3px;pointer-events:none}.canvas-label span{margin:0 12px;color:#393c45}.tools{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;padding:7px;background:#25262d;border:1px solid #41424a;box-shadow:0 8px 25px #0005;border-radius:12px}.tools button{border:0;background:transparent;font-size:21px;width:40px;height:40px;padding:5px}.tools .active{background:#c9f17b;color:#172113}.tools i,.navigation i{width:1px;height:22px;background:#41424a;margin:0 4px}.navigation{position:absolute;right:18px;top:18px;background:#222329;border:1px solid #363740;border-radius:8px;display:flex;align-items:center;padding:3px}.navigation button{border:0;background:transparent;padding:6px 8px;font-size:11px}.hint{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);color:#656873;font-size:9px;white-space:nowrap}#properties{padding:18px}h3{font-size:11px;font-weight:600;margin:22px 0 13px;color:#b4b6c0}label{display:block;color:#90929e;font-size:10px;margin-bottom:13px}label input,label select,label textarea{margin-top:6px}textarea{resize:vertical;min-height:80px}.row{display:flex;gap:10px;align-items:center}.row>*{flex:1}.property-title{font-size:16px;color:#eee;margin-bottom:5px}.muted{color:#7d808d;font-size:11px;line-height:1.7}.swatches{display:flex;gap:8px;margin:14px 0}.swatches button{width:25px;height:25px;border-radius:50%;padding:0;border:2px solid #444}.section{border-bottom:1px solid #32333b;padding-bottom:15px;margin-bottom:15px}dialog{background:#202127;color:#e8e9ee;border:1px solid #43454f;border-radius:16px;padding:30px;width:420px;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#0008}dialog h2{font-size:25px;margin:0 0 10px}dialog p{color:#9396a3;line-height:1.6;margin-bottom:22px}#presets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}#presets button{text-align:left;font-size:11px;line-height:1.8}#toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:#d2efaa;color:#263318;border-radius:8px;padding:12px 20px;z-index:20;display:none}@media(max-width:1050px){.left{width:180px}.right{width:220px}#viewport{left:180px;right:220px}.brand{margin-right:0}.beta,#saved{display:none}header{padding:0 12px}.tools{gap:0}.tools button{width:33px}}@media(max-width:750px){.left{display:none}#viewport{left:0;right:200px}.right{width:200px}.brand strong{display:none}#projectName{width:130px}header button{padding:8px}.canvas-label{display:none}}
.formatbar{position:fixed;top:76px;left:50%;transform:translateX(-50%);z-index:30;background:#272a30;border:1px solid #596247;padding:8px;border-radius:10px;display:flex;gap:6px;align-items:center;box-shadow:0 8px 30px #0008}.formatbar[hidden]{display:none}.formatbar input{width:65px}.formatbar select{width:120px}.formatbar input[type=color]{width:38px;height:34px;padding:2px}.selectiontools{position:absolute;top:62px;left:15px;right:15px;display:flex;gap:5px;align-items:center;font-size:10px}.selectiontools span{color:#90939d;margin-right:8px}.selectiontools button{font-size:10px;padding:6px}.selectiontools label{margin:0;display:flex;align-items:center;white-space:nowrap}.selectiontools input{width:auto}.element[contenteditable=true]{outline:3px solid #c9f17b;overflow:visible;user-select:text!important}
.library-dialog{width:min(950px,90vw);max-height:85vh}.library-heading{display:flex;justify-content:space-between;align-items:center}.library-heading small{color:#c9f17b;letter-spacing:2px;font-size:9px}.library-heading h2{margin-top:10px}.library-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.library-actions label{margin:8px}.library-actions input,#exportDialog input[type=checkbox]{width:auto}#libraryItems{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;padding:10px 0}.project-card{padding:20px;background:#292b32;border:1px solid #42454d;border-radius:12px}.project-card h3{font-size:17px;color:#eef0e9;margin:0 0 14px}.project-card button{font-size:11px;padding:7px}.campaign-dialog{width:470px;max-height:90vh}header .brand{margin-right:8px}header #projectName{max-width:180px}header #saved{font-size:9px}
/* Refined editor surfaces and interaction states */
:root{color-scheme:dark}button{min-height:34px;transition:background .15s,border-color .15s;white-space:nowrap}button:hover:not(:disabled){border-color:#646871}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #c9f17b;outline-offset:3px}button:active:not(:disabled){background:#41454b}.primary:active:not(:disabled){background:#b8df6c}header{gap:8px;padding:0 16px}header .brand{margin-right:12px}.brand .beta{display:none}header #projectName{flex:1;max-width:210px;min-width:100px}header button{flex-shrink:0}#undo,#redo{font-size:19px;width:36px;padding:0}#export{padding-inline:20px}#saved{max-width:110px;overflow:hidden;text-overflow:ellipsis}.tabs{height:58px;padding:18px}.tabs b{font-size:12px}.panel-title{padding-top:20px}.right #properties{padding:20px 18px}.property-title{font-size:18px;font-weight:600}.section{padding-bottom:18px;margin-bottom:18px}label{font-size:11px;line-height:1.4;color:#aaadb8}input,select,textarea{border-radius:7px;min-height:36px}input[type=color]{height:38px;padding:5px}input[type=checkbox]{min-height:0;accent-color:#c9f17b}.check-control{display:flex;align-items:center;gap:8px;margin:4px 0 0}.check-control input{width:15px;margin:0}.crop-button{width:100%;margin-bottom:20px}.layer{min-height:36px}.layer button{min-height:26px;min-width:23px}.left-bottom{border-top:1px solid #303137;padding-top:20px;left:16px;right:16px;padding-left:0}.tools{padding:6px;gap:3px;border-radius:14px;bottom:32px;background:#23262c}.tools button{width:40px;height:40px;border-radius:8px;display:grid;place-items:center}.tools svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.tools button:hover{background:#373c43}.tools .active:hover{background:#dcffa0}.canvas-label{top:24px;left:20px;font-size:9px}.canvas-label span{margin:0 6px}.navigation{top:16px}.selectiontools{top:62px;left:16px;right:auto;max-width:calc(100% - 32px);flex-wrap:wrap;background:#202329eb;border:1px solid #353a42;padding:6px;border-radius:10px;box-shadow:0 4px 18px #0003}.selectiontools>span{display:none}.selectiontools button{min-height:30px;padding:6px 9px}.selectiontools label{padding:0 7px;font-size:10px}.selectiontools input{margin:0 5px 0 0}.formatbar{top:78px;max-width:calc(100vw - 30px);gap:7px;padding:8px 10px}.formatbar>b{font-size:11px;margin-right:5px}.formatbar button{min-width:34px}.formatbar select{width:155px}.handle{box-sizing:border-box;border-radius:1px;background:#fff;touch-action:none}.handle.ne,.handle.sw{cursor:nesw-resize}.handle.rotate{border-radius:50%;background:#c9f17b;cursor:grab}.crop-dialog{width:480px}.crop-preview{position:relative;overflow:hidden;margin:20px auto;background:#121418;outline:1px solid #616977}.crop-preview img{position:absolute;max-width:none;pointer-events:none}input[type=range]{padding:0;accent-color:#c9f17b;min-height:24px}.crop-dialog output{float:right;color:#c9f17b}dialog{padding:28px;max-width:calc(100vw - 32px);max-height:88vh;overflow:auto;border-color:#424850}dialog h2{font-size:24px;letter-spacing:-.5px}dialog p{font-size:12px;color:#a4a9b5;margin-top:8px}dialog::backdrop{background:#090b10b8;backdrop-filter:blur(4px)}dialog .row:last-child{margin-top:20px}.project-card{background:#252930;border-color:#3c424c;padding:20px}.project-card h3{line-height:1.4}.project-card button{margin-top:4px}.library-actions{padding-bottom:12px;border-bottom:1px solid #363b44}.hint{font-size:10px;color:#8c919c}#toast{font-size:12px;box-shadow:0 8px 30px #0005;max-width:80vw;line-height:1.5}@media(max-width:1200px){header .brand strong{font-size:13px}header .brand{margin-right:0}header #projectName{max-width:150px}header button{padding-inline:9px}.canvas-label{display:none}}@media(max-width:900px){header{overflow-x:auto}.brand strong{display:none}.selectiontools{top:65px}.formatbar{flex-wrap:wrap}.tools button{width:34px}}

.swatches button{min-height:25px;flex:none}.check-control input{height:15px}.crop-preview{max-width:100%}
/* Compact, sectioned inspector */
.right #properties{padding:0 16px 20px}.right .property-title{font-size:13px;padding-top:18px}.right h3{font-size:11px;letter-spacing:.02em;color:#e0e2e8;margin:0 0 14px}.right .section,.inspector-section{padding:18px 0;margin:0;border-bottom:1px solid #32353c}.right .section h3{margin-top:0}.right label{font-size:10px;margin-bottom:10px}.right input,.right select{min-height:30px;padding:6px 8px;font-size:11px}.right .row{gap:8px}.right .row label{flex:1;min-width:0}.rotation-row{max-width:110px}.colour-control{display:flex;align-items:center;gap:7px;border:1px solid #3d414a;border-radius:6px;background:#25282f;padding:4px 7px;height:36px}.right .colour-control input[type=color]{width:24px;min-width:24px;height:24px;min-height:24px;padding:0;border:0;background:transparent;margin:0;cursor:pointer}.colour-control input[type=color]::-webkit-color-swatch-wrapper{padding:0}.colour-control input[type=color]::-webkit-color-swatch{border:1px solid #ffffff30;border-radius:4px}.colour-control>span{color:#858c99}.right .colour-control .hex-value{border:0;background:transparent;padding:3px 0;min-height:24px;font-family:monospace;letter-spacing:.06em}.opacity-control{display:flex;align-items:center;gap:12px}.opacity-control>input{flex:1;min-width:0;margin:0}.opacity-control>div{display:flex;align-items:center;width:74px;background:#25282f;border:1px solid #3d414a;border-radius:6px;padding-right:8px}.right .opacity-control input[type=number]{width:52px;border:0;background:transparent}.opacity-control span{font-size:11px;color:#969dab}.content-editor{margin-bottom:14px}.content-editor summary{font-size:10px;color:#a2a9b5;cursor:pointer;padding-bottom:8px}.content-editor label{margin-top:8px}.editing-note{color:#c9f17b;background:#c9f17b0c;border:1px solid #c9f17b24;border-radius:6px;padding:10px;font-size:10px;line-height:1.5;margin:15px 0 0}.formatbar .inline-hex{width:82px;font:11px monospace}.frame-content{overflow:visible}.group-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none}.layer i{font-style:normal;width:15px;color:#969daa}.frame-row{font-size:11px;font-weight:600;gap:5px}.frame-row>button,.group-row>button{width:20px}.group-row{margin-left:14px;font-size:11px;gap:5px}.group-row small{color:#858b96}.layer.child{padding-left:37px}.layer.child.nested{padding-left:56px}.right .check-control input{padding:0;min-height:14px}.right>.tabs{position:sticky;top:0;background:#1c1d22;z-index:1}.detach-group{width:100%;margin-top:4px}.right #properties>.row{margin-top:16px}.right #properties>h3{margin-top:18px}
