:root{--face:silver;--hilite:#fff;--light:#dfdfdf;--shadow:gray;--dark:#000;--paper:#fff;--desktop:#3a6ea5;--title:navy;--title-end:#1084d0;--text:#000;--text-dim:#404040;--bevel-out:inset -1px -1px var(--dark), inset 1px 1px var(--hilite), inset -2px -2px var(--shadow), inset 2px 2px var(--light);--bevel-in:inset 1px 1px var(--shadow), inset -1px -1px var(--hilite), inset 2px 2px var(--dark), inset -2px -2px var(--light);--bevel-out-thin:inset -1px -1px var(--shadow), inset 1px 1px var(--hilite);--bevel-in-thin:inset 1px 1px var(--shadow), inset -1px -1px var(--hilite);--bevel-pressed:inset 1px 1px var(--shadow), inset -1px -1px var(--light);--ui:Tahoma, "MS Sans Serif", Geneva, Verdana, sans-serif;--mono:"Courier New", ui-monospace, Consolas, monospace;--ok:green;--warn:olive;--err:maroon;font:12px/1.4 var(--ui);letter-spacing:normal;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);-webkit-font-smoothing:none;font-synthesis:none}body{background:var(--desktop);margin:0}#app{box-sizing:border-box;justify-content:center;align-items:flex-start;min-height:100svh;padding:24px 16px 52px;display:flex}#paint{justify-content:center;display:flex}.window,.paint{background:var(--face);color:var(--text);font:11px/1.4 var(--ui);box-shadow:var(--bevel-out);padding:3px}.window{box-sizing:border-box;width:740px;max-width:100%;font-size:12px}.window-body{flex-direction:column;gap:8px;padding:6px 4px 4px;display:flex}.titlebar{background:linear-gradient(90deg, var(--title), var(--title-end));color:#fff;-webkit-user-select:none;user-select:none;align-items:center;gap:4px;height:18px;padding:0 2px 0 3px;font-weight:700;display:flex}.titlebar .title-icon{color:#fff}.titlebar .title-icon svg{width:13px;height:13px;display:block}.titlebar .title-text{font:inherit;white-space:nowrap;text-overflow:ellipsis;flex:auto;margin:0;overflow:hidden}.titlebar .title-buttons{gap:2px;display:flex}.titlebar button{width:16px;min-width:0;height:14px;box-shadow:var(--bevel-out);place-items:center;padding:0;display:grid}.titlebar button i{font:9px/1 var(--ui);font-style:normal;transform:translateY(-1px)}.titlebar button:active{box-shadow:var(--bevel-pressed)}.menubar{-webkit-user-select:none;user-select:none;padding:1px 0 2px;display:flex}.menubar .menu{position:relative}.menubar .menu-title{min-width:0;box-shadow:none;padding:2px 7px}.menubar .menu-title:hover,.menubar .menu-title.open{background:var(--title);color:#fff}.menubar .menu-title:active{box-shadow:none}.dropdown{z-index:2;background:var(--face);min-width:168px;box-shadow:var(--bevel-out);padding:2px;position:absolute;top:100%;left:0}.dropdown hr{border:none;border-top:1px solid var(--shadow);border-bottom:1px solid var(--hilite);margin:3px 1px}.dropdown .menu-item{text-align:left;white-space:nowrap;width:100%;min-width:0;box-shadow:none;justify-content:space-between;gap:24px;padding:3px 6px 3px 20px;display:flex}.dropdown .menu-item .accel{color:inherit}.dropdown .menu-item:disabled{color:var(--shadow);text-shadow:1px 1px var(--hilite)}.dropdown .menu-item:hover:not(:disabled){background:var(--title);color:#fff}.dropdown .menu-item:active{box-shadow:none}.window.collapsed>:not(.titlebar),.paint.collapsed>:not(.titlebar){display:none}.collapsed>.titlebar{cursor:pointer}button{font:11px var(--ui);color:var(--text);background:var(--face);cursor:default;min-width:75px;box-shadow:var(--bevel-out);border:none;border-radius:0;padding:4px 10px}button:active:not(:disabled){box-shadow:var(--bevel-pressed)}button:focus-visible{outline:1px dotted var(--dark);outline-offset:-4px}button:disabled{color:var(--shadow);text-shadow:1px 1px var(--hilite)}input{font:12px var(--mono);color:var(--text);background:var(--paper);min-width:0;box-shadow:var(--bevel-in);border:none;border-radius:0;flex:220px;padding:3px 4px}input:focus-visible{outline:none}input:disabled{background:var(--face);color:var(--shadow)}.group{min-width:0;box-shadow:inset -1px -1px var(--hilite), inset 1px 1px var(--shadow), inset -2px -2px var(--face), inset 2px 2px var(--hilite);border:none;margin:0;padding:10px 8px 8px}.group legend{background:var(--face);margin-left:4px;padding:0 4px}.row,#command-form{flex-wrap:wrap;align-items:center;gap:6px;display:flex}label{-webkit-user-select:none;user-select:none}.status{font:11px var(--ui);box-shadow:var(--bevel-in-thin);align-items:center;gap:5px;padding:2px 6px;display:inline-flex}.status:before{content:"";width:7px;height:7px;box-shadow:var(--bevel-in-thin);background:currentColor}.status.idle{color:var(--shadow)}.status.pending{color:var(--warn)}.status.live{color:var(--ok)}#log{height:220px;font:12px/150% var(--mono);color:var(--text);background:var(--paper);box-shadow:var(--bevel-in);white-space:pre-wrap;word-break:break-word;flex:auto;margin:0;padding:4px 6px;overflow-y:auto}#log .sent{color:var(--title)}#log .recv{color:var(--text)}#log .info{color:var(--text-dim)}#log .error{color:var(--err)}.statusbar{gap:2px;margin-top:2px;display:flex}.statusbar .pane{box-shadow:var(--bevel-in-thin);white-space:nowrap;text-overflow:ellipsis;padding:2px 5px;overflow:hidden}.statusbar .hint{flex:auto}.taskbar{z-index:10;box-sizing:border-box;background:var(--face);height:28px;font:11px var(--ui);-webkit-user-select:none;user-select:none;box-shadow:inset 0 1px var(--hilite), inset 0 2px var(--light);align-items:center;gap:4px;padding:2px;display:flex;position:fixed;inset:auto 0 0}.taskbar .start{align-items:center;gap:3px;min-width:0;height:22px;padding:0 6px 0 3px;font-weight:700;display:flex}.taskbar .start svg{width:15px;height:14px;display:block}.taskbar .divider{width:2px;box-shadow:var(--bevel-out-thin);align-self:stretch;margin:1px 2px}.taskbar .task{min-width:140px;height:22px;box-shadow:var(--bevel-pressed);background:repeating-conic-gradient(#d8d8d8 0% 25%, var(--face) 0% 50%) 0 0 / 4px 4px;align-items:center;gap:4px;padding:0 8px;font-weight:700;display:flex}.taskbar .task svg{width:13px;height:13px;display:block}.taskbar .tray{height:22px;box-shadow:var(--bevel-in-thin);align-items:center;gap:6px;margin-left:auto;padding:0 6px;display:flex}.taskbar .tray svg{width:13px;height:13px;color:var(--text-dim);display:block}.paint{-webkit-user-select:none;user-select:none;width:max-content;max-width:100%}.paint svg{stroke-width:1px;width:16px;height:16px;display:block}.paint button{font:inherit;min-width:0;box-shadow:none;padding:0}.paint button:active:not(:disabled){box-shadow:none}.paint button:disabled{color:inherit;text-shadow:none}.paint .titlebar button{box-shadow:var(--bevel-out)}.paint .titlebar button:active{box-shadow:var(--bevel-pressed)}.paint .workspace{gap:3px;display:flex}.paint .toolbox{width:50px}.paint .toolbox .tools{grid-template-columns:repeat(2,25px);display:grid}.paint .toolbox .tool{width:25px;height:24px;box-shadow:var(--bevel-out);place-items:center;display:grid}.paint .toolbox .tool:disabled{color:var(--shadow)}.paint .toolbox .tool.active{box-shadow:var(--bevel-pressed);background:repeating-conic-gradient(#d8d8d8 0% 25%, var(--face) 0% 50%) 0 0 / 4px 4px}.paint .toolbox .tool.active svg{transform:translate(1px,1px)}.paint .toolbox .tool-options{box-sizing:border-box;height:72px;box-shadow:var(--bevel-in-thin);flex-direction:column;gap:1px;margin-top:3px;padding:3px;display:flex}.paint .toolbox .text-size{font-family:var(--mono);flex:1 1 0;place-items:center;line-height:1;display:grid}.paint .toolbox .text-size.active{background:var(--title);color:#fff}.paint .toolbox .live-toggle{box-shadow:var(--bevel-out);flex:none;margin-top:2px}.paint .toolbox .live-toggle.active{box-shadow:var(--bevel-pressed);background:repeating-conic-gradient(#d8d8d8 0% 25%, var(--face) 0% 50%) 0 0 / 4px 4px}.paint .canvas-well{box-shadow:var(--bevel-in);padding:2px;position:relative}.paint .canvas-well canvas{background:var(--paper);cursor:crosshair;touch-action:none;display:block}.paint .canvas-well canvas.typing{cursor:text}.paint .text-entry{resize:none;white-space:pre;-webkit-user-select:text;user-select:text;outline:1px dashed var(--dark);outline-offset:1px;background:0 0;border:none;margin:0;padding:0;position:absolute;overflow:hidden}.paint .palette{align-items:center;gap:6px;padding:4px 1px 3px;display:flex}.paint .palette .current{width:31px;height:30px;position:relative}.paint .palette .swatch-fg,.paint .palette .swatch-bg{width:16px;height:14px;box-shadow:var(--bevel-in-thin);position:absolute}.paint .palette .swatch-fg{z-index:1;background:var(--ink,#000);top:1px;left:1px}.paint .palette .swatch-bg{background:var(--paper);top:12px;left:12px}.paint .palette .swatches{grid-template-columns:repeat(4,17px);grid-auto-rows:15px;gap:1px;display:grid}.paint .palette .swatch{background:var(--ink);box-shadow:var(--bevel-in-thin)}.paint .palette .swatch.active{box-shadow:var(--bevel-in-thin), 0 0 0 1px var(--dark)}.paint .palette .palette-note{color:var(--text-dim)}.paint .statusbar{margin-top:0}.paint .statusbar .coords{width:62px}.paint .statusbar .plu{width:86px}.paint .statusbar .pen{width:104px}