*{box-sizing:border-box;-webkit-user-select:none;user-select:none}html{overflow:hidden;font-family:Roboto,sans-serif}html,body{margin:0;padding:0}.canvas{display:grid;grid-template-columns:auto 1fr;height:calc(100vh - 1em);margin:.5em;box-sizing:border-box}.header{position:absolute;right:1em;top:1em;margin:0;z-index:9999}.card{display:grid;width:min(15em,30vw);grid-template-areas:"image title" "image author";grid-template-columns:48px 1fr;gap:.1em .5em;border:1px solid black;background-color:#fff;align-items:center;border-radius:3px;padding:.3em;margin:.4em}.canvas.inactive{opacity:.5}.canvas:not(.inactive) .card{cursor:pointer}.author{color:#666;font-size:.8em}.workspace{background-color:#eee;border:3px dotted #777;border-radius:4px;overflow:hidden;display:flex}.popup{position:fixed;background-color:#0008;top:0;left:0;height:100vh;width:100vw;z-index:20}.popup>div{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#fff;padding:1em;border-radius:4px}.sidebar{overflow-y:scroll;overflow-x:hidden;padding-right:.1em}