@charset "UTF-8";
:root{color-scheme:dark;--bg:#101211;--panel:#1c1f1d;--border:#353a34;--muted:#9da49c;--text:#eef1e9;--lime:#d4f6a2;--soft:#a4bf83;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:var(--bg);color:var(--text);font-size:13px}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--lime);outline-offset:4px}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit;text-decoration:none}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.sprite{position:absolute;width:0;height:0;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap;border:0}
.topbar{height:72px;position:fixed;inset:0 0 auto;display:flex;align-items:center;gap:26px;padding:0 28px;z-index:20;background:#131614f5;border-bottom:1px solid #252a25}.brand{display:flex;align-items:center;gap:10px}.brand-icon{display:grid;place-items:center;background:var(--lime);color:#263322;border-radius:11px;width:36px;height:36px}.brand-icon svg{width:25px;height:25px;stroke-width:1.8}.brand strong{font-size:20px;letter-spacing:1px}.brand strong span{display:block;font-size:8px;font-weight:600;letter-spacing:3px;margin-top:1px;color:#98a092}.nav-divider{height:23px;width:1px;background:#3a3e35}.project-name{font-size:13px;color:#c5cbc2;display:flex;gap:12px;align-items:center}.beta{font-size:9px;letter-spacing:.8px;color:#8d9881;border:1px solid #343e2e;border-radius:4px;padding:3px 5px}.top-actions{margin-left:auto;display:flex;gap:24px;align-items:center}.save-indicator{font-size:11px;color:#73806d}.connection{display:flex;align-items:center;gap:9px;border:1px solid #3d4637;border-radius:8px;padding:9px 12px;font-size:12px;background:#21261e}.connection svg{width:14px;height:14px;color:#929e88}.status-dot{width:6px;height:6px;border-radius:50%;background:#828b77}.connected .status-dot{background:var(--lime);box-shadow:0 0 8px #d4f6a233}.connected{color:#c8d5bc}
#viewport{position:fixed;inset:72px 0 0;overflow:hidden;background-color:var(--bg);background-image:radial-gradient(#374034 1px,transparent 1px);background-size:24px 24px;touch-action:none;cursor:grab;outline:none}#viewport.panning{cursor:grabbing}#world{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}#connections{position:absolute;inset:0;overflow:visible;width:1px;height:1px;pointer-events:none}#connections path{stroke:#586849;stroke-width:1.5;fill:none;stroke-dasharray:5 5}#connections circle{fill:#8a9f74;stroke:#101211;stroke-width:3}.canvas-intro{position:absolute;top:38px;left:0;right:0;text-align:center;pointer-events:none;transition:opacity .2s}.canvas-intro.hidden{opacity:0}.eyebrow{font-size:9px;letter-spacing:2.6px;color:#819073;display:flex;align-items:center;justify-content:center;gap:8px}.eyebrow span{width:5px;height:5px;border-radius:50%;background:#c7e99e}.canvas-intro h1{font-size:31px;font-weight:500;letter-spacing:2px;margin:13px 0 10px}.canvas-intro p{font-size:12px;color:#899284;margin:0}.canvas-meta{position:fixed;top:91px;left:29px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.canvas-label{font-size:9px;color:#79866e;letter-spacing:1.8px}#task-count{color:#697464;font-size:10px}.tool-dock{position:fixed;left:22px;top:42%;z-index:15;display:flex;flex-direction:column;gap:4px;background:#1c211bf2;border:1px solid #353f30;padding:6px;border-radius:12px;box-shadow:0 12px 30px #0003}.tool-dock i{height:1px;background:#333c2e;margin:5px}.icon-button{display:grid;place-items:center;width:36px;height:36px;border-radius:7px;color:#94a18a}.icon-button:hover{background:#343c2e;color:var(--text)}.icon-button.active{background:#36442c;color:#d4f6a2}.icon-button svg{width:18px;height:18px}.bottom-tools{position:fixed;right:25px;bottom:25px;z-index:15;background:#1c211bf2;border:1px solid #353f30;border-radius:9px;display:flex;align-items:center;padding:4px;box-shadow:0 6px 20px #0002}.bottom-tools button{height:30px;min-width:30px;padding:0 9px;display:grid;place-items:center;color:#becab4;border-radius:5px}.bottom-tools button:hover{background:#303a29}.bottom-tools button svg{width:15px;height:15px}.bottom-tools span{height:17px;width:1px;background:#3b4632;margin:0 3px}#zoom-reset{font-size:11px;min-width:49px}.canvas-tip{position:fixed;left:26px;bottom:29px;color:#617159;font-size:10px;pointer-events:none}
.composer{position:fixed;z-index:25;bottom:27px;left:50%;transform:translateX(-50%);width:700px;padding:15px 18px 14px;background:#20261ff5;backdrop-filter:blur(20px);border:1px solid #46513b;border-radius:17px;box-shadow:0 18px 70px #0008,0 0 0 5px #151a1344}.composer-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px}.mode-tabs{display:flex;gap:5px}.mode{display:flex;align-items:center;gap:7px;font-size:12px;border-radius:7px;color:#98a58f;padding:8px 11px;transition:.15s}.mode svg{width:15px;height:15px}.mode span{font-size:9px;color:#7b886e;background:#2c3327;padding:2px 4px;border-radius:3px}.mode.active{color:#e7f8d5;background:#39452f}.mode.active span{color:#c5d8b3;background:#4b5b3e}.mode:hover{color:var(--lime)}.mode-hint{font-size:11px;color:#849078}.input-row{display:flex;gap:16px;align-items:stretch}.reference-slots{display:flex;gap:8px;flex-shrink:0}.upload-slot{position:relative;width:72px;height:83px;border:1px dashed #5b694e;background:#283023;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#9eae8d;cursor:pointer}.upload-slot:hover{border-color:var(--lime);color:var(--lime)}.upload-slot svg{width:20px;height:20px}.upload-slot small{font-size:9px;color:#7d8b6f}.upload-slot.second{border-color:#3a4531;color:#657459;background:#252c20}.upload-slot img{width:100%;height:100%;object-fit:cover;border-radius:8px}.upload-slot .remove-ref{position:absolute;right:-5px;top:-5px;border:1px solid #687759;background:#232d1e;color:#e5efda;width:20px;height:20px;border-radius:50%;display:grid;place-items:center}.remove-ref svg{width:11px;height:11px}.ref-order{position:absolute;left:5px;bottom:5px;border-radius:4px;background:#131a12bb;padding:2px 4px;font-size:9px;color:#d6e6c9;pointer-events:none}.prompt-wrap{flex:1;min-width:0}textarea{display:block;resize:none;width:100%;height:86px;border:0;background:none;color:#ecf2e5;line-height:1.85;font-size:13px;outline:none!important;padding:1px 0}textarea::placeholder{color:#7e8a73}.composer-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:14px;gap:12px}.estimate{display:flex;align-items:center;gap:6px;font-size:10px;color:#a7b19d}.estimate svg{width:12px;height:12px;color:#95a686}.estimate-note{color:#67765c}.generate-button{border-radius:9px;background:var(--lime);color:#28341f;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 17px;font-size:12px;font-weight:600;box-shadow:0 2px 0 #0002;transition:.2s}.generate-button:hover{background:#e2ffb9;transform:translateY(-1px);box-shadow:0 4px 18px #ccff9919}.generate-button svg{width:16px;height:16px}.generate-button kbd{font-size:13px;font-weight:400;margin-left:15px;opacity:.6}kbd{font-family:inherit;font-size:11px;background:#36402d;padding:2px 5px;border-radius:4px;color:#b6c9a4}.generate-button kbd{padding:0;background:transparent;color:#28341f}
.card{position:absolute;background:#1c211b;border:1px solid #46503d;border-radius:13px;box-shadow:0 12px 35px #0004;overflow:hidden;transition:box-shadow .2s;user-select:none}.card:hover{border-color:#72825f;box-shadow:0 14px 40px #0006}.card.selected{border-color:#cce6ae;box-shadow:0 0 0 2px #d4f6a21c,0 14px 40px #0006}.card-head{height:42px;padding:0 13px;display:flex;align-items:center;gap:8px;cursor:move;touch-action:none}.card-head svg{height:14px;width:14px;color:#9cae8e}.card-title{font-size:11px;color:#d0dcc6;flex:1}.card-tag{font-size:9px;border:1px solid #4a543f;border-radius:4px;padding:2px 5px;color:#9caa8b}.card-actions{display:flex;gap:2px}.card-actions button{width:25px;height:25px;display:grid;place-items:center;border-radius:5px;color:#889c7d}.card-actions button:hover{color:var(--lime);background:#343f2c}.card-actions button svg{width:13px;height:13px}.card-media{position:relative;display:block;width:100%;background:#161d15;overflow:hidden;cursor:zoom-in}.card-media img,.card-media video{width:100%;height:100%;object-fit:contain;display:block}.demo-card .card-media img,.demo-card .card-media video{object-fit:cover}.play-overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border:1px solid #ffffff44;border-radius:50%;background:#18201a77;backdrop-filter:blur(8px);display:grid;place-items:center;pointer-events:none}.play-overlay:before{content:"";border-left:10px solid #e4ecd9;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}.demo-video-tag{position:absolute;bottom:12px;right:12px;background:#12200fcc;backdrop-filter:blur(5px);font-size:9px;padding:4px 7px;border-radius:4px;color:#c4dcb4}.card-footer{padding:11px 13px 12px;font-size:10px;color:#9daa92;line-height:1.6}.card-footer .prompt-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#9daa92;margin:0 0 8px;max-width:100%}.card-footer .action-line{display:flex;align-items:center;gap:7px}.card-footer .action-line button{font-size:10px;color:#c6d8b5;display:flex;align-items:center;gap:4px;background:#303d27;border:1px solid #46563a;border-radius:5px;padding:5px 8px}.card-footer .action-line button:hover{background:#435334}.card-footer .action-line svg{width:12px;height:12px}.card-footer time{margin-left:auto;font-size:9px;color:#687c5d}.demo-note{color:#7f9470;font-size:9px}.demo-link{background:none!important;border:0!important;color:#c9e6ae!important;padding:0!important}.reference-card .card-footer{padding:9px 12px}.reference-card .card-media{cursor:zoom-in}.node-number{position:absolute;bottom:9px;left:10px;color:#f0f3e9;background:#17210f99;padding:3px 6px;border-radius:5px;font-size:10px}.delete-task{margin-left:auto;color:#738766!important;background:none!important;border-color:transparent!important}.delete-task:hover{color:#eaa693!important}.result-card.pending{border-color:#63794a}.result-card.pending .card-head{background:#252f20}.waiting{height:244px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at center,#34462755,transparent 68%);padding:18px}.waiting h3{font-size:16px;font-weight:500;margin:3px 0 8px;letter-spacing:.5px}.waiting p{font-size:11px;color:#a2b193;margin:0;text-align:center;line-height:1.7}.waiting small{font-size:10px;color:#6f825f;margin-top:9px}/* A small puppy keeps the waiting card company. */
.puppy-scene{width:142px;height:92px;margin:0 0 4px;flex-shrink:0}
.puppy-run{display:block;width:142px;height:92px;fill:none;stroke:none;overflow:visible}
.puppy-bounce{animation:puppy-bounce .48s ease-in-out infinite}
.puppy-head{transform-origin:105px 53px;animation:puppy-nod .48s ease-in-out infinite}
.puppy-tail{transform-origin:44px 53px;animation:puppy-wag .24s ease-in-out infinite alternate}
.puppy-ear{transform-origin:99px 27px;animation:puppy-ear .48s ease-in-out infinite}
.puppy-leg{animation:puppy-stride .48s ease-in-out infinite alternate}
.puppy-leg.rear{transform-origin:52px 67px}.puppy-leg.front{transform-origin:96px 65px}
.puppy-leg.near.front,.puppy-leg.back.rear{animation-delay:-.48s}
.puppy-tongue{transform-origin:137px 57px;animation:puppy-tongue .48s ease-in-out infinite}
.puppy-shadow{transform-origin:83px 91px;animation:puppy-shadow .48s ease-in-out infinite}
.puppy-trail{animation:puppy-trail .72s linear infinite}.trail-two{animation-delay:-.24s}.trail-three{animation-delay:-.48s}
@keyframes puppy-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes puppy-nod{0%,100%{transform:rotate(0)}50%{transform:rotate(-4deg)}}
@keyframes puppy-wag{from{transform:rotate(-17deg)}to{transform:rotate(16deg)}}
@keyframes puppy-ear{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(12deg)}}
@keyframes puppy-stride{from{transform:rotate(-24deg)}to{transform:rotate(25deg)}}
@keyframes puppy-tongue{50%{transform:rotate(8deg)}}
@keyframes puppy-shadow{50%{transform:scaleX(.85);opacity:.12}}
@keyframes puppy-trail{from{transform:translateX(5px);opacity:.65}to{transform:translateX(-10px);opacity:0}}
.waiting .indeterminate{width:128px;height:3px;overflow:hidden;background:#34442b;border-radius:3px;margin-top:19px}.indeterminate:after{content:"";display:block;width:40%;height:100%;background:var(--lime);border-radius:3px;animation:loading 1.5s ease-in-out infinite}.job-steps{display:flex;justify-content:center;align-items:center;gap:9px;font-size:9px;color:#75896a;margin:9px 0 0}.job-steps i{width:18px;height:1px;background:#475e36}.job-steps .current{color:#cee9b4}.error-state{padding:30px 20px;min-height:218px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.error-state .error-icon{font-size:26px;color:#e2aa89;margin-bottom:10px}.error-state h3{font-size:14px;font-weight:500;margin:4px 0 9px}.error-state p{font-size:11px;color:#a39482;line-height:1.8;max-width:290px}.error-state button{margin-top:9px;border:1px solid #676343;border-radius:6px;padding:7px 12px;color:#d3d2b5;font-size:11px}
@keyframes loading{from{transform:translateX(-130%)}to{transform:translateX(350%)}}
#drop-overlay{display:none;position:absolute;inset:15px;border:2px dashed #b8d898;border-radius:20px;background:#1b291de6;z-index:35;flex-direction:column;align-items:center;justify-content:center;gap:15px;pointer-events:none;color:#d8efc1}#drop-overlay svg{width:48px;height:48px}#drop-overlay strong{font-size:23px;font-weight:500}#drop-overlay span{color:#99b084}body.drag-files #drop-overlay{display:flex}
dialog{border:1px solid #4c5b3f;background:#20291e;color:#e4ecd9;border-radius:18px;padding:32px;box-shadow:0 35px 100px #0009;max-width:calc(100vw - 32px)}dialog::backdrop{background:#080d09b8;backdrop-filter:blur(8px)}.dialog-close{position:absolute;top:10px;right:10px}.access-dialog{width:400px}.dialog-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#35472a;color:var(--lime);margin-bottom:20px}.access-dialog h2,.help-dialog h2{font-size:22px;font-weight:500;margin:0 0 12px}.access-dialog p{font-size:12px;line-height:1.9;color:#99aa8a}.access-dialog label{display:block;font-size:11px;color:#c2d4ae;margin:20px 0 8px}.access-dialog input{width:100%;background:#151e12;border:1px solid #495a3b;border-radius:8px;color:#ebf4e1;padding:13px}.access-dialog .generate-button{width:100%;margin-top:12px}.access-dialog small{display:block;font-size:10px;color:#728467;line-height:1.7;text-align:center;margin-top:17px}.access-dialog .form-error{color:#eab591;min-height:18px;margin:5px 0;font-size:11px}.preview-dialog{padding:38px 18px 15px;max-width:94vw;width:fit-content;max-height:94vh;background:#141b13}.preview-dialog img,.preview-dialog video{display:block;max-width:88vw;max-height:78vh;border-radius:8px}.preview-dialog p{font-size:11px;line-height:1.7;color:#a8b79b;max-width:800px;margin:12px auto 3px}.help-dialog{width:480px}.help-dialog>p{font-size:12px;line-height:1.9;color:#b4c1a7}.help-note{background:#2e3b26;border:1px solid #465939;border-radius:10px;padding:13px;font-size:11px;color:#a7bf92;line-height:1.9;margin:20px 0}.help-dialog small{font-size:10px;color:#809471;line-height:1.8}.keyboard-help{font-size:10px!important}#toast{position:fixed;z-index:100;left:50%;top:89px;transform:translate(-50%,-12px);opacity:0;pointer-events:none;background:#d7edc3;color:#2f4226;font-size:12px;padding:12px 20px;border:1px solid #e3f2d5;border-radius:10px;box-shadow:0 5px 30px #0004;transition:.2s;max-width:calc(100vw - 30px);line-height:1.6}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1600px){.composer{width:760px;bottom:34px;padding:18px 21px}.canvas-intro{top:53px}.canvas-intro h1{font-size:36px}.topbar{height:78px}#viewport{top:78px}.composer .input-row{gap:20px}}
@media(max-width:1050px){.canvas-tip{display:none}.bottom-tools{bottom:262px;right:20px}.save-indicator{display:none}.composer{width:min(700px,calc(100vw - 130px));bottom:20px}.canvas-intro h1{font-size:27px}}
@media(max-width:650px){.topbar{height:61px;padding:0 16px;gap:15px}.brand-icon{width:31px;height:31px;border-radius:9px}.brand strong{font-size:17px}.brand strong span{font-size:6px}.nav-divider,.project-name,.connection svg{display:none}.connection{font-size:10px;padding:8px 10px}.top-actions{gap:0}#viewport{top:61px}.canvas-intro{top:29px;padding:0 20px}.canvas-intro .eyebrow{font-size:7px;letter-spacing:1.4px}.canvas-intro h1{font-size:25px;margin-top:13px}.canvas-intro p{font-size:10px;line-height:1.8}.canvas-meta{display:none}.tool-dock{left:10px;top:40%;padding:4px}.icon-button{width:30px;height:32px}.composer{width:calc(100vw - 24px);padding:12px;bottom:15px;border-radius:14px}.composer-top{gap:4px;margin-bottom:13px}.mode-hint{font-size:9px}.mode{padding:7px 8px;font-size:11px;gap:5px}.mode svg{width:13px;height:13px}.mode span{font-size:8px}.input-row{gap:10px}.reference-slots{gap:5px}.upload-slot{width:51px;height:71px;border-radius:7px}.upload-slot svg{width:17px;height:17px}.upload-slot small{font-size:8px}textarea{height:78px;font-size:12px;line-height:1.8}.composer-bottom{margin-top:11px;gap:5px}.estimate{font-size:9px;gap:4px}.estimate-note{display:none}.generate-button{font-size:11px;padding:10px 12px}.generate-button kbd{display:none}.bottom-tools{bottom:247px;right:12px}.bottom-tools button{height:27px;min-width:25px;padding:0 6px}.bottom-tools #zoom-reset{min-width:42px;font-size:10px}.access-dialog{padding:27px 22px}.help-dialog{padding:28px 22px}.preview-dialog{padding:36px 10px 12px}.card{border-radius:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.reference-card .card-footer{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-tag,.card-actions{flex-shrink:0}.card-actions .delete-asset{width:auto;min-height:28px;display:flex;gap:4px;padding:0 7px;border:1px solid #74544a;color:#e4b6a6;background:#382b26;font-size:10px}.card-actions .delete-asset svg{color:inherit;width:12px;height:12px}.card-actions .delete-asset:hover:not(:disabled){color:#ffe0d3;background:#57392e;border-color:#a97764}.card-actions .delete-asset:disabled{opacity:.4}
#toast{display:flex;align-items:center;gap:16px}#toast-undo{pointer-events:auto;padding:3px 2px;color:#263c1d;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}#toast-undo[hidden]{display:none}
.indeterminate.determinate:after{animation:none;transform:none;width:var(--received,0%);transition:width .2s}