*,*:before,*:after{box-sizing:border-box}*{margin:0}html,body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root,#__next{isolation:isolate}:root{--font-family: "IBM Plex Sans", Arial, Helvetica, sans-serif;--font-family-ui: "Alegreya Sans SC", Helvetica, sans-serif;--background-color: hsl(45, 55%, 96%);--background-color-gutter: hsl(48, 9%, 90%);--highlight-color: hsl(8, 81%, 46%);--neutral-color: hsl(8, 32%, 61%);--neutral-color-gray: hsl(12, 3%, 70%);--shadow-color: 26deg 58% 67%;--font-color: black;--button-hover-bg: var(--highlight-color);--button-hover-color: white}html,body{margin:0;min-height:100%;background-color:var(--background-color-gutter);color:var(--font-color);font-family:var(--font-family);overflow:hidden}h1,h2,h3{margin-bottom:.3rem}p,ul{margin-bottom:.8rem}blockquote{margin-inline-start:.5rem;border-inline-start:5px solid hsl(247,23%,70%);padding-inline-start:10px}a{color:var(--highlight-color)}a:hover,a:focus{font-weight:700}#app,#canvas{width:2000px;height:1500px}#canvas{background-image:radial-gradient(circle at 1px 1px,var(--neutral-color) 1px,transparent 0);background-size:40px 40px;background-position:20px 20px;background-color:var(--background-color)}svg{width:100%;height:100%;pointer-events:none;position:absolute}button{background-color:#fff;border:1px solid var(--highlight-color);min-width:30px}button:hover,button:focus{background-color:var(--button-hover-bg);color:var(--button-hover-color)}#modal{font-family:var(--font-family-ui);font-size:1.2rem;position:absolute;width:100vw;height:100vh;display:none;justify-content:center;background-color:#0000007f;z-index:999999999}#popup{top:30%;position:fixed;background-color:var(--background-color);min-width:25%;max-height:40%;padding:15px;display:flex;flex-direction:column}#popup ul{padding:10px 5px;display:flex;flex-direction:column;margin-block-end:0;gap:5px;overflow-y:scroll}#space-picker-input-wrapper{display:flex;flex-direction:row;margin-block-end:10px;justify-content:space-between;align-items:center;gap:10px}#space-picker-input-wrapper>input{width:100%;padding-inline-start:10px}#space-picker-input-wrapper>button{width:30px;height:100%}#space-header{font-family:var(--font-family-ui);font-size:1.3rem;display:flex;margin:0 auto;align-items:center;min-width:200px;position:fixed;top:5%;left:50%;transform:translate(-50%);z-index:9999999}#space-header::marker{display:none}#space-title{margin:0 auto;list-style:none;text-align:center;-webkit-user-select:none;user-select:none;background-color:#fff;border:1px solid var(--highlight-color);padding-block:5px;padding-inline:10px}#space-menu{padding-block-start:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-inline-start:0;gap:2px}.staggered>:nth-child(odd){transform:rotate(1deg)}.staggered>:nth-child(2n){transform:rotate(-1deg)}#space-menu button{padding:none;margin:none;list-style:none;width:100%;border:1px solid lightgray}summary:after{content:" ►";font-size:1rem}details[open] summary:after{content:" ▼"}#header-toggle{border:none;font-size:1rem}#footer{position:fixed;width:100%;bottom:0;display:flex;flex-direction:row;justify-content:flex-end;padding:15px;gap:.5rem}#footer button{border:1px solid var(--neutral-color-gray)}#footer button:hover,#footer button:focus{background-color:var(--neutral-color-gray)}.card-container{position:absolute;margin:0;min-width:200px;min-height:30px;width:fit-content;height:fit-content;max-width:300px;background-color:#fff;border:1px dashed var(--highlight-color);padding-block:.6em;padding-inline:.8em;line-height:1.5}.card-container:focus-visible{outline:none}.card-color{height:100%;width:.6rem;background-color:#fff;position:fixed;top:0;left:0}.card-actions{display:flex;flex-direction:row;padding:0;gap:5px;list-style:none;position:absolute;right:0;bottom:-40px;display:none}#card-colorpicker{display:none}.card-container.selected>.card-actions{display:flex}.card-action-button{height:30px;width:30px;background-color:#fff;border:1px solid var(--neutral-color-gray);text-align:center}.card-action-button svg{position:relative}.danger{border-color:red;color:red}.danger:hover{background-color:red;color:#fff}.card-text{overflow:auto;width:100%;height:100%;resize:none;border:none;font-family:var(--font-family);color:var(--font-color);display:none}.card-text-rendered{overflow:auto;-webkit-user-select:none;user-select:none;pointer-events:none;display:block;margin-inline:10px}.card-text-rendered>:first-child{margin-top:4px}.card-text:focus-visible{outline:none}.card-container:focus-within{outline:3px double var(--highlight-color)}.card-container.editing .card-text{-webkit-user-select:auto;user-select:auto;pointer-events:auto}.card-text-rendered a{pointer-events:auto}.card-corner{position:absolute;width:10px;height:10px;border-radius:50%}.card-corner[data-action=resize]{bottom:0;right:-5px;cursor:col-resize;border-radius:0;height:100%;z-index:1}.card-corner[data-action=link]{top:-5px;left:calc(50% - 5px)}.card-corner[data-action=stack]{bottom:-5px;left:calc(50% - 5px)}.card-corner[data-action=delete]{bottom:0;left:-5px;border:none;cursor:default}.card-corner[data-action=delete]:hover{border:none;color:red;font-weight:700}.grabbed{filter:drop-shadow(hsl(var(--shadow-color)) .1rem .1rem .3rem);cursor:grabbing}.selected{border:1px solid var(--highlight-color)}.resizing{cursor:col-resize}.stacking{outline:1px dashed blue}
