:root{--background:rgba(20,22,25,.95);--background-dark:#0e1013;--background-deep:#08090a;--background-card:rgba(30,32,36,.45);--background-card-hover:rgba(45,48,54,.6);--background-selected:rgba(255,26,26,.16);--accent-red:#ff1a1a;--accent-red-glow:rgba(255,26,26,.6);--accent-red-subtle:rgba(255,26,26,.25);--accent-red-border:rgba(255,26,26,.4);--text-primary:#fff;--text-secondary:hsla(0,0%,100%,.65);--text-muted:hsla(0,0%,100%,.42);--text-dim:hsla(0,0%,100%,.22);--border-white:hsla(0,0%,100%,.08);--border-subtle:hsla(0,0%,100%,.05);--border-dashed:hsla(0,0%,100%,.08);--font-main:"Bai Jamjuree",-apple-system,BlinkMacSystemFont,sans-serif;--font-mono:"JetBrains Mono",Consolas,monospace}*{margin:0;padding:0;box-sizing:border-box}:focus,:focus-visible,button:focus,input:focus,select:focus{outline:none!important;box-shadow:none!important}body{background-color:var(--background-deep);color:var(--text-primary);font-family:var(--font-main);height:100vh;width:100vw;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.custom-scrollbar::-webkit-scrollbar{width:4px;height:4px}.custom-scrollbar::-webkit-scrollbar-track{background:hsla(0,0%,100%,.02);border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--accent-red-subtle);border-radius:4px;-webkit-transition:background .2s ease;transition:background .2s ease}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--accent-red);box-shadow:0 0 6px var(--accent-red-glow)}.app-container{display:flex;height:100vh;width:100vw;background:radial-gradient(circle at 50% 0,#15181d 0,#08090a 80%);overflow:hidden}.app-container.resizing-active{-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important;cursor:col-resize!important}.dashboard-split-layout{display:flex;flex-direction:row;height:100%;width:100%;overflow:hidden;position:relative}.dashboard-pane-left{flex:1 1;min-width:0;height:100%;display:flex;flex-direction:column;padding:16px 20px;overflow-y:auto}.header-action-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-shrink:0}.result-badge-container{display:flex;align-items:center;gap:8px}.red-pill{width:3.5px;height:14px;background:var(--accent-red);border-radius:2px;box-shadow:0 0 8px var(--accent-red-glow);flex-shrink:0}.result-title{font-size:13.5px;font-weight:800;color:#fff;letter-spacing:1.2px}.result-count{font-size:14px;font-weight:700;color:#fff;font-family:var(--font-mono);background:rgba(255,26,26,.12);border:1px solid var(--accent-red-border);padding:2px 8px;border-radius:4px}.header-tools-group{display:flex;align-items:center;gap:8px}.tool-btn-clear{display:flex;align-items:center;gap:6px;background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);border-radius:6px;color:#fca5a5;font-family:var(--font-main);font-size:11.5px;font-weight:600;cursor:pointer;padding:5px 11px;transition:all .2s ease}.tool-btn-clear:hover{background:#ef4444;color:#fff;box-shadow:0 0 10px rgba(239,68,68,.5)}.tool-btn-icon{background:hsla(0,0%,100%,.04);border:1px solid var(--border-white);border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:6px 8px;transition:all .2s ease}.tool-btn-icon:hover{color:#fff;background:rgba(255,26,26,.15);border-color:var(--accent-red-border);box-shadow:0 0 8px rgba(255,26,26,.4)}.tool-btn-expand{display:flex;align-items:center;gap:6px;background:rgba(255,26,26,.16);border:1px solid var(--accent-red-border);border-radius:6px;color:#fff;font-family:var(--font-main);font-size:11.5px;font-weight:700;cursor:pointer;padding:5px 12px;transition:all .2s ease;box-shadow:0 0 8px rgba(255,26,26,.3)}.tool-btn-expand:hover{background:var(--accent-red);box-shadow:0 0 12px var(--accent-red-glow)}.filter-bar-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;flex-shrink:0}.btn-add-filter{display:flex;align-items:center;gap:6px;height:32px;padding:0 14px;background:rgba(255,26,26,.15);border:1px solid var(--accent-red-border);border-radius:6px;color:#fff;font-family:var(--font-main);font-size:12px;font-weight:700;cursor:pointer;transition:all .2s ease;letter-spacing:.5px}.btn-add-filter:hover{background:var(--accent-red);color:#fff;box-shadow:0 0 12px var(--accent-red-glow);transform:scale(1.02)}.filter-chip{display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;background:rgba(20,22,25,.85);border:1px solid var(--border-white);border-radius:6px;font-size:12px}.chip-key{color:var(--text-muted);font-weight:600}.chip-val{color:#fff;font-weight:600;font-family:var(--font-mono)}.chip-del{background:rgba(255,26,26,.15);border:none;color:var(--accent-red);font-family:var(--font-main);font-size:11px;font-weight:700;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .15s ease}.chip-del:hover{background:var(--accent-red);color:#fff;box-shadow:0 0 6px var(--accent-red-glow)}.btn-refresh-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:rgba(40,40,40,.4);border:1px solid var(--border-white);border-radius:6px;color:#fff;cursor:pointer;transition:all .2s ease}.btn-refresh-icon:hover{background:rgba(255,26,26,.2);border-color:var(--accent-red-border);box-shadow:0 0 8px rgba(255,26,26,.4)}.spin-anim{animation:spin .6s cubic-bezier(.4,0,.2,1)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.chart-card{position:relative;height:185px;display:grid;grid-template-columns:1fr 65px;grid-template-rows:1fr 24px;margin-bottom:20px;background:rgba(20,22,25,.6);border:1px solid var(--border-white);border-radius:8px;padding:10px 14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-shrink:0}.chart-plot-container{grid-column:1;grid-row:1;position:relative;border-bottom:1px solid var(--border-white);border-left:1px solid var(--border-white);overflow:hidden}.chart-horizontal-grid{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.chart-grid-line{width:100%;height:1px;background-color:var(--border-white)}.chart-threshold-line{position:absolute;left:0;right:0;height:1px;border-top:1px dashed var(--accent-red-border);box-shadow:0 0 4px rgba(255,26,26,.3);pointer-events:none}.chart-bars-track{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-around;padding:0 16px}.chart-bar-slot{display:flex;align-items:flex-end;justify-content:center;height:100%;flex:1 1;max-width:48px;cursor:pointer}.chart-bar-fill{width:24px;min-width:14px;max-width:28px;background:linear-gradient(180deg,#fff,hsla(0,0%,100%,.75));border-radius:3px 3px 0 0;transition:all .2s ease;box-shadow:0 0 10px hsla(0,0%,100%,.15)}.chart-bar-fill:hover{background:linear-gradient(180deg,var(--accent-red) 0,#b91c1c 100%);box-shadow:0 0 14px var(--accent-red-glow);transform:scaleY(1.02)}.chart-y-axis{grid-column:2;grid-row:1;flex-direction:column;justify-content:space-between;font-family:var(--font-mono);font-size:10.5px;color:var(--text-muted);text-align:right;padding-right:4px}.chart-x-axis,.chart-y-axis{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}.chart-x-axis{grid-column:1;grid-row:2;justify-content:space-around;align-items:center;padding-top:6px}.chart-x-label-slot{flex:1 1;max-width:48px;text-align:center;font-family:var(--font-mono);font-size:10.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.columns-container{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:16px;gap:16px;flex:1 1;min-height:280px}.col-card{display:flex;flex-direction:column;background:rgba(20,22,25,.65);border:1px solid var(--border-white);border-radius:8px;padding:12px 14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.col-card-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px dashed var(--border-dashed);margin-bottom:8px;flex-shrink:0}.col-header-title-box{display:flex;align-items:center;gap:6px}.col-title-text{font-size:13.5px;font-weight:700;color:#fff;letter-spacing:.8px;text-transform:uppercase}.col-count-title{font-size:12px;font-weight:600;color:var(--text-muted);letter-spacing:.5px}.col-rows-scroll{flex:1 1;overflow-y:auto;max-height:420px;padding-right:2px}.col-empty{font-size:12px;color:var(--text-muted);text-align:center;padding:24px 0}.data-row{display:flex;justify-content:space-between;align-items:center;padding:7px 10px;margin-bottom:4px;cursor:pointer;background:var(--background-card);border:1px solid var(--border-white);border-radius:6px;font-size:12.5px;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:all .15s ease}.data-row:hover{background:var(--background-card-hover);border-color:hsla(0,0%,100%,.18);transform:translateY(-1px)}.data-row.selected{background:var(--background-selected);border-color:var(--accent-red-border);box-shadow:0 0 10px rgba(255,26,26,.25)}.row-key{color:#fff;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.row-key,.row-key-group{overflow:hidden;max-width:65%}.row-key-group{display:flex;align-items:center;gap:6px}.selected-cursor-pill{width:3px;height:12px;background:var(--accent-red);border-radius:1px;box-shadow:0 0 6px var(--accent-red-glow);flex-shrink:0}.row-value-group{display:flex;align-items:center;gap:8px}.row-number{font-family:var(--font-mono);font-size:12px;font-weight:600;color:#fff!important;text-align:right}.row-volume-bar{height:8px;background:linear-gradient(90deg,rgba(255,26,26,.4),var(--accent-red));border-radius:2px;box-shadow:0 0 6px rgba(255,26,26,.3)}.resizer-divider-bar{width:14px;margin:0 -7px;height:100%;cursor:col-resize;position:relative;z-index:60;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:background .15s ease}.resizer-dashed-line{position:absolute;top:0;bottom:0;left:50%;width:1px;border-left:1px dashed var(--accent-red);box-shadow:0 0 6px rgba(255,26,26,.35);pointer-events:none;transition:all .2s ease}.resizer-divider-bar.dragging .resizer-dashed-line,.resizer-divider-bar:hover .resizer-dashed-line{border-left:2px solid var(--accent-red);box-shadow:0 0 12px var(--accent-red-glow)}.dashboard-pane-right{background:rgba(10,11,13,.98);box-shadow:-4px 0 20px rgba(0,0,0,.85);flex-shrink:0;transition:width .04s ease-out}.dashboard-pane-right,.stream-container{height:100%;overflow:hidden;display:flex;flex-direction:column}.stream-container{width:100%}.stream-header-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:rgba(20,22,25,.96);border-bottom:1px solid var(--border-white);flex-shrink:0}.stream-title-box{display:flex;align-items:center;gap:8px}.stream-title-text{font-size:12.5px;font-weight:700;letter-spacing:.8px;color:#fff;text-transform:uppercase}.stream-badge-count{font-size:11px;font-family:var(--font-mono);color:var(--text-muted);background:hsla(0,0%,100%,.06);padding:1px 6px;border-radius:3px}.stream-close-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:3px;border-radius:4px;transition:all .15s ease}.stream-close-btn:hover{color:var(--accent-red);background:rgba(255,26,26,.15)}.stream-log-scroll{flex:1 1;overflow-y:auto;padding:12px 14px;font-family:var(--font-mono);font-size:11.5px;line-height:1.65;background:transparent}.stream-empty{font-size:12px;color:var(--text-muted);text-align:center;padding:30px 0}.stream-log-row{display:flex;align-items:center;gap:7px;white-space:nowrap;padding:2.5px 6px;border-radius:4px;transition:background .12s ease}.stream-log-row:hover{background:hsla(0,0%,100%,.05)}.indicator-stripe{width:2.5px;height:13px;border-radius:1.5px;flex-shrink:0;margin-right:3px}.indicator-stripe.stripe-green{background-color:#10b981;box-shadow:0 0 6px rgba(16,185,129,.7)}.indicator-stripe.stripe-red{background-color:#ff1a1a;box-shadow:0 0 6px rgba(255,26,26,.7)}.indicator-stripe.stripe-neutral{background-color:hsla(0,0%,100%,.25)}.log-key{color:#71717a}.log-val{color:#fff}.log-val-num{color:#fff;font-weight:600}.modal-backdrop{position:fixed;inset:0;background:rgba(10,11,13,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000}.filter-modal-box{width:440px;background:var(--background);border:1px solid var(--border-white);border-radius:8px;overflow:hidden;box-shadow:0 10px 35px rgba(0,0,0,.8)}.modal-header{justify-content:space-between;padding:14px 18px;border-bottom:1px dashed var(--border-dashed)}.modal-header,.modal-title-box{display:flex;align-items:center}.modal-title-box{gap:8px}.modal-title-box h3{font-size:14.5px;font-weight:700;color:#fff;letter-spacing:.8px;text-transform:uppercase}.modal-close-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;transition:color .15s ease}.modal-close-btn:hover{color:var(--accent-red)}.modal-body{padding:18px;gap:14px}.modal-body,.modal-input-group{display:flex;flex-direction:column}.modal-input-group{gap:6px}.modal-label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.modal-select,.modal-text-input{height:36px;padding:0 12px;background:rgba(0,0,0,.4);border:1px solid var(--border-white);border-radius:6px;color:#fff;font-family:var(--font-main);font-size:13px;outline:none;transition:border-color .2s ease}.modal-select:focus,.modal-text-input:focus{border-color:var(--accent-red)}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px dashed var(--border-dashed)}.btn-modal-cancel{padding:8px 14px;background:rgba(40,40,40,.35);border:1px solid var(--border-white);border-radius:6px;color:var(--text-secondary);font-family:var(--font-main);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-modal-cancel:hover{background:hsla(0,0%,100%,.08);color:#fff}.btn-modal-apply{padding:8px 18px;background:var(--accent-red);border:none;border-radius:6px;color:#fff;font-family:var(--font-main);font-size:12px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 0 10px var(--accent-red-glow)}.btn-modal-apply:hover{background:#e01515;transform:scale(1.02)}.btn-modal-delete{padding:8px 18px;background:#ef4444;border:none;border-radius:6px;color:#fff;font-family:var(--font-main);font-size:12px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 0 10px rgba(239,68,68,.5)}.btn-modal-delete:hover{background:#dc2626;transform:scale(1.02)}.chart-hover-tooltip{position:fixed;background:var(--background);border:1px solid var(--border-white);color:#fff;padding:6px 12px;border-radius:6px;font-size:11px;font-family:var(--font-mono);pointer-events:none;z-index:1000;box-shadow:0 4px 14px rgba(0,0,0,.8)}.login-wrapper{display:flex;align-items:center;justify-content:center;min-height:100vh;width:100vw;background:#08090a;padding:20px}.login-card{width:100%;max-width:400px;background:rgba(20,22,25,.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid hsla(0,0%,100%,.08);border-radius:10px;padding:34px 28px;box-shadow:0 25px 70px rgba(0,0,0,.95);display:flex;flex-direction:column}.login-header{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:6px}.login-pill{width:3.5px;height:18px}.login-title{font-size:18px;font-weight:800;color:#fff;letter-spacing:1.2px}.login-subtitle{font-size:11.5px;color:hsla(0,0%,100%,.4);text-align:center;margin-bottom:24px}.login-form{gap:16px}.login-form,.login-input-group{display:flex;flex-direction:column}.login-input-group{gap:8px}.login-input-label{font-size:11.5px;font-weight:600;color:hsla(0,0%,100%,.7)}.login-input-box{position:relative;display:flex;align-items:center;width:100%}.login-input-icon{position:absolute;left:14px;color:hsla(0,0%,100%,.35);pointer-events:none}.login-input{width:100%;height:40px;padding:0 14px 0 38px;background:rgba(0,0,0,.25);border:1px solid hsla(0,0%,100%,.08)!important;border-radius:6px;color:#fff;font-size:13px;font-family:var(--font-mono);transition:border-color .2s ease}.login-input,.login-input:focus{box-shadow:none!important;outline:none!important}.login-input:focus{border-color:hsla(0,0%,100%,.25)!important}.login-error-msg{font-size:11.5px;color:#f87171;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);padding:8px 12px;border-radius:6px;text-align:center;font-weight:600;animation:shake .3s ease-in-out}@keyframes shake{0%,to{transform:translateX(0)}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}.login-submit-btn{height:40px;background:#632524;border:1px solid #f9221f;border-radius:6px;color:#fff;font-family:var(--font-main);font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 0 10px rgba(249,34,31,.25);display:flex;align-items:center;justify-content:center}.login-submit-btn:hover{filter:brightness(1.15);box-shadow:0 0 14px rgba(249,34,31,.4)}.login-submit-btn:active{transform:scale(.98)}.tool-btn-logout:hover{color:#ef4444!important;background:rgba(239,68,68,.15)!important;border-color:rgba(239,68,68,.4)!important;box-shadow:0 0 8px rgba(239,68,68,.4)!important}