@import"https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto:wght@900&display=swap";.pagerank{margin:0;background:#fdf6e3;color:#002b36;display:flex;font-family:Fira Mono,monospace}.sidebar{background:#eee8d5;padding:1rem;width:min(100%,max(500px,20vw));box-sizing:border-box;height:100vh;display:flex;flex-direction:column}.sidebar__buttons{display:flex;flex-direction:column;align-items:stretch;gap:1rem;padding:1rem}.sidebar__button{font-family:inherit;background:rgba(0,0,0,.1333333333);border:1px solid rgba(0,0,0,.2666666667);border-radius:3px;padding:.5rem 1rem;transition:background .2s ease-in-out}.sidebar__button:not([disabled]){cursor:pointer}.sidebar__button:not([disabled]):hover{background:rgba(0,0,0,.2666666667)}.sidebar__attr{flex-grow:999;display:flex;flex-direction:column;text-align:center;justify-content:flex-end}.graph{flex-grow:999;height:100vh}.graph:empty{display:flex;align-items:center;justify-content:center}.graph:empty:after{content:"Double click here to get started";font-size:1.5rem;color:#0004}.bubbles{position:relative;width:100%;display:block;overflow:hidden;background:#fdf6e3}.bubble{position:absolute;top:calc(var(--bubble-y) - var(--bubble-size) / 2);left:calc(var(--bubble-x) - var(--bubble-size) / 2);width:var(--bubble-size);height:var(--bubble-size);border-radius:50%;background:var(--bubble-colour);color:#002b36;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1;cursor:pointer;user-select:none}.bubble:hover{filter:brightness(120%)}.bubble--selected{outline:4px solid #002b36}.bubble__name{font-size:1.3rem}.bubble__score{font-size:.8rem;color:#fdf6e3}.arrow{--colour: #002b36;position:absolute;width:var(--arrow-length);height:5px;background:linear-gradient(to left,rgba(0,0,0,0) 5px,var(--colour) 5px);transform:rotate(calc(1 * var(--arrow-angle)));transform-origin:top left;top:calc(var(--arrow-y));left:calc(var(--arrow-x));cursor:pointer;display:flex;align-items:center;justify-content:flex-end;font-family:Roboto}.arrow--selected{--colour: #268bd2}.arrow:after{content:"";width:30px;height:30px;mask:url(/assets/arrowhead-3382be8f.svg);-webkit-mask:url(/assets/arrowhead-3382be8f.svg);background:var(--colour);filter:blur(1px)}