#toolbox{--offset-x: 10px;position:fixed;top:25vh;left:var(--offset-x);z-index:1000;background:#fff;color:#000;padding:10px;border:1px solid #ccc;border-radius:4px 0 4px 4px;transform:translate(calc(-100% - var(--offset-x)));transition:transform .3s ease-in}.toggle{cursor:pointer;position:absolute;left:100%;background:#fff;padding:.5ch;border-radius:0 4px 4px 0;top:-1px;margin:0;border:1px solid #ccc;border-left:none}.toggle:after{content:"❯"}#toolbox:has(#toolbox-toggle:checked){transform:translate(0)}#toolbox:has(#toolbox-toggle:checked) .toggle:after{content:"❮"}#toolbox:has(#template-1:checked)~#canvases #canvas-1,#toolbox:has(#template-2:checked)~#canvases #canvas-2,#toolbox:has(#template-3:checked)~#canvases #canvas-3{display:block}#toolbox:has(#template-1:checked)~#canvases{--selected-index: 0}#toolbox:has(#template-2:checked)~#canvases{--selected-index: 1}#toolbox:has(#template-3:checked)~#canvases{--selected-index: 2}.canvas{width:100vw;height:100vh;border:none;display:none}.canvas.selected{display:block}body,html{margin:0;padding:0;overflow:hidden}