.br-root .toolbar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#1e1e1e;border-bottom:1px solid #333;flex-shrink:0;flex-wrap:wrap}.br-root .toolbar button{padding:6px 14px;border:1px solid #555;border-radius:4px;background:#2a2a2a;color:#eee;cursor:pointer;font-size:13px;transition:background .15s}.br-root .toolbar button:hover{background:#3a3a3a}.br-root .toolbar button:active{background:#444}.br-root .toolbar button:disabled{opacity:.4;cursor:default}.br-root .toolbar label{display:flex;align-items:center;gap:4px;font-size:13px;cursor:pointer}.br-root .toolbar label input[type=checkbox]{cursor:pointer}.br-root .toolbar select{padding:4px 8px;background:#333;border:1px solid #555;color:#eee;border-radius:4px;font-size:13px;cursor:pointer}.br-root .toolbar select:focus{outline:1px solid #4488ff}.br-root .toolbar button.active{background:#3a6a3a;border-color:#5a5;color:#cfc}.br-root .toolbar button.danger{border-color:#a55}.br-root .toolbar button.danger:hover{background:#5a2a2a}.br-root .toolbar button.pin-active{background:#3a3a5a;border-color:#88f;color:#aaf}.br-root .viewport{flex:1;min-height:0;position:relative;overflow:hidden;background:#1a1a1a;background-image:linear-gradient(45deg,#1e1e1e 25%,transparent 25%),linear-gradient(-45deg,#1e1e1e 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1e1e1e 75%),linear-gradient(-45deg,transparent 75%,#1e1e1e 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.br-root .viewport.drag-over{background:#1a2a3a;outline:3px dashed #4a9eff;outline-offset:-3px}.br-root .viewport.edit-mode .pixi-canvas{cursor:crosshair}.br-root .viewport.weight-paint-mode{cursor:none}.br-root .svg-container{position:absolute;top:0;left:0;z-index:1;pointer-events:none}.br-root .svg-container svg{display:block}.br-root .pixi-canvas{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.br-root .upload-prompt{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#666;font-size:18px;pointer-events:none;z-index:0}.br-root .upload-prompt .icon{font-size:64px;opacity:.3}.br-root .upload-prompt .hint{font-size:13px;color:#555}.br-root .zoom-controls{position:absolute;bottom:12px;right:12px;display:flex;flex-direction:column;align-items:center;gap:2px;z-index:50;pointer-events:auto}.br-root .zoom-controls button{width:32px;height:32px;border:1px solid #555;border-radius:6px;background:#2a2a2ae6;color:#eee;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.br-root .zoom-controls button:hover{background:#505050e6}.br-root .zoom-level{font-size:10px;color:#999;margin-top:2px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.br-root .display-toggle-container{position:absolute;bottom:12px;left:12px;z-index:50;pointer-events:auto}.br-root .display-toggle-btn{width:32px;height:32px;border:1px solid #555;border-radius:6px;background:#2a2a2ae6;color:#ccc;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .15s,color .15s}.br-root .display-toggle-btn:hover{background:#505050e6;color:#fff}.br-root .display-toggle-popover{position:absolute;bottom:calc(100% + 6px);left:0;display:flex;flex-direction:column;gap:3px;padding:6px;background:#1e1e1ef2;border:1px solid rgba(255,255,255,.08);border-radius:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);min-width:100px}.br-root .display-toggle-item{padding:5px 10px;border:none;border-radius:5px;background:transparent;color:#888;font-size:12px;text-align:left;cursor:pointer;transition:background .12s,color .12s}.br-root .display-toggle-item:hover{background:#ffffff0f;color:#ccc}.br-root .display-toggle-item.active{background:#4a7eff;color:#fff}.br-root .joint-popover{position:absolute;z-index:40;pointer-events:auto;transform:translate(12px,-50%)}.br-root .joint-popover-btn{width:26px;height:26px;border:1px solid #555;border-radius:6px;background:#2a2a2aeb;color:#aaa;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .12s,color .12s,border-color .12s}.br-root .joint-popover-btn:hover{background:#505050e6;color:#fff}.br-root .joint-popover-btn.active{background:#4a7eff;border-color:#4a7eff;color:#fff}.br-root .add-joint-help{position:absolute;bottom:40px;left:50%;transform:translate(-50%);background:#000000d9;color:#ccc;padding:8px 16px;border-radius:6px;font-size:13px;pointer-events:none;white-space:nowrap;z-index:10}.br-root .timeline-panel{flex-shrink:0;background:#191919f7;border-top:1px solid #444;padding:10px 16px;z-index:20;font-size:12px;color:#ccc}.br-root .tl-controls{display:flex;align-items:center;gap:8px;margin-bottom:8px}.br-root .tl-controls button{padding:4px 10px;border:1px solid #555;border-radius:4px;background:#2a2a2a;color:#eee;cursor:pointer;font-size:12px;transition:background .15s}.br-root .tl-controls button:hover{background:#3a3a3a}.br-root .tl-controls button:disabled{opacity:.4;cursor:default}.br-root .tl-controls button.active{background:#3a6a3a;border-color:#5a5;color:#cfc}.br-root .tl-controls button.rec-active{background:#6a2a2a;border-color:#a55;color:#fcc}.br-root .tl-time{font-variant-numeric:tabular-nums;color:#888;min-width:120px;text-align:center}.br-root .tl-scrubber-wrap{position:relative;height:32px;background:#222;border-radius:4px;cursor:pointer;overflow:hidden}.br-root .tl-scrubber-track{position:absolute;top:14px;left:0;right:0;height:4px;background:#444;border-radius:2px}.br-root .tl-scrubber-fill{height:100%;background:#5a5;border-radius:2px;width:0%;transition:width .05s linear}.br-root .tl-scrubber-handle{position:absolute;top:8px;width:12px;height:16px;background:#eee;border-radius:3px;transform:translate(-6px);left:0%;pointer-events:none}.br-root .tl-keyframe-marker{position:absolute;top:4px;width:8px;height:8px;background:#f80;border-radius:50%;transform:translate(-4px);cursor:pointer;z-index:2}.br-root .tl-keyframe-marker:hover{background:#fa0;transform:translate(-4px) scale(1.3)}.br-root .tl-library{display:flex;align-items:center;gap:6px;margin-top:8px}.br-root .tl-library select{padding:3px 6px;background:#333;border:1px solid #555;color:#eee;border-radius:3px;font-size:12px;min-width:140px}.br-root .tl-library button{padding:3px 8px;font-size:11px;border:1px solid #555;border-radius:3px;background:#2a2a2a;color:#eee;cursor:pointer}.br-root .tl-library button:hover{background:#3a3a3a}.br-root *,.br-root *:before,.br-root *:after{margin:0;padding:0;box-sizing:border-box}.br-root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#eee;-webkit-user-select:none;-moz-user-select:none;user-select:none}.br-root #app{display:flex;flex-direction:column;height:100%;overflow:hidden}.br-root #statusbar{flex-shrink:0;padding:4px 16px;background:#1a1a1a;border-top:1px solid #333;font-size:12px;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.br-root .separator{width:1px;height:24px;background:#444;flex-shrink:0}.br-root .panel{width:220px;background:#1e1e1ef2;border:1px solid #444;border-radius:6px;padding:12px;font-size:12px;color:#ccc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.br-root .panel h3{font-size:13px;margin-bottom:8px;color:#aaa;font-weight:600}.br-root .panel .hint{color:#555;font-size:10px;margin-top:8px;line-height:1.4}.br-root .bone-row{display:flex;align-items:center;gap:6px;margin-bottom:6px}.br-root .bone-row label{flex:1;color:#ccc;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.br-root .bone-row input[type=range]{width:80px;height:4px;cursor:pointer;accent-color:#4488ff}.br-root .bone-row .val{width:28px;text-align:right;color:#888;font-size:10px;font-variant-numeric:tabular-nums}.br-root .section-title{color:#666;font-size:10px;text-transform:uppercase;letter-spacing:.5px;margin:8px 0 4px;border-top:1px solid #333;padding-top:6px}.br-root .pose-item{display:flex;align-items:center;gap:4px;margin-bottom:4px;padding:4px 6px;background:#2a2a2a;border-radius:3px;font-size:12px}.br-root .pose-item button{padding:2px 6px;font-size:10px}.br-root .pose-item .pose-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.br-root .wp-mode.active{background:#446;border-color:#88f;color:#aaf}
