:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:#263b33;background:#f6f7f3;font-synthesis:none;font-weight:400;font-size:14px;font-optical-sizing:auto}*{box-sizing:border-box}body{margin:0}button,input,select,a{-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button,a,input,select{outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}.header{height:89px;border-bottom:1px solid #dfe4dc;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#fbfcf8}.brand{display:flex;align-items:center;gap:10px;font-size:29px;font-weight:650;letter-spacing:-1.5px}.brand-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#1d6148;color:#fff}.brand-divider{height:22px;width:1px;background:#d9dfd7;margin:0 12px}.brand-cn{font-size:12px;font-weight:400;letter-spacing:1px;color:#78847a}.help-link{border:0;background:none;font-size:12px;display:flex;gap:9px;align-items:center;color:#56675c}main{max-width:1272px;margin:auto;padding:0 40px}.intro{padding:53px 0 36px}.intro-kicker{display:flex;gap:9px;align-items:center;font-size:11px;letter-spacing:1.3px;color:#69776c}.intro-kicker>span{width:6px;height:6px;border-radius:50%;background:#48866b}h1{font-size:46px;font-weight:550;letter-spacing:-1.5px;margin:18px 0 16px;line-height:1.25}h1 span{color:#287355}.intro p{margin:0;color:#788178;font-size:13px;line-height:1.9}.mobile-break{display:none}.workspace{display:grid;grid-template-columns:312px minmax(0,1fr);border:1px solid #d9e0d6;border-radius:13px;background:#fff;box-shadow:0 6px 30px #203c2b04;overflow:hidden}.sidebar{padding:25px 23px;border-right:1px solid #e4e8df}.panel-title{display:flex;align-items:center;gap:9px;margin-bottom:20px}.panel-title h2{font-size:14px;font-weight:600;margin:0}.step-number{font-size:10px;background:#eef3e9;color:#63855c;border-radius:5px;width:23px;height:23px;display:grid;place-items:center;font-variant-numeric:tabular-nums}.subtle{font-size:10px;color:#939d91;margin-left:auto}.upload-zone{width:100%;min-height:189px;border:1px dashed #b9ccba;background:#f8faf6;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:background .2s,gap .2s;gap:10px}.upload-zone:hover,.upload-zone.dragging{background:#eef5e9;border-color:#287355}.upload-icon{display:grid;place-items:center;width:46px;height:46px;background:#eaf0e3;border-radius:12px;color:#54805c;margin-bottom:5px}.upload-zone strong{font-size:12px;font-weight:500}.upload-zone>span:not(.upload-icon){font-size:10px;color:#8a9787;letter-spacing:.6px}.upload-zone small{font-size:10px;color:#8a9787}.demo-button{background:transparent;border:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#65825b;width:100%;padding:15px 0 6px}.demo-button svg:last-child{margin-left:4px}.second{border-top:1px solid #e9ece5;padding-top:23px;margin-top:22px;margin-bottom:19px}.second>svg{margin-left:auto;color:#8b9786}.field-label{display:block;font-size:11px;color:#667561;margin-bottom:8px}.title-input{width:100%;border:1px solid #dfe4da;border-radius:6px;padding:10px 11px;font-size:12px;background:#fff;color:#334d3b}.title-input:disabled{background:#fafbf8;color:#7f8a78}.theme-label{margin-top:19px}.theme-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.theme-option{padding:5px;border:1px solid #e1e6db;background:#fff;border-radius:6px}.theme-option.chosen{border-color:#528562;box-shadow:0 0 0 1px #528562}.mini-score{height:55px;background:repeating-linear-gradient(transparent,transparent 8px,#496c3726 8px,#496c3726 9px,transparent 9px,transparent 12px);display:flex;align-items:center;justify-content:center;font-size:25px;color:#44633a;border-radius:3px;background-color:#f6f8ef}.theme-option>span:last-child{display:flex;align-items:center;justify-content:space-between;font-size:10px;padding:8px 3px 3px}.night .mini-score{background:repeating-linear-gradient(transparent,transparent 8px,#ecffe130 8px,#ecffe130 9px,transparent 9px,transparent 12px);background-color:#203b2c;color:#d0e8c0}.switch-row{display:flex;align-items:center;gap:8px;margin:23px 0;font-size:11px}.switch-row small{color:#a3ab9a;font-size:10px;margin-left:5px}.switch-row input{position:absolute;opacity:0;width:30px;right:0}.switch{margin-left:auto;border-radius:12px;background:#d8dfd1;width:30px;height:17px;position:relative;pointer-events:none}.switch:before{content:"";position:absolute;width:13px;height:13px;border-radius:50%;background:#fff;top:2px;left:2px;transition:transform .15s}.switch-row{position:relative}.switch-row input:checked+.switch{background:#377b52}.switch-row input:checked+.switch:before{transform:translate(13px)}.switch-row input:focus-visible+.switch{outline:2px solid #286544;outline-offset:4px}.offset-label{display:flex;justify-content:space-between;font-size:11px;color:#6b7865}.offset-label output{font-size:10px;font-variant-numeric:tabular-nums}input[type=range]{width:100%;height:3px;accent-color:#417a52;margin:16px 0}.range-labels{display:flex;justify-content:space-between;font-size:9px;color:#a1ab97}.notice{display:flex;gap:8px;margin-top:25px;color:#929d87}.notice svg{flex-shrink:0;margin-top:2px}.notice p{margin:0;font-size:10px;line-height:1.8}.studio{padding:0 27px}.studio-bar{height:65px;display:flex;align-items:center;justify-content:space-between;font-size:12px}.studio-bar>div{display:flex;align-items:center;gap:7px}.preview-dot{width:5px;height:5px;border-radius:50%;background:#4e8661}.preview-tag{background:#f0f3eb;color:#88927e;font-size:9px;padding:4px 7px;border-radius:4px;margin-left:7px}.format-label{font-size:10px;color:#8c9786}.format-label>span{margin:0 6px}.player-wrap{border-radius:7px;overflow:hidden;background:#213227;line-height:0;border:1px solid #dce1d4}.track{display:flex;align-items:center;gap:13px;height:64px;border-bottom:1px solid #e9ece3}.track-icon{color:#78966a;display:grid;place-items:center;width:27px;height:27px;background:#f0f4eb;border-radius:5px}.wave-track{position:relative;flex:1;height:30px;display:flex;align-items:center;background:linear-gradient(transparent 49%,#e1e8d8 50%,transparent 51%)}.wave-track i{position:absolute;top:50%;transform:translateY(-50%);background:#d5e0c8;min-width:2px;max-height:30px;border-radius:2px;transition:background .2s}.wave-track i.passed{background:#7b9c63}.track-cursor{position:absolute;top:0;height:100%;border-left:1px solid #417a52}.track-duration{font-size:9px;font-variant-numeric:tabular-nums;color:#8c9685}.preview-caption{display:flex;justify-content:space-between;font-size:9px;color:#99a28d;padding:16px 0}.preview-caption>span:first-child{display:flex;align-items:center;gap:7px}.caption-divider{width:1px;height:11px;background:#e2e6da;margin:0 3px}.export-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e8ecdf;padding:22px 0}.export-row h3{font-size:13px;font-weight:500;margin:0 0 8px}.export-row p{font-size:10px;margin:0;color:#99a08e;line-height:1.7}.primary{background:#215c40;border:1px solid #215c40;color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 17px;border-radius:6px;font-size:12px;white-space:nowrap;transition:background .2s}.primary:hover:not(:disabled){background:#164b32}.primary:disabled{background:#dfe5d8;border-color:#dfe5d8;color:#84937b;opacity:1}.edit-actions{display:flex;gap:20px;flex-wrap:wrap;padding:0 0 22px}.edit-actions button{border:0;background:none;color:#64825a;font-size:10px;display:flex;align-items:center;gap:6px;padding:0}.job-status{background:#f0f6ec;padding:13px 12px;border-radius:6px;margin-top:14px}.job-status>div{display:flex;gap:7px;align-items:center;color:#466e41}.job-status strong{font-size:10px;font-weight:500}.job-status small{font-size:9px;color:#85967b;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-top:9px}progress{width:100%;height:4px;accent-color:#477b43;margin-top:10px}.workflow{display:flex;align-items:center;justify-content:center;gap:35px;padding:38px 0 35px;color:#adb6a2}.workflow>div{display:flex;align-items:center;gap:9px}.workflow p{font-size:11px;color:#7c8a71}.workflow>div>span{font-size:9px;color:#a9b39e;margin-right:2px}.workflow>svg{width:13px}footer{border-top:1px solid #dfe5d7;padding:24px 0 28px;display:flex;align-items:center;justify-content:space-between;color:#a0aa94;font-size:10px}.footer-brand{font-size:14px;color:#728367;letter-spacing:-.5px}.footer-brand>span{font-size:10px;letter-spacing:0;margin-left:12px;color:#a0aa94}.error{margin-top:18px;border:1px solid #e8c7b2;background:#fff8f3;padding:14px;border-radius:7px;color:#9a5430;display:flex;gap:10px;align-items:center;font-size:12px}.error button{border:0;background:none;margin-left:auto;color:inherit;display:flex}.note-editor{margin-top:20px;border:1px solid #dae1d2;border-radius:9px;background:#fff;padding:24px}.editor-heading h2{font-size:16px;margin:0}.editor-heading h2 span{font-size:11px;font-weight:400;color:#819475;margin-left:10px}.editor-heading p{color:#8c9a82;font-size:11px}.note-chips{display:flex;gap:6px;flex-wrap:wrap;max-height:210px;overflow-y:auto}.note-chips button{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:60px;border:1px solid #e2e7db;background:#f9fbf6;border-radius:5px;padding:9px;font-size:12px}.note-chips button.selected{border-color:#3e7c4b;color:#216333;background:#eaf4e1}.note-chips small{font-size:8px;color:#9ba98e}.note-fields{display:flex;align-items:end;flex-wrap:wrap;gap:14px;margin-top:20px}.note-fields label{display:flex;flex-direction:column;font-size:11px;gap:7px}.note-fields input,.note-fields select{width:130px;padding:8px;border:1px solid #dbe3d2;border-radius:5px;background:#fff}.note-fields>button{background:none;border:0;padding:10px;color:#a9654a;font-size:11px}.spin{animation:spin 1.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#10291dcc;display:grid;place-items:center;z-index:10;padding:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{position:relative;max-width:600px;max-height:90dvh;overflow:auto;border-radius:15px;background:#fbfcf8;padding:35px;color:#45623e}.modal-close{position:absolute;right:18px;top:18px;border:0;background:none}.modal h2{color:#223f2c;font-size:26px}.modal>p{font-size:13px;line-height:1.9;color:#748069}.guide-note{border-top:1px solid #dbe5d1;padding-top:20px;margin:24px 0}.guide-note strong{font-size:13px}.guide-note p{font-size:11px;line-height:1.9;color:#87927a}@media(min-width:1500px){main{max-width:1320px}.intro{padding-top:65px;padding-bottom:42px}.workspace{grid-template-columns:335px minmax(0,1fr)}}@media(max-width:1000px){main{padding:0 24px}.workspace{grid-template-columns:280px minmax(0,1fr)}.sidebar{padding:23px 18px}.studio{padding:0 18px}.export-row{align-items:start;flex-direction:column;gap:16px}.export-row .primary{width:100%}.preview-caption>span:last-child{display:none}.workflow{gap:17px}h1{font-size:40px}}@media(max-width:720px){.header{height:72px;padding:0 22px}.brand{font-size:26px}.brand-divider,.brand-cn{display:none}main{padding:0 17px}.intro{padding:33px 4px 27px}h1{font-size:34px;letter-spacing:-1px;margin:15px 0}.intro-kicker{font-size:9px;letter-spacing:.8px}.intro p{font-size:11px}.mobile-break{display:block}.workspace{grid-template-columns:1fr}.sidebar{border-right:0;padding:22px;border-bottom:1px solid #e0e7d7}.upload-zone{min-height:160px}.second{margin-top:19px}.theme-options{grid-template-columns:1fr 1fr}.theme-option .mini-score{height:48px}.notice{margin-top:17px}.switch-row{margin:20px 0}.studio{padding:0 14px}.studio-bar{height:57px}.studio-bar .preview-tag{margin-left:2px}.preview-caption{font-size:9px}.track{gap:8px;height:55px}.export-row{padding:20px 0}.export-row h3{font-size:14px}.export-row p{font-size:10px}.export-row .primary{padding:15px}.workflow{gap:9px;padding:23px 0}.workflow>div{gap:5px}.workflow>div>span{display:none}.workflow p{font-size:9px}.workflow>div>svg{width:15px}.workflow>svg{width:10px}footer{gap:12px;align-items:start;flex-direction:column;padding:19px 4px}.note-editor{padding:17px}.modal{padding:27px 22px}.modal h2{font-size:23px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
