:root{--face:#c0c0c0;--hi:#fff;--sh:#808080;--dk:#000;--navy:#000080;--teal:#008080}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;font-family:Tahoma,"MS Sans Serif",Geneva,Verdana,sans-serif;font-size:12px;user-select:none;-webkit-user-select:none}
#root{height:100%}
.out{background:var(--face);border:2px solid;border-color:var(--hi) var(--dk) var(--dk) var(--hi);box-shadow:inset -1px -1px var(--sh),inset 1px 1px #dfdfdf}
.in{background:#fff;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);box-shadow:inset 1px 1px var(--dk)}
.btn{background:var(--face);border:2px solid;border-color:var(--hi) var(--dk) var(--dk) var(--hi);box-shadow:inset -1px -1px var(--sh);padding:3px 10px;min-height:23px;cursor:pointer;font:inherit;color:#000}
.btn:active,.btn.on{border-color:var(--dk) var(--hi) var(--hi) var(--dk);box-shadow:inset 1px 1px var(--sh);padding:4px 9px 2px 11px}
.btn:focus{outline:1px dotted #000;outline-offset:-5px}
.tbar{background:linear-gradient(90deg,#000080,#1084d0);color:#fff;font-weight:bold;padding:2px 3px;display:flex;align-items:center;gap:4px;cursor:move;touch-action:none}
.tbar.off{background:linear-gradient(90deg,#808080,#b5b5b5);color:#d0d0d0}
.tbtn{width:16px;height:14px;padding:0;min-height:0;font-size:9px;line-height:9px;font-weight:bold;display:flex;align-items:center;justify-content:center}
.icon{width:76px;text-align:center;color:#fff;cursor:pointer;padding:2px}
.icon img{width:32px;height:32px;margin:0 auto;image-rendering:pixelated}
.icon span{display:inline-block;padding:0 2px;margin-top:3px;line-height:1.2}
.icon.sel span{background:var(--navy);outline:1px dotted #ff0}
.icon.sel img{filter:sepia(1) hue-rotate(180deg) saturate(4) brightness(.7)}
.menu{position:absolute;z-index:99999}
.mi{padding:5px 20px 5px 6px;display:flex;gap:8px;align-items:center;cursor:pointer;white-space:nowrap;position:relative}
.mi:hover{background:var(--navy);color:#fff}
.mi img{width:24px;height:24px;image-rendering:pixelated}
.console{background:#000;color:#3f3;font-family:VT323,monospace;font-size:17px}
.bar{height:14px;display:flex;gap:2px;padding:2px}
.bar i{width:8px;background:var(--navy);display:block}
canvas{image-rendering:pixelated;display:block;touch-action:none}
.help a{color:#008000;text-decoration:underline;cursor:pointer}
.blink{animation:bl 1s steps(1) infinite}@keyframes bl{50%{opacity:0}}
.bootlogo{font-family:Silkscreen,monospace}
input[type=range]{accent-color:#000080}
.tip{position:absolute;background:#ffffe1;border:1px solid #000;padding:2px 5px;z-index:999999;pointer-events:none;white-space:nowrap}