diff --git a/src/kiri/init.js b/src/kiri/init.js
index dd55e5a0..904065ce 100644
--- a/src/kiri/init.js
+++ b/src/kiri/init.js
@@ -275,19 +275,6 @@ gapp.register("kiri.init", [], (root, exports) => {
         return active && (active.nodeName === "INPUT" || active.nodeName === "TEXTAREA");
     }
 
-    // function inputTextOK() {
-    //     return DOC.activeElement === ui.deviceName;
-    // }
-
-    // function textAreaHasFocus() {
-    //     let active = DOC.activeElement;
-    //     return active && active.nodeName === "TEXTAREA";
-    // }
-
-    // function inputSize() {
-    //     return parseInt(DOC.activeElement.size);
-    // }
-
     function cca(c) {
         return c.charCodeAt(0);
     }
@@ -524,15 +511,6 @@ gapp.register("kiri.init", [], (root, exports) => {
         return false;
     }
 
-    function layFlat() {
-        let int = contextInt[0];
-        if (int && int.object && int.object.widget) {
-            let q = new THREE.Quaternion();
-            q.setFromUnitVectors(contextInt[0].face.normal, new THREE.Vector3(0,0,-1));
-            api.selection.rotate(q);
-        }
-    }
-
     function setFocus() {
         let int = contextInt[0];
         if (int && int.object && int.object.widget) {
@@ -1502,12 +1480,11 @@ gapp.register("kiri.init", [], (root, exports) => {
     }
 
     // MAIN INITIALIZATION FUNCTION
-
     function init_one() {
         let { event, conf, view, show } = api;
         let { bound, toInt, toFloat } = uc;
         let { newBlank, newButton, newBoolean, newGroup, newInput } = uc;
-        let { newSelect, newText, newRow, newGCode } = uc;
+        let { newSelect, newText, newRow, newGCode, newDiv } = uc;
 
         event.emit('init.one');
 
@@ -1697,7 +1674,7 @@ gapp.register("kiri.init", [], (root, exports) => {
 
             /** Device Browser / Editor */
 
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true }),
             device:           newGroup(LANG.dv_gr_dev, null, {group:"ddev", inline:true, class:"noshow"}),
 
             _____:            newGroup("workspace", null, {group:"dext", inline:true}),
@@ -1706,7 +1683,7 @@ gapp.register("kiri.init", [], (root, exports) => {
             maxHeight:        newInput('Z (height)', {title:LANG.dv_bedw_l, convert:toFloat, size:6, units:true, round:2, action:updateDeviceSize}),
             resolutionX:      newInput(LANG.dv_rezx_s, {title:LANG.dv_rezx_l, convert:toInt, size:6, modes:SLA}),
             resolutionY:      newInput(LANG.dv_rezy_s, {title:LANG.dv_rezy_l, convert:toInt, size:6, modes:SLA}),
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
             _____:            newGroup("firmware", null, {group:"dext", inline:true}),
             fwRetract:        newBoolean(LANG.dv_retr_s, onBooleanClick, {title:LANG.dv_retr_l, modes:FDM}),
             deviceOrigin:     newBoolean(LANG.dv_orgc_s, onBooleanClick, {title:LANG.dv_orgc_l, modes:FDM_LZR, show:() => !ui.deviceRound.checked}),
@@ -1717,13 +1694,13 @@ gapp.register("kiri.init", [], (root, exports) => {
             deviceZMax:       newInput(LANG.dv_zmax_s, {title:LANG.dv_zmax_l, convert:toInt, size:5, modes:FDM}),
             gcodeTime:        newInput(LANG.dv_time_s, {title:LANG.dv_time_l, convert:toFloat, size:5, modes:FDM}),
             filamentSource:   newSelect(LANG.dv_fsrc_s, {title: LANG.dv_fsrc_l, action: filamentSourceSave, modes:FDM, show:() => false}, "filasrc"),
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM }),
             extruder:         newGroup(LANG.dv_gr_ext, null, {group:"dext", inline:true}),
             extFilament:      newInput(LANG.dv_fila_s, {title:LANG.dv_fila_l, convert:toFloat, modes:FDM}),
             extNozzle:        newInput(LANG.dv_nozl_s, {title:LANG.dv_nozl_l, convert:toFloat, modes:FDM}),
             extOffsetX:       newInput(LANG.dv_exox_s, {title:LANG.dv_exox_l, convert:toFloat, modes:FDM}),
             extOffsetY:       newInput(LANG.dv_exoy_s, {title:LANG.dv_exoy_l, convert:toFloat, modes:FDM}),
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
             _____:            newGroup(LANG.dv_gr_too, null, {group:"dext", inline:true}),
             extSelect:        newText(LANG.dv_exts_s, {title:LANG.dv_exts_l, size:14, height:3, area:gcode, modes:GCODE}),
             extDeselect:      newText(LANG.dv_dext_s, {title:LANG.dv_dext_l, size:14, height:3, area:gcode, modes:GCODE}),
@@ -1734,7 +1711,7 @@ gapp.register("kiri.init", [], (root, exports) => {
                 ui.extDel  = newButton(undefined, undefined, {icon:'<i class="fas fa-minus"></i>'}),
                 ui.extNext = newButton(undefined, undefined, {icon:'<i class="fas fa-greater-than"></i>'})
             ], {class:"dev-buttons ext-buttons", modes:FDM}),
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM, show: () => false && ui.filamentSource.selectedOptions[0].value === 'palette3' }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM, show: () => false && ui.filamentSource.selectedOptions[0].value === 'palette3' }),
             palette:          newGroup(LANG.dv_gr_pal, null, {group:"dext2", inline:true, modes:FDM}),
             paletteId:        newInput(LANG.dv_paid_s, {title:LANG.dv_paid_l, modes:FDM, size:15, text:true}),
             palettePing:      newInput(LANG.dv_paps_s, {title:LANG.dv_paps_l, modes:FDM, convert:toInt}),
@@ -1745,7 +1722,7 @@ gapp.register("kiri.init", [], (root, exports) => {
             paletteHeat:      newInput(LANG.dv_pahe_s, {title:LANG.dv_pahe_l, modes:FDM, convert:toInt}),
             paletteCool:      newInput(LANG.dv_paco_s, {title:LANG.dv_paco_l, modes:FDM, convert:toInt}),
             palettePress:     newInput(LANG.dv_pacm_s, {title:LANG.dv_pacm_l, modes:FDM, convert:toInt}),
-            _____:            uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:CAM_LZR }),
+            _____:            newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:CAM_LZR }),
             _____:            newGroup(LANG.dv_gr_out, null, {group:"dgco", inline:true}),
             gcodeStrip:       newBoolean(LANG.dv_strc_s, onBooleanClick, {title:LANG.dv_strc_l, modes:CAM}),
             gcodeSpace:       newBoolean(LANG.dv_tksp_s, onBooleanClick, {title:LANG.dv_tksp_l, modes:CAM_LZR}),
@@ -2535,7 +2512,6 @@ gapp.register("kiri.init", [], (root, exports) => {
     };
 
     // SECOND STAGE INIT AFTER UI RESTORED
-
     function init_two() {
         api.event.emit('init.two');
 
@@ -2714,9 +2690,6 @@ gapp.register("kiri.init", [], (root, exports) => {
         ui.acct.export.title = LANG.acct_xpo;
         $('file-recent').onclick = () => { api.modal.show('files') };
         $('file-import').onclick = (ev) => { api.event.import(ev); };
-        // ui.options.trash.onclick = api.selection.delete;
-        // ui.options.enable.onclick = api.selection.enable;
-        // ui.options.disable.onclick = api.selection.disable;
         ui.func.slice.onclick = (ev) => { ev.stopPropagation(); api.function.slice() };
         ui.func.preview.onclick = (ev) => { ev.stopPropagation(); api.function.print() };
         ui.func.animate.onclick = (ev) => { ev.stopPropagation(); api.function.animate() };
@@ -2728,7 +2701,6 @@ gapp.register("kiri.init", [], (root, exports) => {
         $('view-back').onclick = space.view.back;
         $('view-left').onclick = space.view.left;
         $('view-right').onclick = space.view.right;
-        // $('view-clear').onclick = api.platform.clear;
         $('unrotate').onclick = () => {
             api.widgets.for(w => w.unrotate());
             api.selection.update_info();
@@ -2743,7 +2715,6 @@ gapp.register("kiri.init", [], (root, exports) => {
         $('rot_z_lt').onclick = () => { api.selection.rotate(0,0, d) };
         $('rot_z_gt').onclick = () => { api.selection.rotate(0,0,-d) };
         // rendering options
-        // $('render-hide').onclick = () => { api.view.wireframe(false, 0, 0); };
         $('render-ghost').onclick = () => { api.view.wireframe(false, 0, api.view.is_arrange() ? 0.4 : 0.25); };
         $('render-wire').onclick = () => { api.view.wireframe(true, 0, api.space.is_dark() ? 0.25 : 0.5); };
         $('render-solid').onclick = () => { api.view.wireframe(false, 0, 1); };
@@ -2768,8 +2739,9 @@ gapp.register("kiri.init", [], (root, exports) => {
 
         // add app name hover info
         $('app-info').innerText = kiri.version;
+
         // show topline separator when iframed
-        // try { if (WIN.self !== WIN.top) $('top-sep').style.display = 'flex' } catch (e) { }
+        try { if (WIN.self !== WIN.top) $('top-sep').style.display = 'flex' } catch (e) { console.log(e) }
 
         // bind tictac buttons to panel show/hide
         let groups = {};
@@ -2798,6 +2770,7 @@ gapp.register("kiri.init", [], (root, exports) => {
                 }
             };
         }
+
         // bind closer X to hiding parent action
         for (let tt of [...document.getElementsByClassName('closer')]) {
             let tid = tt.getAttribute('target');
@@ -2812,6 +2785,7 @@ gapp.register("kiri.init", [], (root, exports) => {
             };
             api.event.on('key.esc', close);
         }
+
         // add drag behavior to movers
         [...document.getElementsByClassName('mover')].forEach(mover => {
             mover.onmousedown = (ev) => {
diff --git a/src/moto/webui.js b/src/moto/webui.js
index 4e079af7..50082775 100644
--- a/src/moto/webui.js
+++ b/src/moto/webui.js
@@ -124,6 +124,11 @@ gapp.overlay(root, {
         $(id).innerHTML = h;
     },
 
+    $c: (id, add, del) => {
+        add && $(id).classList.add(add);
+        del && $(id).classList.remove(del);
+    },
+
     h,
 
     estop: (evt) => {
diff --git a/web/kiri/index.css b/web/kiri/index.css
index 4a0cea83..532561c7 100644
--- a/web/kiri/index.css
+++ b/web/kiri/index.css
@@ -25,6 +25,7 @@
     --blue-4: rgb(221, 228, 234);
     --blue-5: rgb(240, 243, 245);
     --blue-6: rgb(247, 249, 250);
+    --scroll-bg: rgba(221, 228, 234, 0.25)
 }
 
 /* surface size configuration and font import */
@@ -38,10 +39,15 @@
     }
 }
 @media only screen and (max-width : 1200px) {
-    #top {
+    body {
         font-size: smaller;
     }
 }
+@media only screen and (max-width : 900px) {
+    body {
+        font-size: x-small;
+    }
+}
 @media only screen and (max-height : 1024px) {
     body {
         font-size: smaller;
@@ -68,6 +74,8 @@ html, body {
     position: relative;
     height: 100%;
     margin: 0;
+    scrollbar-width: none !important;
+    scrollbar-color: var(--blue-2) var(--scroll-bg);
 }
 /* default element configuration */
 a, a:hover, a:visited {
@@ -505,17 +513,6 @@ th, tr, td, label {
     margin-top: 5px;
 }
 
-:-moz-any() {
-    overflow-x: hidden !important;
-    overflow-y: hidden !important;
-}
-:-moz-any() {
-    overflow-x: scroll !important;
-    overflow-y: scroll !important;
-    margin-right: -14px !important;
-    margin-bottom: -14px !important;
-}
-
 #curtain {
     top: 0;
     left: 0;
@@ -607,6 +604,10 @@ th, tr, td, label {
     border-right: 1px solid var(--blue-3);
     border-bottom: 1px solid var(--blue-3);
 }
+#mode-device, #mode-profile {
+    max-width: 100px;
+    overflow: hidden;
+}
 
 #doit {
     display: none;
@@ -1914,11 +1915,10 @@ th, tr, td, label {
 }
 .settings {
     max-height: 100%;
-    overflow-y: auto;
+    /* overflow-y: overlay !important; */
     overflow-x: hidden;
     align-items: stretch;
     text-transform: capitalize;
-    /* background-color: rgba(255,255,255,0.5); */
 }
 .settings .set-group {
     cursor: pointer;
@@ -1942,7 +1942,7 @@ th, tr, td, label {
     background-color: #fff;
     flex-flow: column;
     padding: 4px;
-    margin: 3px;
+    margin: 2px;
 }
 .set2-group .var-row, .var-row {
     background: #fff;
diff --git a/web/kiri/index.html b/web/kiri/index.html
index 84365bf9..bb331778 100644
--- a/web/kiri/index.html
+++ b/web/kiri/index.html
@@ -215,12 +215,7 @@
 
         <!-- left settings menu -->
         <div id="panel-left" class="f-col j-left">
-            <!-- always up -->
-            <div id="mode-info">
-                <div><label>Device</label><span id="mode-device"></span></div>
-                <div><label>Profile</label><span id="mode-profile"></span></div>
-            </div>
-            <div class="line-sep2"></div>
+            <!-- <div class="line-sep2"></div> -->
             <div class="f-col grow settings">
                 <!-- FDM -->
                 <div id="fdm-layers" class="set2-group mode-fdm"></div>
@@ -281,6 +276,10 @@
             </div>
             <!-- vertical separation between workspace and right tray -->
             <div id="panel-right" class="f-col j-start settings">
+                <div id="mode-info">
+                    <div><label>Device</label><span id="mode-device"></span></div>
+                    <div><label>Profile</label><span id="mode-profile"></span></div>
+                </div>
                 <div class="set2-group f-col">
                     <div class="set-header"><a>mesh tools</a></div>
                     <div class="render-tools">
@@ -404,7 +403,7 @@
 
         <!-- settings list and editor -->
         <div id="mod-saves" class="mdialog f-col">
-            <label class="set-header menu-title" lk="dm_savs">saved settings</label>
+            <label class="set-header menu-title" lk="dm_savs">settings</label>
             <div id="settingsList" class="f-col"></div>
             <div id="settingsNew">
                 <input id="settingsName" class="grow"></input>
diff --git a/web/kiri/lang/en.js b/web/kiri/lang/en.js
index 294aeaf2..7f2a2c63 100644
--- a/web/kiri/lang/en.js
+++ b/web/kiri/lang/en.js
@@ -81,7 +81,7 @@ self.kiri.lang['en-us'] = {
     dm_mydd:        "my devices",
     dm_seld:        "selected device",
     dm_rcnt:        "recent files",
-    dm_savs:        "saved settings",
+    dm_savs:        "settings",
     dm_appp:        "Application Preferences",
 
     // CAM Tool Dialog