*{box-sizing:border-box;margin:0;padding:0}@keyframes attention-pulse{0%,to{outline:3px solid transparent;outline-offset:0px}50%{outline:6px solid rgb(238 130 49 / .81);outline-offset:0px}}.attention-pulse{animation:attention-pulse 1.1s ease-in-out infinite}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#888;color:#111;padding:4px 8px 8px;display:flex;flex-direction:column;min-height:100vh;overflow-y:auto;overflow-x:hidden}h1{font-size:1.1rem;font-weight:600;color:#111;flex-shrink:0}#control-panels{display:flex;flex-direction:row;gap:2px;margin:2px 0 0;flex-shrink:0;align-items:stretch}.controls{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;background:#ccc;border:2px solid #333333;border-radius:8px;padding:10px 14px;flex-shrink:0;box-shadow:2px 4px 8px #0006,inset 0 1px #ffffff8c}.controls.encoder-config{flex:1;flex-direction:row;gap:8px;align-items:stretch;padding:10px 6px}.enc-config-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}.enc-config-right{flex:0 0 250px;display:flex;flex-direction:column;gap:8px;align-items:stretch}.enc-group{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 16px;align-items:flex-start}.panel-title{display:flex;flex-wrap:wrap;justify-content:center;border:solid 1px #333333;border-radius:8px;padding:2px 6px;background:#ccc;text-align:center;font-size:1.2rem;font-weight:600;color:#555;pointer-events:none}.controls.view-config{flex:.1;flex-direction:column;gap:8px}.config-row-start{display:flex;gap:16px;align-items:flex-start}.config-row-end{display:flex;flex-direction:row;gap:8px;align-items:flex-start;justify-content:flex-end}.enc-list-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.control-group{display:flex;flex-direction:column;gap:4px}label{font-size:.72rem;color:#111;text-transform:uppercase;letter-spacing:.05em;align-self:center}select,input[type=text],input[type=number]{background:#ccc;border:2px solid #333333;border-radius:4px;color:#111;padding:4px 7px;font-size:.85rem}select{box-shadow:1px 2px 4px #0000004d,inset 0 1px #ffffff80;cursor:pointer}input[type=text]{width:140px}input[type=number]{width:54px;-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=range]{width:100px;accent-color:#333333}input[type=range]:disabled{opacity:.3;cursor:not-allowed}.range-row{display:flex;align-items:center;gap:6px}.range-val{font-size:.85rem;min-width:1.2em;color:#111}.w-slider-col{display:flex;flex-direction:column;gap:1px}#w-tick-row{display:flex;justify-content:space-between;width:100px;font-size:.6rem;color:#444;line-height:1}.checkbox-row{display:flex;align-items:center;gap:5px;font-size:.82rem}#encoder-list{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;flex:1;min-width:0}.enc-header-row{display:flex;align-items:center;gap:4px;justify-content:space-between;margin-bottom:4px}.enc-type{flex:1;min-width:0;font-size:.62rem;letter-spacing:.05em;background:#ccc;border:2px solid #333333;border-radius:4px;color:#111;padding:4px 7px;box-shadow:1px 2px 4px #0000004d,inset 0 1px #ffffff80;cursor:pointer}div.enc-header-row select.enc-type ::picker{background:#fff;border:2px solid #333;box-shadow:0 4px 12px #0000001a;padding:5px}select:not(:-internal-list-box)::picker .enc-type{color:-internal-auto-base(inherit,CanvasText)}.enc-row{display:flex;flex-direction:column;align-items:stretch;background:#0f3460;border:2px solid #000000;border-radius:4px;padding:4px 6px;box-shadow:1px 2px 5px #00000080,inset 0 1px #ffffff2e}.n-slider-col{display:flex;flex-direction:column;gap:1px}.n-slider-row{display:flex;align-items:center;gap:4px}input[type=range].enc-n,input[type=range].enc-w,input[type=range].enc-offset,input[type=range].enc-range,input[type=range].enc-period{width:120px;accent-color:#ffffff}.enc-n-val{font-size:.82rem;min-width:1.5em;color:#fff}.enc-slider-label{font-size:.6rem;color:#fff;text-transform:uppercase;min-width:10px}.n-tick-row{display:flex;justify-content:space-between;width:120px;margin-left:14px;padding:0 0 0 4px;box-sizing:border-box;font-size:.6rem;color:#fff;line-height:1}.enc-w-divider{border-top:1px solid #555555;margin:3px 0}.dual-range{display:flex;align-items:center;gap:6px}.dual-range-track{position:relative;width:180px;height:24px}.dual-range-track:before{content:"";position:absolute;left:0;right:0;top:50%;height:14px;transform:translateY(-50%);background:#ccc;border:2px solid #333333;border-radius:4px;box-shadow:1px 2px 4px #0000004d,inset 0 1px #ffffff80}.dual-range-track:after{content:"";position:absolute;left:6px;right:6px;top:50%;height:4px;transform:translateY(-50%);background:#888;border-radius:2px;pointer-events:none;z-index:1}.dual-range-fill{position:absolute;top:50%;height:4px;transform:translateY(-50%);background:#4a90d9;border-radius:2px;pointer-events:none;z-index:2}.dual-range-track input[type=range]{position:absolute;inset:0;width:100%;background:transparent;-webkit-appearance:none;appearance:none;pointer-events:none;z-index:3}.dual-range-track input[type=range]::-webkit-slider-runnable-track{background:transparent;border:none}.dual-range-track input[type=range]::-moz-range-track{background:transparent;border:none}.dual-range-track input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #333333;cursor:pointer;margin-top:0}.dual-range-track input[type=range]::-moz-range-thumb{pointer-events:auto;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #333333;cursor:pointer}.dual-range-val{font-size:.75rem;color:#111;min-width:2.5em;text-align:center;font-variant-numeric:tabular-nums}.enc-remove{background:#ffffff2e;border:1px solid #000000;border-radius:3px;color:#000;cursor:pointer;font-size:.75rem;padding:1px 5px;line-height:1.4;box-shadow:1px 1px 3px #0006,inset 0 1px #ffffff4d}.enc-remove:hover{border-color:#e15759;color:#e15759}.enc-remove:active{box-shadow:inset 1px 1px 3px #00000073}#enc-add,#enc-reset{background:#ccc;border:2px solid #333333;border-radius:4px;color:#111;cursor:pointer;font-size:.75rem;padding:2px 8px;box-shadow:1px 2px 4px #0000004d,inset 0 1px #ffffff8c}#enc-add:hover,#enc-reset:hover{border-color:#000;color:#000}#enc-add:active,#enc-reset:active{box-shadow:inset 1px 2px 4px #00000059}#enc-add:disabled,#enc-reset:disabled{background:#aaa;border-color:#888;color:#666;cursor:not-allowed;box-shadow:none;opacity:.6}.metrics-label{align-self:center}.metrics{font-size:.78rem;background:#aaa;border:1px solid #555555;border-radius:3px;padding:2px 6px;align-self:center;justify-self:end}.error-banner{display:none;background:#fdd;border:2px solid #cc0000;border-radius:4px;padding:7px 11px;font-size:.82rem;color:#500;margin-bottom:8px;flex-shrink:0}#periodic-controls,#fixed-controls,#weight-control{display:none}#scalar-row{display:none;align-items:stretch;margin:0;padding:0;gap:0;flex-shrink:0;position:relative}#scalar-val-gutter{flex-shrink:0}#scalar-val{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);z-index:10;cursor:grab;user-select:none;touch-action:none;font-size:.82rem;color:#fff;background:#0064a3;border:2px solid #000000;border-radius:5px;padding:3px 2px;box-shadow:2px 4px 8px #0000004d,inset 0 1px #fff3;white-space:nowrap;display:flex;align-items:center;font-weight:600}#scalar-val:before{content:"⠿";font-size:.75rem;color:#ffffff80;margin-right:4px;line-height:1}#scalar-val:after{content:"⠿";font-size:.75rem;color:#ffffff80;margin-left:4px;line-height:1}#scalar-val:active{cursor:grabbing;background:#004f82}#scalar-slider-wrap{background:#0064a300;border:2px solid #000000;border-radius:5px;padding:4px;box-shadow:2px 4px 16px #000c,inset 0 1px #fff3;display:flex;align-items:center;min-width:0;min-height:36px;flex-shrink:0}#scalar-slider{-webkit-appearance:none;appearance:none;min-width:0;width:100%;height:6px;border-radius:3px;background:#0064a359;outline:none;cursor:pointer}#scalar-slider::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:#0064a359}#scalar-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:0;height:0;border:none;box-shadow:none;margin-top:0}#scalar-slider::-moz-range-thumb{width:0;height:0;border:none;box-shadow:none}#scalar-slider::-moz-range-track{height:6px;border-radius:3px;background:#0064a359}#scalar-right-pad{flex-shrink:0}#plot-container{background:#eee;border:2px solid #333333;border-radius:8px;padding:0 8px;width:100%;flex:1;min-height:300px;position:relative;overflow:hidden;box-shadow:2px 4px 8px #0006,inset 0 1px #ffffff8c;margin:0}#empty-plot-msg{display:none;position:absolute;inset:0;align-items:center;justify-content:center;color:#555;font-size:.95rem;pointer-events:none;z-index:15}#main-area{display:flex;flex:1;flex-direction:column;min-height:600px;margin:16px 0 0}#center-col{flex:1;min-width:0;min-height:0;display:flex;flex-direction:row;gap:8px}#subplot-panel{display:none;flex-direction:column;gap:6px;width:200px;flex-shrink:0;align-self:stretch;overflow-y:auto;background:#ccc;border:2px solid #333333;border-radius:8px;padding:8px;box-shadow:2px 4px 8px #0006,inset 0 1px #ffffff8c}#subplot-chips{display:flex;flex-direction:column;gap:4px}.subplot-panel-title{font-size:.68rem;font-weight:700;color:#444;letter-spacing:.07em;text-align:center;text-transform:uppercase;padding-bottom:4px;border-bottom:1px solid #aaa;margin-bottom:2px}.subplot-chip-icon{font-size:.8rem;line-height:1;margin-right:3px}.subplot-chip-label{flex:1;font-size:.78rem;font-weight:600;overflow-wrap:anywhere;line-height:1.15}.subplot-chip{display:flex;flex-direction:row;align-items:stretch;gap:0;background:#d4d4d4;border:1px solid #888888;border-radius:4px;padding:4px 5px;font-size:.75rem;color:#111;cursor:grab;box-shadow:1px 2px 4px #00000040,inset 0 1px #ffffff8c}.chip-drag-handle{display:flex;align-items:center;justify-content:center;width:14px;flex-shrink:0;padding-right:4px;font-size:.9rem;color:#0000004d;user-select:none;cursor:grab}.chip-body{display:flex;flex-direction:column;flex:1;gap:0;min-width:0}.chip-top-row{display:flex;align-items:center;gap:3px;width:100%;padding:3px 5px;user-select:none}.chip-toggle-pill{position:relative;display:inline-flex;align-items:center;width:28px;height:16px;flex-shrink:0;margin-left:auto;border-radius:8px;background:#00000038;cursor:pointer;transition:background .15s;border:1px solid rgba(0,0,0,.5);box-shadow:1px 3px 4px #00000040,inset 0 1px #ffffff8c}.chip-toggle-pill:active{box-shadow:inset 1px 1px 3px #0000004d;background:#00000040}.chip-toggle-pill:hover{background:#00000059}.chip-toggle-pill:focus-visible{outline:2px solid rgba(255,160,20,.9);outline-offset:2px}.chip-toggle-pill.chip-toggle-on{background:#28b450d9}.chip-toggle-pill.chip-toggle-on:hover{background:#28b450}.chip-toggle-knob{position:absolute;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #00000059;transition:left .15s}.chip-toggle-pill.chip-toggle-on .chip-toggle-knob{left:14px}.chip-controls{display:flex;flex-wrap:wrap;gap:3px;padding-top:2px}.chip-toggle-btn{font-size:.65rem;padding:2px 5px;border:2px solid #333333;border-radius:4px;background:#00000012;color:#222;cursor:pointer;white-space:nowrap;line-height:1.3;box-shadow:1px 2px 4px #00000040,inset 0 1px #ffffff8c}.chip-toggle-btn:hover{background:#00000026}.chip-toggle-btn.active{background:#4a80b5;color:#fff;border-color:#2a5a90}.chip-toggle-btn.active:hover{background:#3a6a9f}.chip-ref-controls{flex-direction:column;gap:3px;align-items:flex-start}.subplot-chip.chip-disabled{cursor:grab}.subplot-chip.drag-over{outline:2px solid #000000;background:#bbb}.ref-point-chip{display:flex;align-items:center;gap:4px;border:1.5px solid #888;border-radius:4px;padding:2px 4px;font-size:.75rem;background:#ffffff59}.ref-point-swatch{width:8px;height:8px;border-radius:50%;flex-shrink:0}.ref-point-chip-label{flex:1;font-variant-numeric:tabular-nums}.ref-point-chip-remove{background:none;border:none;cursor:pointer;color:#666;font-size:.8rem;font-weight:700;padding:0 2px;line-height:1}.ref-point-chip-remove:hover{color:#c00}.ref-point-open-btn{font-size:.65rem;padding:2px 5px;border:1px solid rgba(0,0,0,.22);border-radius:3px;background:#00000012;color:#222;cursor:pointer;white-space:nowrap;line-height:1.3;box-shadow:1px 2px 4px #00000040,inset 0 1px #ffffff8c}.ref-point-open-btn:hover{background:#00000026}.ref-point-hint{font-size:.65rem;color:#888;margin-top:2px;display:block}#ref-point-popup{display:none;position:fixed;z-index:1000;background:#f2f2f2;border:1.5px solid #5a88bb;border-radius:6px;padding:8px 10px;box-shadow:2px 6px 16px #0000004d;width:200px}.ref-point-popup-range{display:flex;justify-content:space-between;font-size:.65rem;color:#666;margin-bottom:1px}#ref-point-popup-slider{width:100%;display:block;margin-bottom:4px}.ref-point-popup-val{text-align:center;font-size:.85rem;font-weight:700;font-variant-numeric:tabular-nums;margin-bottom:8px;color:#111}.ref-point-popup-btns{display:flex;gap:5px;justify-content:flex-end}.ref-point-popup-btns button{font-size:.75rem;padding:2px 10px;border-radius:3px;cursor:pointer;border:1px solid #999;background:#ddd}#ref-point-popup-add{background:#c8dcf0;border-color:#5a88bb;color:#1a3a5c;font-weight:600}#ref-point-popup-add:hover{background:#b8cfe8}#scalar-bits-panel{display:flex;flex-direction:column;background:#ccc;border:2px solid #333333;border-radius:6px;padding:4px;box-shadow:2px 4px 8px #0006,inset 0 1px #ffffff8c;margin:0 0 4px;flex-shrink:0;overflow-y:auto;align-self:flex-start;min-height:60px}.bp-rows{display:flex;flex-direction:column;gap:6px}.bp-row{display:flex;flex-direction:column;gap:2px}.bp-row-label{font-size:.7rem;font-weight:700;color:#333;display:flex;align-items:center;gap:3px}.bp-squares-wrap{display:flex;flex-wrap:wrap;gap:3px}.bits-panel-placeholder{padding:8px 10px;color:#888;font-size:.8rem;font-style:italic;white-space:nowrap}