:root{--bg:#080b0d;--panel:#101518;--panel2:#141c20;--line:#2a373c;--text:#dce4e3;--muted:#71858a;--a:#52d7d0;--b:#ffb64d;--violet:#ad8cff}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font:12px/1.25 Inter,Segoe UI,sans-serif;letter-spacing:.045em}button,select,input{font:inherit;color:inherit}button,select,input[type=number]{background:#0c1215;border:1px solid var(--line);padding:7px}button{cursor:pointer;letter-spacing:.07em}button:hover,button.active{border-color:var(--a);color:var(--a)}header{height:64px;display:flex;align-items:center;gap:14px;padding:0 16px;background:#0b1012;border-bottom:1px solid var(--line)}.brand{min-width:330px;display:flex;align-items:center;gap:12px}.brand>span{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--a);font-size:26px;color:var(--a)}.brand b{display:block;font-size:17px;letter-spacing:.23em}.brand small{display:block;margin-top:3px;color:var(--muted);font-size:8px;letter-spacing:.23em}.mode{display:flex}.mode button{min-width:92px}.mode .active{background:#153033}.mutator{display:flex;height:36px;margin-left:auto;border:1px solid #4b3d25}.mutator>*{border:0;border-right:1px solid #4b3d25}.mutator button{color:#17100a;background:linear-gradient(100deg,#ffb64d,#ef7f66);font-weight:900}.mutator label{display:flex;align-items:center;padding:0 7px;color:var(--muted);font-size:8px}.mutator #seed{width:70px}header nav{display:flex;gap:5px}main{height:calc(100vh - 64px);display:grid;grid-template-columns:278px minmax(500px,1fr) 310px}.panel{background:var(--panel);overflow:auto}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line)}section{padding:14px;border-bottom:1px solid var(--line)}h2,h3{margin:0 0 11px;font-size:10px;letter-spacing:.16em}h2 i{font-style:normal;color:var(--a);margin-right:7px}h2 button{float:right;padding:2px 7px}h3{color:#aebdbe}h3 em{float:right;font:normal 7px inherit;color:#526469}.layer-card{display:grid;grid-template-columns:26px 1fr 28px 28px;align-items:center;margin:5px 0;border:1px solid var(--line);background:#0b1114}.layer-card.selected{border-color:var(--a);box-shadow:inset 2px 0 var(--a)}.layer-card .badge{color:var(--b);text-align:center}.layer-card button{border:0;padding:9px 5px;text-align:left}.layer-card small{display:block;color:var(--muted);font-size:7px}.layer-actions,.inline{display:flex;gap:5px;margin-top:7px}.layer-actions button{flex:1;font-size:8px}.left select,.right>section>select{width:100%}.control{margin:8px 0}.control-head{display:flex;justify-content:space-between;margin-bottom:4px;font-size:8px;color:#9baaad}.control-head output{color:var(--a);font-variant-numeric:tabular-nums}.control-body{display:grid;grid-template-columns:1fr 72px;gap:6px}.control input[type=range]{width:100%;accent-color:var(--a)}.control input[type=number]{width:72px;text-align:right;padding:4px;font-variant-numeric:tabular-nums}.hint{margin:14px;border-left:2px solid var(--b);background:#0a1012}.hint b,.hint span{display:block}.hint b{color:var(--b);margin-bottom:5px}.hint span{color:var(--muted);font-size:8px;line-height:1.75}.stage{padding:0;min-width:0;display:flex;flex-direction:column}.tabs{height:42px;display:flex;align-items:center;border-bottom:1px solid var(--line);background:#0c1215;padding:0 10px}.tabs button{height:42px;border:0;background:transparent}.tabs button.active{border-bottom:2px solid var(--a)}.tabs span{flex:1}.tabs label{font-size:8px;color:var(--muted)}#workspace{flex:1;min-height:0;display:grid;background:#242d30;gap:1px}#workspace.split{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}#workspace.split #mainPane{grid-column:1/3}#workspace:not(.split) #splitA,#workspace:not(.split) #splitB{display:none}figure{position:relative;margin:0;min-height:0;overflow:hidden;background:#020304}canvas{display:block;width:100%;height:100%;touch-action:none}figcaption{position:absolute;top:0;left:0;right:0;padding:9px 11px;background:linear-gradient(#071013dd,transparent);font-size:8px;pointer-events:none}figcaption span{float:right;color:var(--a)}#overlay{position:absolute;inset:0;pointer-events:none}.cross{position:absolute;left:50%;top:50%;width:28px;height:28px;transform:translate(-50%,-50%);border:1px solid var(--a);border-radius:50%}.cross:before,.cross:after{content:"";position:absolute;background:var(--a)}.cross:before{left:13px;top:-7px;width:1px;height:40px}.cross:after{top:13px;left:-7px;height:1px;width:40px}.rotate-handle{position:absolute;left:calc(50% + 82px);top:50%;width:12px;height:12px;border:2px solid var(--b);border-radius:50%;transform:translate(-50%,-50%)}footer{height:40px;display:flex;align-items:center;gap:8px;padding:0 10px;background:#0c1215;border-top:1px solid var(--line);font-size:8px;color:var(--muted)}footer #status{flex:1}.live{width:7px;height:7px;background:var(--a);border-radius:50%;box-shadow:0 0 8px var(--a)}footer label{display:flex;align-items:center;gap:5px}footer input{width:90px}.lock,.toggle{display:block;padding:9px;background:#0a1012;color:var(--b);font-size:9px}.inspector-row{display:grid;grid-template-columns:22px 1fr 1fr;gap:5px;padding:5px 0;border-bottom:1px dotted #29363a;font-variant-numeric:tabular-nums}.inspector-row b{color:var(--a)}.inspector-row:nth-child(2) b{color:var(--b)}.delta{color:var(--b)}.inline{align-items:center}.inline>*{min-width:0}.inline label{flex:1;font-size:8px}.inline input,.inline select{max-width:100%}.export{display:grid;grid-template-columns:1fr 10px 1fr 63px;gap:5px;align-items:center;margin-top:8px}.export input{width:100%}.export button{grid-column:1/5}.primary{background:var(--a);color:#061011;border-color:var(--a);font-weight:900}#toast{position:fixed;z-index:10;left:50%;bottom:54px;transform:translate(-50%,15px);padding:10px 16px;background:#132126;border:1px solid var(--a);opacity:0;transition:.2s;pointer-events:none}#toast.show{opacity:1;transform:translate(-50%)}@media(max-width:1320px){main{grid-template-columns:240px minmax(440px,1fr) 270px}.brand{min-width:280px}.mutator #seed,.mutator label{display:none}}.stage{min-height:0}.stage>.tabs,.stage>footer{flex-shrink:0}#workspace{grid-template-rows:minmax(0,1fr);align-items:center;justify-items:center;overflow:hidden}#workspace.split{grid-template-rows:repeat(2,minmax(0,1fr))}.video-export{margin-top:14px;padding:12px;border:1px solid #76592b;background:linear-gradient(145deg,#15130e,#0b0e0f);box-shadow:inset 3px 0 #b88a3c}.recorder-heading{display:flex;align-items:center;gap:8px;margin-bottom:9px}.recorder-heading h3{margin:0}.recorder-heading small{margin-top:2px}.rec-dot{width:9px;height:9px;border-radius:50%;background:#ff625a;box-shadow:0 0 0 3px #401c19,0 0 10px #ff625a}.video-export h3{color:var(--b)}.video-settings{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-top:7px}.video-settings label{font-size:7px;color:var(--muted)}.video-settings input,.video-settings select{display:block;width:100%;margin-top:4px;height:31px}.video-button{width:100%;margin-top:8px;background:#211b10;border-color:#76592b;color:var(--b);font-weight:800}.video-button.recording{background:#7a211d;border-color:#ff6b62;color:#fff;box-shadow:0 0 0 1px #ff6b62,0 0 14px #7a211d}.video-export:has(.video-button.recording){border-color:#ff6b62;box-shadow:inset 3px 0 #ff625a}.video-export:has(.video-button.recording) .rec-dot{animation:rec-pulse 1s steps(2,end) infinite}@keyframes rec-pulse{50%{opacity:.25}}.video-progress{height:3px;background:#06090a;margin-top:7px;overflow:hidden}.video-progress i{display:block;width:0;height:100%;background:var(--b)}.video-export small{display:block;margin-top:6px;color:var(--muted);font-size:7px}.generator-handle,.warp-handle{position:absolute;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:7px;font-weight:900;background:#071012;pointer-events:none}.generator-handle{border:2px solid var(--b);color:var(--b)}.warp-handle{border:2px solid var(--violet);color:var(--violet)}#performanceRecord.recording{background:#421a18;border-color:#ff6b62;color:#ffaaa4}.layer-card[draggable=true]{cursor:grab}.layer-card[draggable=true]:active{cursor:grabbing}.record-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:5px}.record-actions button{font-size:8px}.record-actions button:disabled{opacity:.35;cursor:default}