:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f5f5ee;background:#17191b;font-size:16px}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}.topbar{height:70px;border-bottom:1px solid #34383a;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:#1b1d1f}.brand{display:flex;align-items:center;gap:10px;font-size:1.27rem;font-weight:800;letter-spacing:-.06em}.brandmark{width:32px;height:32px;border-radius:9px;background:#c7f36a;color:#17191b;display:grid;place-items:center;font-size:1.8rem;line-height:1;font-weight:700}.brand-muted{color:#9ca19e}.top-right{font-size:.8rem;color:#9fa5a2;display:flex;align-items:center;gap:10px}.local-dot{width:7px;height:7px;background:#c7f36a;border-radius:50%}.top-divider{height:14px;border-left:1px solid #4a4f50;margin:0 7px}.workspace{display:grid;grid-template-columns:minmax(320px,380px) minmax(470px,1fr) minmax(280px,332px);min-height:calc(100vh - 70px)}.controls,.export-panel{background:#202325}.controls{border-right:1px solid #383c3e}.export-panel{border-left:1px solid #383c3e}.panel-heading{height:59px;border-bottom:1px solid #383c3e;padding:0 24px;display:flex;align-items:center;justify-content:space-between;color:#9da3a0;font-size:.74rem;font-weight:750;letter-spacing:.15em}.panel-pill{background:#31402b;color:#c7f36a;border-radius:20px;padding:6px 9px;letter-spacing:.09em;font-size:.63rem}.control-section{padding:24px;border-bottom:1px solid #383c3e}.first-section{padding-top:26px}.label-row{display:flex;justify-content:space-between;align-items:baseline}.controls label,.group-label,.export-settings label,.resolution legend{display:block;color:#e6e9e3;font-size:.84rem;font-weight:650;margin-bottom:10px}.helper,.hint{color:#929995;font-size:.72rem}.hint{line-height:1.5;margin:10px 0 0}.font-row{display:flex;gap:8px}.font-row select{min-width:0;flex:1}.controls select,.export-settings select,.controls textarea{background:#171a1b;border:1px solid #444a4b;color:#f3f5ed;border-radius:8px;padding:11px 12px;outline:none}.controls select:focus,.controls textarea:focus,.export-settings select:focus{border-color:#c7f36a}.upload-button{margin:0!important;border:1px solid #626b63;background:#303633;padding:11px 12px;border-radius:8px;white-space:nowrap;cursor:pointer;color:#dff3c2!important}.upload-button:hover{background:#3d4737}.controls textarea{width:100%;resize:vertical;min-height:90px;line-height:1.35;font-size:1rem}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}.two-col label,.wiggle-section>label{white-space:nowrap}.two-col output,.wiggle-section output{color:#c7f36a;float:right;font-size:.78rem;font-weight:500}input[type=range]{width:100%;height:5px;margin:7px 0 0;accent-color:#c7f36a;cursor:pointer}.segmented{display:flex;border:1px solid #4a5050;border-radius:8px;overflow:hidden;width:max-content}.segmented button{width:38px;height:34px;background:#262b2b;color:#c6cbc5;border:0;font-size:1.3rem;line-height:1}.segmented button+button{border-left:1px solid #4a5050}.segmented button.active{background:#c7f36a;color:#1a2018}.segmented button[data-align=right]{transform:scaleX(-1)}.color-wrap{height:36px;display:flex;align-items:center;gap:8px;border:1px solid #4a5050;border-radius:8px;padding:4px 8px;font-size:.72rem;color:#acb3ae}.color-wrap input{width:27px;height:25px;background:none;border:0;padding:0;cursor:pointer}.section-title{font-weight:700;display:flex;align-items:center;gap:7px;margin-bottom:20px}.wave-icon{color:#c7f36a;font-size:1.3rem}.wiggle-section .two-col{margin-top:0;margin-bottom:22px}.preview-area{background:#181b1c;min-width:0;display:flex;flex-direction:column;padding:27px 32px 18px}.preview-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:20px}.eyebrow{font-size:.7rem;letter-spacing:.17em;color:#9ba29d;font-weight:750}.preview-heading h1{font-size:1.18rem;margin:5px 0 0;letter-spacing:-.025em}.playing{font-size:.77rem;color:#aeb7a5;white-space:nowrap}.playing span{display:inline-block;background:#c7f36a;width:7px;height:7px;border-radius:50%;margin-right:6px;box-shadow:0 0 0 4px #c7f36a22}.stage-wrap{flex:1;min-height:440px;display:flex;align-items:center;justify-content:center;background:#252a2a;border:1px solid #363d3d;border-radius:12px;padding:18px;overflow:hidden}.stage{height:min(67vh,710px);max-width:100%;aspect-ratio:1080/1920;position:relative;box-shadow:0 20px 60px #0008;background-color:#d1d3d0;background-image:linear-gradient(45deg,#b8bcb9 25%,transparent 25%),linear-gradient(-45deg,#b8bcb9 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#b8bcb9 75%),linear-gradient(-45deg,transparent 75%,#b8bcb9 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.stage canvas{display:block;width:100%;height:100%}.stage-tag{position:absolute;bottom:11px;left:11px;padding:7px 9px;background:#1c2220b8;color:#ebf0e9;font-size:.56rem;letter-spacing:.14em;font-weight:700;border-radius:4px;pointer-events:none}.stage-toolbar{display:flex;gap:16px;justify-content:center;padding-top:15px;color:#949d98;font-size:.72rem}.stage-toolbar span+span:before{content:"·";margin-right:16px}.export-inner{padding:26px 24px}.export-icon{display:grid;place-items:center;background:#c7f36a;color:#1b1e1a;width:48px;height:48px;border-radius:12px;font-size:1.5rem;font-weight:650}.export-inner h2{font-size:1.28rem;letter-spacing:-.04em;line-height:1.2;margin:18px 0 10px}.export-inner>p{font-size:.84rem;color:#a7aeaa;line-height:1.5;margin:0 0 29px}.resolution{border:0;padding:0;margin:0 0 25px}.resolution legend{margin-bottom:11px}.option{display:flex;align-items:center;justify-content:space-between;border:1px solid #42484a;padding:13px 12px;border-radius:8px;margin-bottom:8px;cursor:pointer}.option:has(input:checked){border-color:#c7f36a;background:#2d3829}.option input{position:absolute;opacity:0}.option strong{font-size:.82rem;display:block}.option small{color:#a2aba2;font-size:.69rem;display:block;margin-top:4px}.radio-dot{width:16px;height:16px;border:1px solid #717b74;border-radius:50%;display:grid;place-items:center;flex:none}.option:has(input:checked) .radio-dot{border-color:#c7f36a}.option:has(input:checked) .radio-dot:after{content:"";width:8px;height:8px;border-radius:50%;background:#c7f36a}.export-settings{margin-bottom:23px}.export-settings select{width:100%}.export-button,.secondary-button{width:100%;border-radius:8px;font-weight:750;font-size:.81rem;padding:14px;border:0}.export-button{background:#c7f36a;color:#1c2217;display:flex;justify-content:space-between;align-items:center}.export-button:hover{background:#d5fa8e}.export-button:disabled,.secondary-button:disabled{opacity:.55;cursor:wait}.secondary-button{background:transparent;color:#e5e9e2;border:1px solid #626a64;margin-top:9px}.secondary-button:hover{background:#303633}.status{font-size:.76rem;color:#c7f36a;line-height:1.4;min-height:0;margin-top:12px}.status:empty{display:none}.status.error{color:#ffaaa2}.format-note{display:flex;gap:10px;border-top:1px solid #3c4241;padding-top:19px;margin-top:24px;color:#9fa8a0;font-size:.72rem;line-height:1.48}.note-icon{width:17px;height:17px;flex:none;border:1px solid #9fa8a0;border-radius:50%;display:grid;place-items:center;font-size:.65rem;font-style:italic}@media(max-width:1150px){.workspace{grid-template-columns:minmax(300px,350px) minmax(430px,1fr)}.export-panel{grid-column:1/-1;border-top:1px solid #383c3e;border-left:0}.export-inner{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.export-icon,.export-inner h2,.export-inner>p{grid-column:1}.resolution{grid-column:2;grid-row:1/4}.export-settings,.export-button,.secondary-button,.status,.format-note{grid-column:1/-1}.export-inner>p{margin-bottom:0}.export-icon{margin-bottom:0}.export-inner h2{margin:2px 0}.resolution{margin:0}}@media(max-width:760px){.topbar{height:60px;padding:0 17px}.top-right{font-size:0;gap:0}.top-right .local-dot{width:8px;height:8px}.top-divider{display:none}.workspace{display:flex;flex-direction:column}.preview-area{order:0;padding:18px 15px}.controls{order:1;border-right:0;border-top:1px solid #383c3e}.export-panel{order:2}.stage-wrap{min-height:270px;padding:13px}.stage{height:min(46vh,410px)}.preview-heading{margin-bottom:14px}.preview-heading h1{font-size:1rem}.panel-heading{height:50px}.control-section{padding:20px}.export-inner{display:block}.export-inner>p{margin-bottom:23px}.resolution{margin-bottom:22px}.stage-toolbar{font-size:.65rem;gap:6px}.stage-toolbar span+span:before{margin-right:6px}}.export-settings output{color:#c7f36a;float:right;font-size:.78rem;font-weight:500}.export-settings input[type=range]{accent-color:#c7f36a}[hidden]{display:none!important}.modebar{min-height:56px;display:flex;align-items:stretch;gap:6px;padding:8px 24px;border-bottom:1px solid #34383a;background:#1b1d1f}.mode-button{border:1px solid transparent;border-radius:8px;background:transparent;color:#9fa7a0;padding:9px 16px;font-size:.83rem;font-weight:700}.mode-button:hover{color:#f4f5ed;background:#303633}.mode-button.active{color:#1d2419;background:#c7f36a}.workspace{min-height:calc(100vh - 126px)}.image-upload{display:flex!important;align-items:center;gap:12px;border:1px dashed #75826d;border-radius:9px;background:#293029;padding:16px!important;cursor:pointer;margin:0!important}.image-upload:hover{border-color:#c7f36a;background:#323d2d}.image-upload-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:7px;background:#c7f36a;color:#1b2118;font-size:1.4rem;flex:none}.image-upload strong,.image-upload small{display:block}.image-upload strong{font-size:.84rem}.image-upload small{font-size:.72rem;color:#a9b1a8;margin-top:3px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.box-picker{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 5px}.box-chip,.add-box{border:1px solid #505953;border-radius:8px;background:#292f2c;color:#e4e9df;padding:9px 11px;font-size:.76rem;font-weight:700}.box-chip.active{background:#c7f36a;border-color:#c7f36a;color:#1b2118}.add-box{color:#c7f36a;border-style:dashed}.add-box:hover,.box-chip:hover:not(.active){background:#364138}.drag-hint{margin:8px 0 21px}.static-text-section .two-col output{color:#c7f36a}.remove-box{width:100%;border:1px solid #74615d;border-radius:8px;background:transparent;color:#eab4aa;padding:10px;margin-top:22px;font-size:.75rem;font-weight:700}.remove-box:hover{background:#3a2b29}.stage.static-mode canvas{cursor:grab;touch-action:none}.stage.static-mode canvas.dragging{cursor:grabbing}.stage-empty{position:absolute;left:10%;right:10%;top:50%;transform:translateY(-50%);text-align:center;padding:13px;background:#1b201ddc;color:#eff4e9;border-radius:8px;font-size:.78rem;font-weight:700;pointer-events:none}.static-text-section .group-label{margin:0}.static-image-section .label-row{margin-bottom:10px}.preview-area.static-mode .stage-toolbar span[hidden]:before{content:none}.server-warning{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:13px 24px;background:#f1c86e;color:#241e13;font-size:.8rem;line-height:1.4}.server-warning strong{font-weight:800}.server-warning span{flex:1;min-width:220px}.server-warning a{display:inline-block;border-radius:7px;background:#242821;color:#f8f8ee;padding:9px 12px;text-decoration:none;font-weight:750;white-space:nowrap}.server-warning a:hover{background:#39432f}.font-message{margin:10px 0 0;color:#c7f36a;font-size:.76rem;line-height:1.4}.font-message.error{color:#ffaaa2}.workspace{min-height:calc(100vh - 70px)}.background-image-section .label-row{margin-bottom:10px}.background-image-section .image-upload{position:relative;overflow:hidden}.background-image-section .image-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.remove-image{width:100%;margin-top:9px;border:1px solid #626a64;border-radius:8px;background:transparent;color:#e5e9e2;padding:10px;font-size:.75rem;font-weight:700}.remove-image:hover{background:#303633}.box-heading{align-items:center;margin-bottom:20px}.box-heading strong{font-size:.88rem}.box-heading .add-box{padding:8px 10px}.box-heading .remove-box{width:auto;margin:0;padding:8px 10px}.background-image-section{border-top:1px solid #383c3e}.stage canvas{cursor:grab;touch-action:none}.stage canvas.dragging{cursor:grabbing}.resolution .option input{position:static;width:16px;height:16px;margin:0 0 0 auto;opacity:1;order:2;flex:none;accent-color:#c7f36a;cursor:pointer}.resolution .option>span:first-of-type{flex:1}.resolution .radio-dot{display:none}.resolution-title{display:block;color:#e6e9e3;font-size:.84rem;font-weight:650;margin-bottom:10px}.resolution .option{width:100%;background:transparent;color:#f3f5ed;text-align:left;font:inherit}.resolution .option.active{border-color:#c7f36a;background:#2d3829}.resolution .radio-dot{display:grid}.resolution .option.active .radio-dot{border-color:#c7f36a}.resolution .option.active .radio-dot:after{content:"";width:8px;height:8px;border-radius:50%;background:#c7f36a}.stage{width:100%;height:auto;flex:none}.stage canvas{position:absolute;inset:0;width:100%;height:100%}.background-image-section .video-upload{margin-top:9px!important}.video-upload .image-upload-icon{font-size:1rem}.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}.stage canvas{z-index:1}.stage-tag{z-index:2}.text-blend-section select{display:block;width:100%;background:#171a1b;border:1px solid #444a4b;color:#f3f5ed;border-radius:8px;padding:11px 12px;outline:none}.text-blend-section select:focus{border-color:#c7f36a}.text-blend-section .hint{margin-top:8px}.stage{isolation:isolate}@media(max-width:760px){.modebar{padding:7px 14px}.mode-button{flex:1;padding:9px 7px;font-size:.75rem}}.image-upload{position:relative}.image-upload input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.creator-marquee{height:38px;display:flex;align-items:center;overflow:hidden;background:#c7f36a;color:#1a2018;text-decoration:none;font-size:.76rem;font-weight:650;letter-spacing:.035em;white-space:nowrap}.creator-marquee:hover{background:#d6fa8c}.creator-marquee:focus-visible{outline:3px solid #fff;outline-offset:-3px}.creator-marquee-track{display:flex;width:max-content;animation:creator-scroll 28s linear infinite}.creator-marquee:hover .creator-marquee-track,.creator-marquee:focus-visible .creator-marquee-track{animation-play-state:paused}.creator-marquee-group{display:flex;flex:none}.creator-marquee-group>span{display:inline-block;padding:0 24px}.creator-marquee strong{font-weight:850}.workspace{min-height:calc(100vh - 108px)}@keyframes creator-scroll{to{transform:translate(-50%)}}@media(max-width:760px){.creator-marquee{height:38px;font-size:.72rem}.creator-marquee-group>span{padding:0 18px}.workspace{min-height:calc(100vh - 98px)}}@media(prefers-reduced-motion:reduce){.creator-marquee-track{animation:none}}@media(min-width:761px)and (max-width:900px){.workspace{display:flex;flex-direction:column}.preview-area{order:0;padding:22px 24px}.controls{order:1;border-right:0;border-top:1px solid #383c3e}.export-panel{order:2}.stage-wrap{flex:none;min-height:570px}.controls .control-section{padding-left:max(24px,calc((100% - 680px)/2));padding-right:max(24px,calc((100% - 680px)/2))}.export-inner{max-width:720px;margin:auto}}@media(max-width:760px){.two-col{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.two-col label,.wiggle-section>label{white-space:normal}.two-col output{float:none;display:block;margin-top:3px}.stage-wrap{flex:none}}@media(max-width:380px){.control-section{padding:17px}.preview-area{padding:15px 12px}.stage-toolbar{flex-wrap:wrap;line-height:1.4}.box-heading{gap:8px}.box-heading .add-box,.box-heading .remove-box{font-size:.7rem}}@media(min-width:901px){.preview-area{position:sticky;top:0;align-self:start;height:100vh;min-height:650px}}