diff --git a/webapp/lsp/jsonrpc.xqm b/webapp/lsp/jsonrpc.xqm
index b69e822..f673186 100644
--- a/webapp/lsp/jsonrpc.xqm
+++ b/webapp/lsp/jsonrpc.xqm
@@ -70,7 +70,8 @@ declare
 function rpc:send($msg as map(*)) 
 as empty-sequence()
 {
-  rpc:admin-log($msg,"⬅️"),ws:send($msg ,ws:id())
+  rpc:admin-log($msg,"⬅️"),
+  ws:send($msg ,ws:id())
 };
 
 (:~ canned initialize response :)
diff --git a/webapp/lsp/position.xqm b/webapp/lsp/position.xqm
index 303f8fe..b278f0c 100644
--- a/webapp/lsp/position.xqm
+++ b/webapp/lsp/position.xqm
@@ -84,3 +84,14 @@ declare function pos:full-range($text as xs:string)
 as lspt:Range{
  lspt:Range(pos:toPosition($text,0), pos:toPosition($text, string-length($text)))
 }; 
+
+(:~   range for $text from indices:)
+declare function pos:range-from-ast(
+  $text as xs:string,
+$ast as element(*))
+as lspt:Range{
+ lspt:Range(
+   pos:toPosition($text,number($ast/@start)), 
+   pos:toPosition($text, number($ast/@end))
+ )
+}; 
diff --git a/webapp/static/clients/codemirror/grail.html b/webapp/static/clients/codemirror/grail.html
index 9b74b73..d815632 100644
--- a/webapp/static/clients/codemirror/grail.html
+++ b/webapp/static/clients/codemirror/grail.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" class="quiet-cloak">
+<html lang="en" class="quiet-cloak "> <!--  also quiet-dark -->
 
 <head>
     <meta charset="utf-8">
@@ -8,8 +8,14 @@
     <link rel="icon" type="image/png" href="../favicon.png" />
 
     <!-- Quiet theme + autoloader -->
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.4.0/dist/themes/quiet.css">
-    <script type="module" src="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.4.0/dist/quiet.loader.js"></script>
+    <!-- Default theme (if not already installed) -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/quiet.css">
+
+    <!-- Quiet Restyle 
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/themes/restyle.css">
+ -->
+
+    <script type="module" src="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.6.1/dist/quiet.loader.js"></script>
 
 
     <link rel="stylesheet" href="grail.css" />
@@ -27,7 +33,7 @@
                 <quiet-icon slot="checked" name="network" family="outline"></quiet-icon>
             </quiet-toggle-icon>
 
-            <quiet-button-group label="Links">
+            <quiet-toolbar label="Links">
                 <quiet-button href="#" variant="primary" aria-current="page" size="sm">
                     Editor
                 </quiet-button>
@@ -37,8 +43,8 @@
                 <quiet-button href="/dba/logs" target="dba" rel="noreferrer noopener" size="sm">
                     Dba
                 </quiet-button>
-            </quiet-button-group>
-            <select id="load">
+            </quiet-toolbar>
+            <quiet-select id="load" style="width:20em;">
                 <option selected value="">load..</option>
                 <optgroup label="XQuery3">
                     <option
@@ -61,7 +67,7 @@
                         value="https://raw.githubusercontent.com/dnovatchev/Articles/refs/heads/main/Generators/Code/generator.xq">
                         generator.xquery</option>
                 </optgroup>
-            </select>
+            </quiet-select>
 
             <button popovertarget="popAbout" type="button">
                 <i class="codicon codicon-info"></i>
@@ -71,12 +77,7 @@
 
         <main class="page-main" style="overflow: auto;">
             <quiet-toolbar>
-                <quiet-button-group>
-                    <label for="file">File:</label>
-                    <input id="iFile" type="url" value="file:///some/file.xqm" />
 
-                    <label for="symbols">Symbols:</label><select id="symbols" disabled="disabled"></select>
-                </quiet-button-group>
                 <quiet-button-group>
 
                     <button id="search" title="Search" type="button" class="btn btn-light"><i
@@ -155,25 +156,31 @@
         </aside>
 
         <footer class="page-footer">
+            <div style="display:flex;">
+                <select id="language" style="width:10em;display:inline-block;">
+                    <option selected>Language</option>
+                    <option value="plaintext">plaintext</option>
+                    <option value="xquery">xquery</option>
+                    <option value="xml">xml</option>
+                </select>
+                <div>
+                    <label for="iFile">File:</label>
+                    <input id="iFile" type="url" value="file:///some/file.xqm" style="width:10em;display:inline-block;" />
 
-            <select id="language">
-                <option selected>Language</option>
-                <option value="plaintext">plaintext</option>
-                <option value="xquery">xquery</option>
-                <option value="xml">xml</option>
-            </select>
+                    <label for="symbols">Symbols:</label>
+                    <select id="symbols" disabled="disabled" style="width:10em;display:inline-block;"></select>
+                </div>
+            </div>
             <quiet-relative-time live id="relative-time__live" style="width:10em;"></quiet-relative-time>
             <quiet-dropdown id="dropdown__checkboxes">
                 <quiet-button slot="trigger"><i class='codicon codicon-kebab-vertical'></i></quiet-button>
                 <quiet-dropdown-item type="checkbox" value="canvas" checked>Follow cursor</quiet-dropdown-item>
-                
-                <quiet-divider></quiet-divider>
-                <quiet-radio orientation="vertical" name="sortBy">
-                    <quiet-radio-item value="position">sort by: position</quiet-radio-item>
-                    <quiet-radio-item value="name">sort by: name</quiet-radio-item>
-                    <quiet-radio-item value="category">sort by: category</quiet-radio-item>
 
-                </quiet-radio>
+                <quiet-divider></quiet-divider>
+                <quiet-dropdown-item type="checkbox" value="position" checked>sort by: Position</quiet-dropdown-item>
+                <quiet-dropdown-item type="checkbox" value="name">sort by: Name</quiet-dropdown-item>
+                <quiet-dropdown-item type="checkbox" value="category">sort by: Category</quiet-dropdown-item>
+
 
             </quiet-dropdown>
 
diff --git a/webapp/static/clients/codemirror/script.js b/webapp/static/clients/codemirror/script.js
index 089fa00..c3361f1 100644
--- a/webapp/static/clients/codemirror/script.js
+++ b/webapp/static/clients/codemirror/script.js
@@ -151,7 +151,7 @@ function connect() {
     const file = $("iFile").value;
     lsp.simpleWebSocketTransport(server)
         .then(transport => {
-            transport.socket.onclose = (event) => connectStatus(false);
+            transport.socket.onclose = (event) => $("tConnect").checked=false;
             transport.socket.oneror = (event) => $("msg").innerText = "sock error!";
             transport.subscribe(incoming);
             client = new lsp.LSPClient({ extensions: lsp.languageServerExtensions() });
@@ -169,7 +169,6 @@ function connect() {
         .catch(e => {
             console.log(e);
              $("tConnect").checked=false;
-            connectStatus(false);
             alert("connection failed: " + server)
         });
 
