.element-categories{display:flex;gap:5px;overflow:auto;margin:0 0 12px;padding-bottom:3px}.element-categories button{white-space:nowrap;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-size:8px}.element-categories button.active{border-color:rgba(184,255,69,.45);background:rgba(184,255,69,.08);color:var(--lime)}
.element-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.element-grid>button{display:grid;gap:6px;padding:8px;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}.element-grid>button:hover{border-color:rgba(184,255,69,.45);translate:0 -1px}.element-grid b{font-size:9px}.element-grid small{color:var(--muted);font-size:7px}.element-preview{height:56px;display:grid;place-items:center;overflow:hidden;border-radius:9px;background:#080c12;font-style:normal}.element-preview.logo{color:#0b1407;background:var(--lime);font-size:25px;font-weight:950}.element-preview.splash{background:radial-gradient(circle at 50% 50%,#d8ffad 0 7%,#79ff9f 8% 13%,transparent 14%),conic-gradient(from 20deg,transparent,#74ffa6,transparent,#b8ff45,transparent);filter:blur(.5px)}.element-preview.sticker{border:2px solid #fff;border-radius:50%;color:#fff;font-weight:950;rotate:-9deg}.element-preview.headline{font-size:23px;font-weight:950}.element-preview.cta{background:var(--lime);color:#0b1407;font-size:8px;font-weight:950}.element-preview.glow{background:radial-gradient(circle,#dfffff 0,#6fffff 13%,rgba(87,244,255,.28) 35%,transparent 70%)}
.design-layer-stage{position:absolute;z-index:4;inset:0;pointer-events:none}.design-object{position:absolute;left:0;top:0;display:grid;place-items:center;transform:translate(-50%,-50%) rotate(var(--rotation));width:var(--width);min-height:28px;pointer-events:auto;user-select:none;touch-action:none;cursor:move;opacity:var(--opacity);border-radius:var(--radius);transform-origin:center}.design-object.locked{cursor:not-allowed}.design-object.selected{outline:2px solid var(--lime);box-shadow:0 0 0 2px #07100d,0 0 22px rgba(184,255,69,.2)}.design-object.selected:not(.type-splash):not(.type-glow){z-index:10000!important}.design-object.type-splash:not(.selected),.design-object.type-glow:not(.selected){pointer-events:none}.design-object .layer-content{width:100%;height:100%;display:grid;place-items:center;border-radius:inherit;overflow:hidden;pointer-events:none}.design-object img{display:block;width:100%;height:auto;pointer-events:none}.design-object .resize-handle,.design-object .rotate-handle{display:none;position:absolute;z-index:4;width:15px;height:15px;border:2px solid #07100d;border-radius:50%;background:var(--lime);pointer-events:auto}.design-object.selected .resize-handle,.design-object.selected .rotate-handle{display:block}.design-object .resize-handle{right:-8px;bottom:-8px;cursor:nwse-resize}.design-object .rotate-handle{left:50%;top:-26px;translate:-50% 0;cursor:grab}.design-object .rotate-handle:after{content:"";position:absolute;left:50%;top:13px;width:1px;height:11px;background:var(--lime)}
.canvas-caption[hidden]{display:none}
.design-object.type-logo .layer-content{aspect-ratio:2.7/1;background:rgba(5,8,11,.72);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:clamp(8px,1.1vw,16px);font-weight:950;letter-spacing:.12em}.design-object.type-splash .layer-content{aspect-ratio:1;background:radial-gradient(circle,#e8ffe6 0 5%,#9dffbc 6% 12%,transparent 13%),conic-gradient(from 20deg,transparent 0 8%,#69ffaa 9% 14%,transparent 15% 30%,#b8ff45 31% 37%,transparent 38% 52%,#84efff 53% 58%,transparent 59%);filter:drop-shadow(0 0 12px rgba(112,255,182,.5))}.design-object.type-sticker .layer-content{aspect-ratio:1;border:3px solid #fff;border-radius:50%;background:#fe466d;color:#fff;font-size:clamp(8px,1vw,15px);font-weight:950}.design-object.type-headline .layer-content{justify-items:start;color:#fff;text-align:left;font-size:clamp(12px,2vw,30px);font-weight:950;line-height:.95;text-shadow:0 3px 16px #000}.design-object.type-cta .layer-content{min-height:32px;padding:8px 14px;background:var(--lime);color:#10150a;font-size:clamp(7px,.8vw,12px);font-weight:950;letter-spacing:.08em}.design-object.type-glow .layer-content{aspect-ratio:1;background:radial-gradient(circle,#fff 0,#aefeff 10%,rgba(75,238,255,.38) 32%,transparent 70%);mix-blend-mode:screen}.design-object.type-image .layer-content{background:transparent}
.selected-layer-summary{display:grid;gap:5px}.selected-layer-summary strong{font-size:15px}.selected-layer-summary small{color:var(--muted);line-height:1.5}.property-grid label{display:grid;gap:4px;color:var(--muted);font-size:7px}.property-grid label input{width:100%;color:var(--text)}.property-grid .danger{grid-column:1/-1;color:#ff8c96;border-color:rgba(255,100,110,.25)}
.layer.layer-object{cursor:pointer}.layer.layer-object.selected{border-color:rgba(184,255,69,.55)}.layer.layer-object button{border:0;background:transparent;color:var(--muted)}
@media(max-width:1100px){.design-object .resize-handle,.design-object .rotate-handle{width:16px;height:16px}.element-grid{grid-template-columns:1fr}}
.object-context-bar{position:absolute;z-index:30;left:var(--context-x,50%);top:var(--context-y,10px);translate:var(--context-translate,-50% 0);max-width:calc(100% - 18px);display:flex;align-items:center;gap:4px;padding:5px;border:1px solid rgba(255,255,255,.15);border-radius:11px;background:rgba(8,12,18,.94);box-shadow:0 12px 35px rgba(0,0,0,.45);backdrop-filter:blur(14px);pointer-events:auto;cursor:grab}.object-context-bar.dragging{cursor:grabbing}.object-context-bar[hidden]{display:none}.object-context-bar strong{max-width:110px;overflow:hidden;padding:0 7px;text-overflow:ellipsis;white-space:nowrap;font-size:8px;color:var(--lime);cursor:grab}.object-context-bar button{padding:6px 7px;border:0;border-radius:7px;background:transparent;color:#cbd3df;font-size:7px;cursor:pointer}.object-context-bar button:hover,.object-context-bar button:focus-visible{background:rgba(184,255,69,.11);color:var(--lime);outline:0}.object-context-bar [data-context-action="delete"]{color:#ff9ba4}
.design-object{max-width:96%;max-height:96%}.design-object .layer-content{overflow:hidden;overflow-wrap:anywhere;word-break:break-word}.design-object.type-headline .layer-content,.design-object.type-cta .layer-content,.design-object.type-sticker .layer-content{line-height:1.08}.object-context-bar button i{display:none}
.animation-properties[hidden],[data-properties-view][hidden]{display:none}.animation-presets{display:grid;grid-template-columns:1fr 1fr;gap:6px}.animation-presets button{padding:10px 7px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);font-size:8px}.animation-presets button.active{border-color:rgba(184,255,69,.55);background:rgba(184,255,69,.08);color:var(--lime)}.animation-properties output{display:block;margin:-4px 0 10px;text-align:right;color:var(--lime);font-size:8px}
.design-object.preview-animation[data-animation="fade"]{animation:greenline-fade var(--animation-duration,.7s) ease-out var(--animation-delay,0s) both}.design-object.preview-animation[data-animation="pop"]{animation:greenline-pop var(--animation-duration,.7s) cubic-bezier(.2,1.35,.4,1) var(--animation-delay,0s) both}.design-object.preview-animation[data-animation="slide-up"]{animation:greenline-slide-up var(--animation-duration,.7s) cubic-bezier(.2,.8,.3,1) var(--animation-delay,0s) both}.design-object.preview-animation[data-animation="drift"]{animation:greenline-drift var(--animation-duration,.7s) ease-out var(--animation-delay,0s) both}.design-object.preview-animation[data-animation="pulse"]{animation:greenline-pulse var(--animation-duration,.7s) ease-in-out var(--animation-delay,0s) both}@keyframes greenline-fade{from{opacity:0;transform:translate(-50%,-50%) rotate(var(--rotation)) scale(.96)}to{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation)) scale(1)}}@keyframes greenline-pop{from{opacity:0;transform:translate(-50%,-50%) rotate(var(--rotation)) scale(.35)}to{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation)) scale(1)}}@keyframes greenline-slide-up{from{opacity:0;transform:translate(-50%,calc(-50% + 34px)) rotate(var(--rotation))}to{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation))}}@keyframes greenline-drift{from{opacity:0;transform:translate(calc(-50% - 26px),-50%) rotate(var(--rotation))}to{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation))}}@keyframes greenline-pulse{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--rotation)) scale(.8)}55%{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation)) scale(1.1)}100%{opacity:var(--opacity);transform:translate(-50%,-50%) rotate(var(--rotation)) scale(1)}}
