#sphere-direction-list{position:fixed;z-index:1500;background:var(--bg,#101722);color:var(--tx,#f5f5f5);border:1px solid var(--ac,#8bd4ef);border-radius:7px;box-shadow:0 8px 30px #0008;display:flex;flex-direction:column;overflow:hidden;font:13px var(--text-font,sans-serif)}
#sphere-direction-list[hidden]{display:none}#sphere-direction-list tr.selected{outline:2px solid var(--ac,#48a3c2);outline-offset:-2px}#sphere-direction-list header{display:flex;justify-content:space-between;border-bottom:1px solid var(--bd);padding:7px;gap:8px}#sphere-direction-list button{font:inherit;color:inherit;background:var(--sf,#202c3a);border:1px solid var(--bd,#647589);border-radius:4px;padding:5px;cursor:pointer}#sphere-direction-list button:focus-visible{outline:2px solid #7feaff}#sphere-list-move{flex:1;text-align:left;touch-action:none;cursor:move!important}.sphere-list-tools{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:7px}#sphere-list-status{margin:4px 9px 8px;min-height:2em}#sphere-list-viewport{position:relative;overflow:auto;flex:1;margin-bottom:24px}#sphere-direction-list table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}#sphere-direction-list th,#sphere-direction-list td{padding:7px;text-align:left;border-bottom:1px solid var(--bd,#415064)}#sphere-direction-list th{position:sticky;top:0;z-index:2;background:var(--bg,#101722)}#sphere-direction-list td:not(:first-child){white-space:nowrap}#sphere-direction-list .exact{outline:2px solid #ffe29a;outline-offset:-2px}#sphere-list-cursor{position:absolute;left:0;right:0;height:3px;background:#7feaff;box-shadow:0 0 7px #7feaff;pointer-events:none;z-index:1}#sphere-list-resize{position:absolute;right:0;bottom:0;touch-action:none;cursor:nwse-resize!important}
#sphere-direction-list[hidden]{display:none}#sphere-direction-list tr.selected{outline:2px solid var(--ac,#48a3c2);outline-offset:-2px}#sphere-direction-list header{display:flex;justify-content:space-between;border-bottom:1px solid var(--bd);padding:7px;gap:8px}#sphere-direction-list button{font:inherit;color:inherit;background:var(--sf,#202c3a);border:1px solid var(--bd,#647589);border-radius:4px;padding:5px;cursor:pointer}#sphere-direction-list button:focus-visible{outline:2px solid #7feaff}#sphere-list-move{flex:1;text-align:left;touch-action:none;cursor:move!important}.sphere-list-tools{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:7px}#sphere-list-status{margin:4px 9px 8px;min-height:2em}#sphere-list-progress{display:flex;align-items:center;gap:8px;margin:0 9px 8px;padding:4px 6px;border:1px solid color-mix(in srgb,var(--ac,#7feaff) 45%,transparent);border-radius:5px;background:color-mix(in srgb,var(--ac,#7feaff) 9%,transparent);font-size:11px;color:var(--td,#c9d7e5)}#sphere-list-progress[hidden]{display:none}#sphere-list-progress::before{content:"";position:absolute;left:-9999px}#sphere-list-progress-fill{height:6px;flex:0 0 34%;max-width:34%;border-radius:99px;background:linear-gradient(90deg,#55d9ff,#ffe29a);box-shadow:0 0 8px #55d9ff88;transition:width .18s ease}#sphere-list-progress-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#sphere-list-viewport{position:relative;overflow:auto;flex:1;margin-bottom:24px}#sphere-direction-list table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}#sphere-direction-list th,#sphere-direction-list td{padding:7px;text-align:left;border-bottom:1px solid var(--bd,#415064)}#sphere-direction-list th{position:sticky;top:0;z-index:2;background:var(--bg,#101722)}#sphere-direction-list td:not(:first-child){white-space:nowrap}#sphere-direction-list .exact{outline:2px solid #ffe29a;outline-offset:-2px}#sphere-list-cursor{position:absolute;left:0;right:0;height:3px;background:#7feaff;box-shadow:0 0 7px #7feaff;pointer-events:none;z-index:1}#sphere-list-resize{position:absolute;right:0;bottom:0;touch-action:none;cursor:nwse-resize!important}

/* Highlight the current row without drawing across its text. */
#sphere-direction-list tr.current-time td{background:#102c46;color:#e5f6ff;border-top:1px solid #65caff;border-bottom:1px solid #65caff}
#sphere-direction-list tr.current-time td:first-child{box-shadow:inset 3px 0 #65caff}
#sphere-direction-list tr.current-time td:last-child{box-shadow:inset -3px 0 #65caff}
#sphere-direction-list tr.current-time td button{background:#163b59;color:#e5f6ff;border-color:#65caff;box-shadow:0 0 8px #49bfff80;font-weight:650}
#sphere-list-cursor{display:none}

/* The live scan bar is a real determinate track; its fill width is updated by
   the scanner while the table stays empty until the snapshot is complete. */
#sphere-list-progress{display:grid;grid-template-columns:minmax(80px,1fr) auto;align-items:center;gap:8px}
#sphere-list-progress-fill{width:0;max-width:100%;min-width:3px;flex:none}

/* Fixed row metrics let the list render a small viewport window. Scrubbing
   uses the event index, never hundreds of forced DOM layout measurements. */
#sphere-list-viewport{overflow-anchor:none}
#sphere-direction-list table{table-layout:fixed;border-collapse:separate;border-spacing:0}
#sphere-direction-list th{height:34px;box-sizing:border-box;padding:5px}
#sphere-direction-list th:first-child{width:35%}
#sphere-direction-list th:nth-child(2){width:15%}
#sphere-direction-list th:nth-child(3){width:12%}
#sphere-direction-list th:nth-child(4){width:26%}
#sphere-direction-list th:nth-child(5){width:12%}
#sphere-direction-list tr[data-index]{height:38px}
#sphere-direction-list tr[data-index] td{height:38px;box-sizing:border-box;padding:4px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sphere-direction-list tr[data-index] button{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:28px;padding:3px 5px;box-sizing:border-box}
#sphere-direction-list tr.sphere-list-spacer td{padding:0!important;border:0!important;line-height:0}