button.btn{display:inline-flex;align-items:center;gap:6px}button.btn svg{width:18px;flex-shrink:0}#sidebar{position:fixed;top:0;left:0;width:300px;height:100vh;background-color:#f8f9fa;border-right:1px solid #dee2e6;padding:20px;box-sizing:border-box;display:flex;flex-direction:column;overflow-y:auto;transition:transform .3s ease-in-out;transform:translate(-100%);z-index:1000}#sidebar.visible{transform:translate(0)}#sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}#sidebar-title{font-weight:700;font-size:1.2em}#close-sidebar-btn{font-size:1.5em;cursor:pointer;border:none;background:none;padding:0 5px;color:#6c757d}#sidebar-content{display:flex;flex-direction:column;gap:15px}.color-swatch{width:100%;height:40px;border:1px solid #ccc;border-radius:4px;cursor:pointer;display:flex;flex-direction:column;align-items:stretch;justify-content:center;overflow:hidden;transition:transform .1s}.swatch-half{width:100%;height:50%}.swatch-label{margin-top:5px;text-align:left;font-size:12px;font-weight:700}.led-count-selector .btn{font-size:1.1em;font-weight:700}.svg-wrapper{max-width:1400px;width:100%;margin:20px auto;border:1px solid #ccc;background-color:#f0f0f0;min-height:540px;display:flex;justify-content:center;align-items:center;position:relative;padding:0 20px;box-sizing:border-box}.orientation-label{position:absolute;left:100px;font-family:Arial,sans-serif;font-weight:700;font-size:32px;color:#343a4056;z-index:5;pointer-events:none;line-height:1}.orientation-front{top:80px}.orientation-rear{bottom:80px}.others-info-overlay{position:absolute;bottom:10px;right:10px;background:#ffffffd9;padding:5px 10px;border-radius:4px;font-size:12px;text-align:left;z-index:10;line-height:1.5}.info-overlay{position:absolute;top:10px;left:10px;background:#ffffffd9;padding:5px 10px;border-radius:4px;font-size:12px;text-align:left;z-index:10;pointer-events:none;line-height:1.5}.info-overlay span{font-weight:700}.simulator-brand{position:fixed;bottom:12px;right:16px;font-size:10px;font-weight:700;letter-spacing:.05em;color:#21252966;z-index:100;pointer-events:none;text-transform:uppercase;line-height:1}#svg-layer{display:block;width:100%;height:auto;max-height:400px;padding:0 38px}svg .led-group{transition:opacity .2s,stroke .2s,filter .15s ease}.lightbar-simulator-root.simulator-readonly svg .led-group{cursor:default}.lightbar-simulator-root.simulator-editable svg .led-group{cursor:pointer}svg .led-group.led-unified .led-half-bottom{display:none}.lightbar-simulator-root svg .led-group:not(.selected) rect{stroke:#000;stroke-width:5px;stroke-dasharray:none;paint-order:stroke fill;transition:stroke .15s ease,stroke-width .15s ease,filter .15s ease}.lightbar-simulator-root.simulator-editable svg .led-group:not(.selected):hover rect{stroke:#3d8fd9;stroke-width:5px;filter:brightness(1.06)}svg .led-group.selected rect{stroke:#007bff;stroke-width:8px}.lightbar-simulator-root.simulator-names-editable .led-name-label{cursor:text;pointer-events:all}.lightbar-simulator-root.simulator-editable:not(.simulator-names-editable) .led-name-label{cursor:default;pointer-events:none}.lightbar-simulator-root.simulator-readonly .led-name-label{cursor:default;pointer-events:none}.led-name-label{font-family:Arial,sans-serif;font-weight:700;fill:#333;stroke:#fff;stroke-width:.6px;paint-order:stroke}.lightbar-simulator-root.simulator-names-editable .led-name-label:hover{fill:#007bff;text-decoration:underline dotted;text-underline-offset:2px}.led-name-edit-fo{overflow:visible}.led-name-edit{font-family:Arial,sans-serif;font-weight:700;text-align:center;color:#333;background:#fffffff2;border:1px solid #007bff;border-radius:3px;padding:2px 6px;outline:none;line-height:1.2;box-sizing:border-box;width:100%;height:100%}#app-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(12px);background:#212529eb;color:#fff;padding:10px 18px;border-radius:6px;font-size:14px;z-index:2000;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.led-count-text{pointer-events:none;font-family:Arial,sans-serif;font-weight:700;fill:#000;text-anchor:middle;font-size:38px;stroke:#fff;stroke-width:.8px;paint-order:stroke}.led-bulbs{pointer-events:none;opacity:.92}.led-bulb{pointer-events:none}#block-manager-wrap{max-width:1200px;margin:0 auto;padding:0 20px}#block-manager{display:flex;flex-direction:column;gap:8px}.bm-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.bm-middle{display:flex;align-items:center;gap:4px;flex-wrap:wrap;flex:1;min-height:36px;min-width:120px;padding:6px 8px;border-radius:8px;background:#f8f9fa;border:1px dashed #ced4da}.bm-actions{display:flex;align-items:center;flex-wrap:wrap;gap:4px}.bm-cap{background:#343a40;color:#fff;padding:4px 10px;border-radius:6px;font-size:13px;font-weight:700;-webkit-user-select:none;user-select:none;flex-shrink:0}.bm-block{display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;cursor:grab;font-size:13px;font-weight:700;-webkit-user-select:none;user-select:none;transition:opacity .15s,box-shadow .1s}.bm-block:active{cursor:grabbing}.bm-block.bm-dragging{opacity:.45}.bm-block.bm-drop-before{box-shadow:inset 3px 0 #0d6efd}.bm-block.bm-drop-after{box-shadow:inset -3px 0 #0d6efd}.bm-grip{opacity:.45;font-size:12px;line-height:1;cursor:grab}.bm-led{background:#cfe2ff;border:1.5px solid #0d6efd;color:#0d6efd}.bm-empty{background:#e9ecef;border:1.5px solid #adb5bd;color:#6c757d}.bm-half{background:#d1e7dd;border:1.5px solid #198754;color:#146c43}.bm-mini{background:#fff3cd;border:1.5px solid #ffc107;color:#997404}.bm-speaker{background:#333;border:1.5px solid #1a1a1a;color:#f8f9fa}svg .speaker-group{pointer-events:none}.middle-block-highlight-layer{pointer-events:none}.middle-block-highlight-fill{fill:transparent;stroke:transparent;stroke-width:3;transition:fill .12s ease,stroke .12s ease}.middle-block-highlight.is-hovered .middle-block-highlight-fill{fill:#0d6efd24;stroke:#0d6efd8c}.middle-block-highlight[data-block-type=empty].is-hovered .middle-block-highlight-fill{fill:#6c757d29;stroke:#6c757d8c}.middle-block-highlight[data-block-type=speaker].is-hovered .middle-block-highlight-fill{fill:#ffc10738;stroke:#ffc107bf}.middle-block-highlight[data-block-type=mini].is-hovered .middle-block-highlight-fill{fill:#ffc10724;stroke:#ffc107a6}.cost-highlight-layer{pointer-events:none}.cost-highlight-fill{fill:transparent;stroke:transparent;stroke-width:4}.cost-highlight.is-cost-active .cost-highlight-fill,.middle-block-highlight.is-cost-active .middle-block-highlight-fill{animation:cost-highlight-pulse 2.4s ease-in-out infinite}.middle-block-highlight[data-block-type=empty].is-cost-active .middle-block-highlight-fill{animation-name:cost-highlight-pulse-muted}.middle-block-highlight[data-block-type=speaker].is-cost-active .middle-block-highlight-fill,.middle-block-highlight[data-block-type=mini].is-cost-active .middle-block-highlight-fill{animation-name:cost-highlight-pulse-warn}@keyframes cost-highlight-pulse{0%,to{fill:#0d6efd1a;stroke:#0d6efd66}50%{fill:#0d6efd4d;stroke:#0d6efde6}}@keyframes cost-highlight-pulse-muted{0%,to{fill:#6c757d1f;stroke:#6c757d73}50%{fill:#6c757d47;stroke:#6c757dcc}}@keyframes cost-highlight-pulse-warn{0%,to{fill:#ffc10724;stroke:#ffc10780}50%{fill:#ffc10752;stroke:#ffc107f2}}.bm-block:hover{opacity:.85}.bm-remove{background:none;border:none;cursor:pointer;font-size:15px;line-height:1;padding:0 2px;color:inherit}.bm-remove:hover{color:#dc3545}.td-label{font-family:Arial,sans-serif;font-weight:700;fill:#000;pointer-events:none}.editable{display:inline-block;min-width:60px;padding:0 2px;outline:none}.editable:empty:before{content:attr(data-placeholder);color:#999}.editable:focus{border-bottom:1px solid #007aff}body{margin:0;background:#f5f5f5}#app-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(12px);background:#212529eb;color:#fff;padding:10px 18px;border-radius:6px;font-size:14px;z-index:3000;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}#app-toast.visible{opacity:1;transform:translate(-50%) translateY(0)}#app-toast.app-toast-success{background:#198754f2}#app-toast.app-toast-error{background:#dc3545f2}.template-library-tree{display:flex;flex-direction:column;gap:.35rem;margin:0 auto;padding:1rem 1.25rem;background:#ededed;border-radius:15px;box-shadow:0 4px 14px #0000001f}.template-folder-create{display:flex;gap:.5rem;max-width:480px}.template-folder{background:transparent;border:none;border-radius:0;min-height:0;padding:5px 30px 30px 5px;transition:background .15s}.template-folder--active{background:#f0f6ff;border-radius:6px}.template-folder-header{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.35rem .5rem .35rem 0;border-bottom:none}.template-folder-header-main{display:flex;align-items:center;gap:.25rem;flex:1;min-width:0}.template-folder-toggle{display:flex;align-items:center;gap:.5rem;border:none;background:transparent;text-align:left;cursor:pointer;border-radius:6px}.template-folder-toggle-chevron{padding:.35rem .25rem .35rem .5rem;flex-shrink:0}.template-folder-toggle-title{flex:1;min-width:0;padding:.35rem .5rem}.template-folder-rename-btn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;border:none;background:transparent;color:#6c757d;border-radius:6px;cursor:pointer;flex-shrink:0}.template-folder-rename-input{flex:1;min-width:120px;max-width:320px}.template-folder-chevron{flex-shrink:0;transition:transform .15s ease}.template-folder--collapsed .template-folder-chevron{transform:rotate(-90deg)}.template-folder-title{font-weight:600;font-size:1rem}.template-folder-count{font-size:.8rem}.template-folder-body{display:flex;flex-direction:column;gap:.5rem;margin-left:.85rem;padding:.35rem 0 .5rem 1rem;border-left:2px solid #dee2e6;min-height:0}.template-folder-empty{min-height:28px}.template-library-item{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fff;border:1px solid #e9ecef;border-radius:6px;cursor:grab;width:100%}.template-library-item:active{cursor:grabbing}.template-library-item-main{display:flex;align-items:center;gap:.5rem;min-width:0}.template-library-item-title{min-width:0;flex:1}.template-library-item-label{cursor:default;min-width:0}.template-meta-edit{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;width:100%}.template-meta-edit>input.form-control{flex:1 1 120px;min-width:80px}.template-meta-edit-size,.template-meta-edit-mm{display:inline-flex;align-items:center;gap:.15rem;white-space:nowrap;font-size:.875rem;color:#6c757d}.template-meta-edit-size input{width:3.5rem;text-align:center;padding-left:.35rem;padding-right:.35rem}.template-meta-edit-done{flex-shrink:0}.template-library-drag{color:#adb5bd;display:inline-flex;align-items:center;-webkit-user-select:none;user-select:none}.edit-template-name{width:min(200px,40vw)}.edit-template-name-group .form-control{min-width:140px}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;line-height:1}.btn-icon.btn-sm{width:1.875rem;height:1.875rem}.btn-icon svg{flex-shrink:0}.template-name-editable,.template-folder-title-editable{cursor:text}.edit-template-layout{display:flex;align-items:stretch;min-height:100vh}.edit-template-sidebar{width:260px;flex-shrink:0;background:#fff;border-right:1px solid #dee2e6;display:flex;flex-direction:column;overflow:hidden}.edit-template-sidebar-tree{flex:1;overflow-y:auto;padding:.75rem .5rem 1rem;display:flex;flex-direction:column;gap:.35rem}.edit-sidebar-folder-header{display:flex;align-items:center;gap:.25rem;min-width:0}.edit-sidebar-folder-header-main{display:flex;align-items:center;gap:.25rem;flex:1;min-width:0}.edit-sidebar-folder-add{flex-shrink:0}.edit-sidebar-folder-add:focus,.edit-sidebar-folder-add:active{box-shadow:none}.edit-sidebar-folder-body{display:flex;flex-direction:column;gap:.35rem;margin-left:.85rem;padding:.35rem 0 .5rem 1rem;border-left:2px solid #dee2e6}.edit-sidebar-folder-empty{min-height:24px}.edit-sidebar-folder--collapsed .template-folder-chevron{transform:rotate(-90deg)}.edit-template-sidebar-item{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.75rem 1rem;border-radius:6px;color:#212529;text-decoration:none}.edit-template-sidebar-item:hover{background:#f8f9fa}.edit-template-sidebar-item.active{background:#e7f1ff;color:#0d6efd}.edit-template-sidebar-item-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem}.edit-template-sidebar-item-meta{flex-shrink:0;font-size:.75rem;color:#6c757d}.edit-template-sidebar-item.active .edit-template-sidebar-item-meta{color:#6ea8fe}.edit-template-main{flex:1;min-width:0}.edit-template-editor{position:relative}.edit-template-editor--loading{pointer-events:none;opacity:.55}.setting-layout{display:flex;min-height:100vh;background:#f5f5f5}.setting-sidebar{width:220px;flex-shrink:0;background:#fff;border-right:1px solid #dee2e6;padding:1.25rem 0}.setting-sidebar-title{font-size:1.1rem;font-weight:600;margin:0;padding:0 1.25rem 1rem}.setting-nav{display:flex;flex-direction:column;gap:.25rem;padding:0 .75rem}.setting-nav-item{display:block;padding:.55rem .75rem;border-radius:6px;color:#212529;text-decoration:none;font-weight:500}.setting-nav-item:hover{background:#f8f9fa;color:#212529}.setting-nav-item.active{background:#e7f1ff;color:#0d6efd}.setting-main{flex:1;min-width:0;display:flex;flex-direction:column}.setting-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1.25rem;background:#fff;border-bottom:1px solid #dee2e6}.setting-content{flex:1;padding:1.25rem;max-width:960px}.setting-content:has(.setting-section--with-preview){max-width:1400px}.setting-section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}.setting-cost-template-name{font-weight:500}.setting-template-list{list-style:none;margin:0;padding:0;background:#fff;border:1px solid #dee2e6;border-radius:8px;overflow:hidden}.setting-template-list li+li{border-top:1px solid #dee2e6}.setting-template-list-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.9rem 1rem;color:inherit;text-decoration:none}.setting-template-list-item:hover{background:#f8f9fa}.setting-template-list-name{font-weight:500}.setting-back-link{display:inline-flex;align-items:center;gap:.35rem;color:#6c757d;text-decoration:none;font-size:.9rem}.setting-back-link:hover{color:#0d6efd}.setting-panel{background:#fff;border:1px solid #dee2e6;border-radius:8px;padding:1.25rem}.setting-panel-title{font-size:1rem;font-weight:600;margin:0 0 1rem}.setting-fields-form{display:flex;flex-direction:column;gap:1rem;max-width:320px}.setting-field-input{max-width:200px}.setting-cost-workspace{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:1.25rem;margin-top:1rem;align-items:start}.setting-cost-form-column .setting-panel{margin-top:0}.setting-cost-preview-column{position:sticky;top:1rem;min-width:0}.setting-cost-preview-block{border:1px solid #dee2e6;border-radius:8px;overflow:hidden;background:#fff}.setting-cost-preview-caption{background:#f8f9fa;border-bottom:1px solid #dee2e6;padding:.7rem .95rem;font-size:.9rem;line-height:1.45;color:#6c757d;min-height:3rem}.setting-cost-preview-caption.is-active{background:#e7f1ff;border-bottom-color:#b6d4fe;color:#084298;font-weight:500}.setting-cost-preview-frame{display:block;width:100%;height:min(72vh,560px);border:none;background:#fff;overflow:hidden}html:has(.template-embed-root),body:has(.template-embed-root){overflow:hidden;height:100%}body:has(.template-embed-root) #root{height:100%;overflow:hidden}.template-embed-root{margin:0;height:100%;overflow:hidden;background:#f5f5f5}.template-embed-root .lightbar-simulator-root{height:100%;overflow:hidden}.template-embed-root .lightbar-simulator-root .container-fluid{padding:0;height:100%;overflow:hidden;display:flex;flex-direction:column}.template-embed-root .svg-wrapper{margin:0;max-width:none;min-height:0;flex:1;border:none;padding:4px 8px;box-sizing:border-box}.template-embed-root .info-overlay div:nth-child(2),.template-embed-root .others-info-overlay{display:none}.template-embed-root #svg-layer{display:block;width:100%;height:100%}.template-embed-loading,.template-embed-error{padding:1rem;color:#6c757d;font-size:.9rem}@media(max-width:992px){.setting-cost-workspace{grid-template-columns:1fr}.setting-cost-preview-column{position:static}.setting-cost-preview-frame{height:min(50vh,420px)}}
