:root{--color-bg:#0d0f14;--color-surface-1:#12151c;--color-surface-2:#1a1e28;--color-surface-3:#242838;--color-border:#ffffff14;--color-text:#d4d8e8;--color-text-muted:#6b7280;--color-accent:#4a7c59;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--color-text);background:var(--color-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:13px;line-height:1.5}*,:before,:after{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden}button{font-family:inherit;font-size:inherit}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button{opacity:.4}input[type=number]::-webkit-outer-spin-button{opacity:.4}*{scrollbar-width:thin;scrollbar-color:var(--color-surface-3) transparent}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--color-surface-3);border-radius:3px}::-webkit-scrollbar-track{background:0 0}.layout{flex-direction:column;width:100vw;height:100vh;display:flex;overflow:hidden}.layout__header{background:var(--color-surface-1);border-bottom:1px solid var(--color-border);z-index:10;flex-shrink:0;align-items:center;gap:16px;height:48px;padding:0 16px;display:flex}.layout__body{flex:1;display:flex;overflow:hidden}.layout__sidebar{flex-shrink:0;overflow-y:auto}.layout__canvas{flex:1;overflow:hidden}.layout__timeline{flex-shrink:0}.canvas-view{background:#111318;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.canvas-view__canvas{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;display:block;box-shadow:0 0 0 1px #ffffff14,0 8px 40px #0009}.canvas-view__overlay{gap:5px;display:flex;position:absolute;top:10px;right:10px}.canvas-view__overlay-btn{color:#ffffffbf;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);white-space:nowrap;background:#1e212ad9;border:1px solid #ffffff1f;border-radius:4px;padding:4px 10px;font-size:11px;transition:background .15s,color .15s}.canvas-view__overlay-btn:hover:not(:disabled){color:#fff;background:#3c4150e6}.canvas-view__overlay-btn:disabled{opacity:.35;cursor:not-allowed}.canvas-view__overlay-btn--primary{color:#fff;background:#4a7c59cc;border-color:#4a7c5980}.canvas-view__overlay-btn--primary:hover:not(:disabled){background:#5a8f69e6}.canvas-view__hint{color:#ffdc50f2;pointer-events:none;white-space:nowrap;background:#000000bf;border:1px solid #ffdc504d;border-radius:4px;padding:6px 14px;font-family:monospace;font-size:12px;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.map-uploader{flex-direction:column;gap:8px;display:flex}.map-uploader__label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);font-size:11px}.map-uploader__btn{border:1px solid var(--color-border);background:var(--color-surface-2);color:var(--color-text);cursor:pointer;border-radius:4px;padding:7px 12px;font-size:12px;transition:background .15s}.map-uploader__btn:hover{background:var(--color-surface-3)}.map-uploader__btn--danger{color:#e74c3c;border-color:#e74c3c66}.map-uploader__btn--danger:hover{background:#e74c3c1f}.map-uploader__preview{border:1px solid var(--color-border);border-radius:4px;width:100%;overflow:hidden}.map-uploader__preview img{object-fit:cover;width:100%;height:auto;max-height:80px;display:block}.properties-panel{background:var(--color-surface-1);border-right:1px solid var(--color-border);flex-direction:column;width:220px;min-width:220px;display:flex;overflow:hidden auto}.properties-panel__section{border-bottom:1px solid var(--color-border);padding:14px 14px 10px}.properties-panel__section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);margin-bottom:10px;font-size:11px}.properties-panel__track-list{flex-direction:column;gap:4px;margin-bottom:10px;display:flex}.properties-panel__track-item{cursor:pointer;background:var(--color-surface-2);border:1px solid #0000;border-radius:4px;align-items:center;gap:8px;padding:6px 8px;font-size:12px;transition:border-color .12s;display:flex}.properties-panel__track-item:hover{border-color:var(--color-border)}.properties-panel__track-item.active{border-color:var(--color-accent);background:#4a7c591f}.properties-panel__track-swatch{border-radius:2px;flex-shrink:0;width:12px;height:12px}.properties-panel__track-name{color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.properties-panel__track-remove{color:var(--color-text-muted);cursor:pointer;opacity:.5;background:0 0;border:none;padding:0 4px;font-size:10px;line-height:1;transition:opacity .12s}.properties-panel__track-remove:hover{opacity:1;color:#e74c3c}.properties-panel__actions{flex-direction:column;gap:6px;display:flex}.properties-panel__btn{border:1px solid var(--color-border);background:var(--color-surface-2);color:var(--color-text);cursor:pointer;text-align:left;border-radius:4px;padding:7px 10px;font-size:12px;transition:background .15s}.properties-panel__btn:hover:not(:disabled){background:var(--color-surface-3)}.properties-panel__btn:disabled{opacity:.4;cursor:not-allowed}.properties-panel__btn--primary{background:var(--color-accent);color:#fff;border-color:#0000}.properties-panel__btn--primary:hover:not(:disabled){background:#5a8f69}.properties-panel__field{color:var(--color-text);align-items:center;gap:8px;margin-bottom:10px;font-size:12px;display:flex}.properties-panel__field span:first-child{width:80px;color:var(--color-text-muted);flex-shrink:0}.properties-panel__field input[type=range]{accent-color:var(--color-accent);flex:1}.properties-panel__field input[type=color]{border:1px solid var(--color-border);cursor:pointer;background:0 0;border-radius:3px;width:36px;height:24px;padding:0}.properties-panel__field-value{text-align:right;width:36px;color:var(--color-text-muted);flex-shrink:0;font-size:11px}.properties-panel__select{background:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;border-radius:3px;outline:none;flex:1;padding:3px 6px;font-size:12px}.properties-panel__select:focus{border-color:var(--color-accent)}.properties-panel__io-error{color:#e74c3c;word-break:break-word;background:#e74c3c1a;border:1px solid #e74c3c59;border-radius:4px;margin-top:8px;padding:6px 10px;font-size:11px;line-height:1.4}.properties-panel__drawing-indicator{color:#ffdc50e6;text-align:center;background:#ffdc5014;border:1px solid #ffdc504d;border-radius:4px;margin:10px 14px;padding:8px 12px;font-size:11px}.timeline{background:var(--color-surface-1);border-top:1px solid var(--color-border);-webkit-user-select:none;user-select:none;flex-direction:column;height:180px;min-height:180px;display:flex}.timeline__transport{border-bottom:1px solid var(--color-border);flex-shrink:0;align-items:center;gap:6px;height:38px;padding:6px 12px;display:flex}.timeline__btn{border:1px solid var(--color-border);background:var(--color-surface-2);width:30px;height:26px;color:var(--color-text);cursor:pointer;border-radius:4px;justify-content:center;align-items:center;font-size:13px;transition:background .12s;display:flex}.timeline__btn:hover:not(:disabled){background:var(--color-surface-3)}.timeline__btn:disabled{opacity:.4;cursor:not-allowed}.timeline__btn--active{background:var(--color-accent);color:#fff;border-color:#0000}.timeline__time{color:var(--color-text);min-width:56px;margin-left:6px;font-family:monospace;font-size:13px}.timeline__separator{color:var(--color-text-muted)}.timeline__duration-label{color:var(--color-text-muted);align-items:center;gap:4px;font-size:12px;display:flex}.timeline__duration-input{background:var(--color-surface-2);border:1px solid var(--color-border);width:50px;color:var(--color-text);border-radius:3px;padding:3px 6px;font-family:monospace;font-size:12px}.timeline__zoom{align-items:center;gap:4px;margin-left:auto;display:flex}.timeline__zoom-label{color:var(--color-text-muted);text-align:center;min-width:34px;font-family:monospace;font-size:11px}.timeline__zoom-btn{border:1px solid var(--color-border);background:var(--color-surface-2);width:22px;height:22px;color:var(--color-text);cursor:pointer;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:14px;line-height:1;transition:background .12s;display:flex}.timeline__zoom-btn:hover:not(:disabled){background:var(--color-surface-3)}.timeline__zoom-btn:disabled{opacity:.35;cursor:not-allowed}.timeline__body{flex:1;min-height:0;display:flex;overflow:hidden}.timeline__labels{border-right:1px solid var(--color-border);flex-direction:column;flex-shrink:0;width:130px;min-width:130px;display:flex;overflow:hidden}.timeline__ruler-spacer{border-bottom:1px solid var(--color-border);background:var(--color-surface-2);flex-shrink:0;height:20px;min-height:20px}.timeline__track-label{height:32px;min-height:32px;color:var(--color-text-muted);cursor:pointer;border-bottom:1px solid var(--color-border);align-items:center;gap:5px;padding:0 6px 0 10px;font-size:11px;transition:background .1s;display:flex;overflow:hidden}.timeline__track-label:hover{background:var(--color-surface-2)}.timeline__track-label.active{color:var(--color-text);background:var(--color-surface-2)}.timeline__track-swatch{border-radius:50%;flex-shrink:0;width:8px;height:8px}.timeline__track-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.timeline__empty{color:var(--color-text-muted);padding:10px;font-size:11px;font-style:italic}.timeline__record-btn{color:#fff3;cursor:pointer;background:0 0;border:1.5px solid #ffffff2e;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:15px;height:15px;padding:0;font-size:7px;line-height:1;transition:border-color .15s,color .15s,background .15s;display:flex}.timeline__record-btn:hover{color:#e74c3cb3;border-color:#e74c3c99}.timeline__record-btn.active{color:#e74c3c;background:#e74c3c2e;border-color:#e74c3c}.timeline__rail-area{cursor:crosshair;flex:1;position:relative;overflow:hidden}.timeline__ruler{border-bottom:1px solid var(--color-border);background:var(--color-surface-2);height:20px;position:relative;overflow:hidden}.timeline__ruler-tick{flex-direction:column;align-items:flex-start;height:100%;display:flex;position:absolute;top:0}.timeline__ruler-tick:before{content:"";background:var(--color-border);width:1px;height:8px;display:block}.timeline__ruler-label{color:var(--color-text-muted);white-space:nowrap;margin-left:2px;font-size:9px;line-height:1}.timeline__track-row{border-bottom:1px solid var(--color-border);height:32px;position:relative;overflow:hidden}.timeline__kf-wrap{z-index:2;cursor:grab;justify-content:center;align-items:center;width:20px;height:20px;display:flex;position:absolute;top:50%;transform:translate(-50%,-50%)}.timeline__kf-wrap:active{cursor:grabbing}.timeline__keyframe{pointer-events:none;border:1.5px solid #fff6;border-radius:1px;flex-shrink:0;width:10px;height:10px;transition:transform .1s,border-color .1s;transform:rotate(45deg)}.timeline__kf-wrap:hover .timeline__keyframe{border-color:#fff;transform:rotate(45deg)scale(1.3)}.timeline__keyframe.dragging{border-color:#fff;transform:rotate(45deg)scale(1.25)}.timeline__playhead{pointer-events:none;z-index:10;background:#e74c3c;width:2px;position:absolute;top:0;bottom:0;transform:translate(-50%)}.timeline__playhead:before{content:"";border-top:7px solid #e74c3c;border-left:5px solid #0000;border-right:5px solid #0000;width:0;height:0;position:absolute;top:0;left:50%;transform:translate(-50%)}.timeline__scrollbar{background:var(--color-surface-2);border-top:1px solid var(--color-border);cursor:pointer;flex-shrink:0;height:8px;min-height:8px;position:relative}.timeline__scrollbar-thumb{cursor:grab;background:#ffffff2e;border-radius:3px;min-width:24px;height:6px;transition:background .1s;position:absolute;top:1px}.timeline__scrollbar-thumb:hover,.timeline__scrollbar-thumb:active{cursor:grabbing;background:#ffffff59}.app-header__logo{color:var(--color-text);letter-spacing:.04em;font-size:15px;font-weight:700}.app-header__divider{background:var(--color-border);width:1px;height:18px}.app-header__subtitle{color:var(--color-text-muted);font-size:12px}.app-header__spacer{flex:1}.app-header__export-status{align-items:center;gap:10px;display:flex}.app-header__progress-bar{background:var(--color-surface-3);border-radius:3px;width:150px;height:6px;overflow:hidden}.app-header__progress-fill{background:var(--color-accent);border-radius:3px;height:100%;transition:width .2s}.app-header__progress-label{color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;max-width:220px;font-size:11px;overflow:hidden}.app-header__btn{border:1px solid var(--color-border);background:var(--color-surface-2);color:var(--color-text);cursor:pointer;border-radius:4px;padding:6px 14px;font-size:12px;transition:background .15s}.app-header__btn:hover:not(:disabled){background:var(--color-surface-3)}.app-header__btn:disabled{opacity:.4;cursor:not-allowed}.app-header__btn--primary{background:var(--color-accent);color:#fff;border-color:#0000}.app-header__btn--primary:hover:not(:disabled){background:#5a8f69}.app-header__btn--danger{color:#e74c3c;border-color:#e74c3c66}.app-header__btn--danger:hover{background:#e74c3c1f}
