:root{font-family:Inter,Segoe UI,Microsoft YaHei,sans-serif;color:#263c35;background:#f5f5ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,a,select,input[type=range]{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #e6ab52;outline-offset:3px}button{color:inherit}a{color:inherit;text-decoration:none}main{max-width:1550px;margin:auto;padding:24px 5%}.workspace{display:grid;grid-template-columns:205px minmax(360px,1fr) 257px;gap:0;border:1px solid #dde3d7;border-radius:17px;background:#fcfdf9;overflow:hidden;box-shadow:0 12px 35px #3c57390a}.library{padding:25px 13px;display:flex;flex-direction:column;border-right:1px solid #e3e7dc;background:#f9fbf5}.panel-label{font-size:12px;font-weight:650;display:flex;justify-content:space-between;align-items:center;margin-bottom:23px;padding:0 10px}.panel-label>span{font-size:9px;color:#99a28e;font-weight:500;letter-spacing:1px}nav{display:flex;flex-direction:column;gap:9px}.project-card{width:100%;border:1px solid transparent;background:transparent;border-radius:12px;display:flex;align-items:center;text-align:left;padding:6px 4px;gap:3px;transition:background .2s}.project-card:hover{background:#eff3e9}.project-card.active{background:#edf2e5;border-color:#d4dfc6}.project-card canvas{width:68px;height:66px;flex-shrink:0;filter:drop-shadow(0 3px 3px #44593c0b)}.project-card strong{font-size:13px;font-weight:600;display:block;margin-bottom:5px}.project-card small{font-size:9px;letter-spacing:.7px;color:#93a08b}.project-card .arrow{margin-left:auto;color:#81916f;padding-right:4px;font-size:17px;opacity:0}.project-card.active .arrow{opacity:1}.library-note{margin-top:auto;display:flex;align-items:center;gap:9px;padding:21px 13px 0;color:#91a084;font-size:11px;line-height:1.8}.library-note>span{font-size:28px;color:#bcbb90}.library-note small{font-size:9px;color:#a5ac99}.preview-panel{min-width:0;padding:24px 24px 19px}.preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.tiny-label{font-size:9px;letter-spacing:1.4px;color:#96a08c}.preview-header h2{font-size:18px;font-weight:600;margin:5px 0 0}.preview-header h2 span{font-size:11px;font-weight:400;color:#8e9a88;margin-left:8px}.preview-tools{display:flex;gap:5px}.icon-button{width:30px;height:30px;border:0;background:transparent;border-radius:6px;font-size:19px;color:#8b9a83;display:grid;place-items:center}.icon-button:hover,.icon-button.selected{background:#ecf0e5;color:#41684c}.stage{height:415px;position:relative;border-radius:11px;overflow:hidden;isolation:isolate;background:#193e37;transition:background .2s}.stage.grid{background-image:linear-gradient(#d4e9b806 1px,transparent 1px),linear-gradient(90deg,#d4e9b806 1px,transparent 1px);background-size:26px 26px}.stage.light{background-color:#e4e5d9}.stage.light.grid{background-image:linear-gradient(#5773470c 1px,transparent 1px),linear-gradient(90deg,#5773470c 1px,transparent 1px)}.stage:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 62%,#b7b87716,transparent 65%);pointer-events:none}.stage canvas{width:100%;height:100%;position:relative;z-index:2;display:block}.stage-label{position:absolute;top:19px;left:21px;font-size:9px;letter-spacing:1.8px;color:#b1cbb65c;z-index:3}.stage-bottom{position:absolute;bottom:17px;left:21px;right:21px;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.1px;color:#abc1ac75;pointer-events:none;z-index:3}.stage-bottom span:last-child{font-size:9px;letter-spacing:.5px}.stage-bottom i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#b0ca92;margin-right:4px;vertical-align:2px}.stage.light .stage-label,.stage.light .stage-bottom{color:#546a5099}.stage-orbit{border:1px solid #c8d3a207;border-radius:50%;position:absolute;pointer-events:none;left:50%;top:51%;transform:translate(-50%,-50%)}.orbit-one{width:290px;height:290px}.orbit-two{width:350px;height:350px}.transport{display:flex;align-items:center;gap:9px;margin-top:15px}.play-button{height:31px;width:33px;border-radius:8px;border:0;color:#fff9e6;background:#38664c;font-size:16px;flex-shrink:0}.time{font-variant-numeric:tabular-nums;font-size:10px;color:#8b9785;white-space:nowrap;min-width:29px}input[type=range]{appearance:none;height:3px;border-radius:4px;background:#dfe6d4;flex:1;min-width:30px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:9px;height:9px;border-radius:50%;background:#6d8b60;border:2px solid #fbfdf5;box-shadow:0 0 0 1px #82966f}.speed-wrap{margin-left:4px;border-left:1px solid #e3e7dc;padding-left:10px}select{background:transparent;border:0;color:#718168;font-size:11px;padding:3px;cursor:pointer}.preview-caption{display:flex;justify-content:space-between;align-items:center;margin-top:17px;color:#8e9a86;font-size:10px;gap:8px}.loop-badge{color:#809171;background:#f0f3e9;padding:5px 8px;border-radius:4px;white-space:nowrap}.inspector{border-left:1px solid #e3e7dc;padding:25px 21px 22px;display:flex;flex-direction:column}.inspector .panel-label{padding:0;margin-bottom:26px}.inspector section{margin-bottom:25px}h3{font-size:11px;font-weight:600;margin:0 0 13px;display:flex;align-items:center;justify-content:space-between}h3 span{font-size:8px;color:#a5ac9b;letter-spacing:1px;font-weight:400}.style-options{display:flex;gap:7px}.style-option{border:1px solid #e1e6d9;background:#f9fbf6;flex:1;min-width:0;border-radius:8px;display:flex;flex-direction:column;align-items:center;padding:10px 0 8px;font-size:10px;color:#859174;gap:8px}.style-option.active{border-color:#8da37a;background:#f0f4e7;color:#435f34;box-shadow:0 0 0 1px #91a57820}.material{width:27px;height:23px;border-radius:7px 7px 4px 4px;box-shadow:inset 0 2px 2px #fff5,0 2px #4c482d30;position:relative;border:2px solid #846347}.material:after{content:"";position:absolute;width:5px;height:8px;border:1px solid #886d41;border-radius:2px;left:9px;top:8px;background:#fff0b7}.material.wood{background:linear-gradient(90deg,#daa66b 0 20%,#af6e3e 20% 80%,#daa66b 80%)}.material.silver{background:linear-gradient(90deg,#dbe8df 0 20%,#87b5bb 20% 80%,#dbe8df 80%);border-color:#6b8690}.material.gold{background:linear-gradient(90deg,#ffe9a3 0 20%,#e6b350 20% 80%,#ffe9a3 80%)}.field-note{font-size:10px;line-height:1.7;color:#a0a893;margin:10px 0 0}.animation-options{display:flex;flex-direction:column;gap:6px}.animation-option{border:1px solid transparent;background:#f5f7ef;text-align:left;padding:10px 11px;border-radius:6px;display:flex;align-items:center;gap:7px;font-size:11px;color:#738369}.animation-option span:last-child{margin-left:auto;font-size:9px;font-variant-numeric:tabular-nums;color:#a2aa98}.animation-option:before{content:"";width:5px;height:5px;border-radius:50%;background:#ccd5c0}.animation-option.active{background:#edf2e3;color:#4d693d;border-color:#d5dfc7}.animation-option.active:before{background:#88a26c}.animation-option:hover{background:#edf1e5}.sequence-section{padding-top:1px}.sequence-button{background:#f9f0db;border:1px solid #e7d7b3;border-radius:6px;color:#a08148;width:100%;padding:10px 12px;text-align:left;font-size:11px;display:flex;justify-content:space-between}.sequence-button:hover{background:#f5e8c9}.event-box{margin-top:auto;padding-top:14px;border-top:1px dashed #dce3d0;display:flex;flex-direction:column;gap:8px}.event-box code{color:#859a70;font-size:10px;min-height:14px;overflow-wrap:anywhere}.event-box>span:last-child{font-size:8px;line-height:1.6;color:#a0aa94}#load-error{position:absolute;inset:0;z-index:5;background:#1b3834ee;color:#fff3ce;padding:60px 30px;line-height:1.8;font-size:14px;white-space:pre-wrap}#load-error[hidden]{display:none}button:disabled{cursor:default;opacity:.6}@media(min-width:1450px){.stage{height:485px}.workspace{grid-template-columns:220px minmax(400px,1fr) 275px}.project-card canvas{width:76px;height:76px}}@media(max-width:1100px){main{padding:20px 3%}.workspace{grid-template-columns:170px minmax(300px,1fr) 224px}.library{padding-left:7px;padding-right:7px}.preview-panel,.inspector{padding-left:16px;padding-right:16px}.project-card canvas{width:55px;height:60px}.stage{height:390px}.preview-caption{font-size:9px}}@media(max-width:850px){.workspace{grid-template-columns:145px minmax(0,1fr)}.inspector{grid-column:1/-1;border-left:0;border-top:1px solid #e3e7dc;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:20px}.inspector .panel-label{display:none}.inspector section{margin-bottom:0}.event-box{grid-column:1/-1;flex-direction:row;align-items:center;margin-top:0}.animation-options{display:flex;flex-wrap:wrap}.animation-option{flex:1 0 40%;padding:9px}.animation-option span:last-child{display:none}.library-note{padding-left:5px}.preview-panel{padding:20px 17px}.project-card{gap:0}.project-card canvas{width:46px;height:55px}.project-card strong{font-size:12px}.project-card small{font-size:8px}.stage{height:390px}}@media(max-width:560px){main{padding:14px}.workspace{display:flex;flex-direction:column}.library{border:0;border-bottom:1px solid #e3e7dc;padding:10px}.library .panel-label,.library-note{display:none}nav{flex-direction:row;gap:5px}.project-card{padding:3px 4px;flex:1;justify-content:center;flex-direction:column;gap:0}.project-card canvas{width:58px;height:44px}.project-card strong{font-size:10px;margin:3px 0 5px}.project-card small,.project-card .arrow{display:none}.preview-panel{padding:18px 12px}.preview-header h2{font-size:16px}.stage{height:340px}.stage-label{font-size:8px}.stage-bottom{left:12px;right:12px;font-size:7px}.stage-bottom span:last-child{font-size:8px}.inspector{display:grid;grid-template-columns:1fr 1fr;padding:20px 14px;gap:20px 14px}.sequence-section{grid-column:1/-1}.sequence-section .field-note{display:none}.event-box{flex-wrap:wrap;gap:6px}.event-box>span:last-child{width:100%}.preview-caption{font-size:9px}.preview-caption>span:first-child{max-width:65%}.transport{gap:6px}.time{font-size:9px}.speed-wrap{padding-left:5px;margin-left:0}}button.loop-badge{border:1px solid #d5dfc7;font:inherit;cursor:pointer}button.loop-badge[aria-pressed=true]{color:#4d693d;background:#edf2e3}button.loop-badge[aria-pressed=false]{color:#8e9a86;background:#f5f7ef}button.loop-badge:hover{border-color:#8da37a}