*,*:before,*:after{box-sizing:border-box}:root{color:#18181b;background:#f4f4f5;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:16px;line-height:1.4}body{overflow:hidden;color:#18181b;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;width:100vw;height:100vh;margin:0}.canvas-container{position:absolute;width:100vw;height:100vh;inset:0}.canvas-container canvas{width:100%;height:100%}button,input,select{font:inherit}button,input[type=submit]{color:#18181b;cursor:pointer;background:#fff;border:1px solid #d4d4d8;border-radius:6px;min-height:2rem;padding:.35rem .7rem;transition:background-color .12s,border-color .12s,box-shadow .12s}button:hover,input[type=submit]:hover{background:#f4f4f5;border-color:#a1a1aa}button:active,input[type=submit]:active{background:#e4e4e7}button:focus-visible{outline:2px solid #71717a;outline-offset:2px}input:focus-visible{outline:2px solid #71717a;outline-offset:2px}select:focus-visible{outline:2px solid #71717a;outline-offset:2px}input:not([type=submit]),select{color:#18181b;background:#fff;border:1px solid #d4d4d8;border-radius:6px;min-width:0;min-height:2rem;padding:.3rem .55rem}input.is-invalid,select.is-invalid{background:#fff7f7;border-color:#dc2626}select{max-width:100%}p{margin:0}hr{background:#e4e4e7;border:0;height:1px;margin:.25rem 0}.points-container,.line-container,.line-intersect{z-index:1;backdrop-filter:blur(10px);background:#fafafaeb;border:1px solid #d4d4d8e6;border-radius:8px;box-shadow:0 12px 32px #18181b1f}.points-container,.line-container{position:absolute;overflow:auto;width:min(22rem,50vw - 1.5rem);max-height:calc(100vh - 8rem);padding:.75rem;top:.5rem}.points-container{right:.5rem}.line-container{left:.5rem}.points-container ul,.line-container ul{display:flex;list-style:none;flex-direction:column;gap:0;margin:0;padding:0}.points-container li,.line-container li{display:flex;color:#3f3f46;overflow-wrap:anywhere;border-radius:6px;justify-content:space-between;align-items: center;gap:.75rem;min-height:2rem;padding:.15rem .25rem}.points-container li:hover,.line-container li:hover{background:#f4f4f5e6}.points-container li button,.line-container li button{color:#52525b;flex:none;min-height:1.75rem;padding:.2rem .55rem}form{display:grid;gap:.55rem}label{display:grid;grid-template-columns:max-content minmax(0,1fr);color:#3f3f46;align-items: center;gap:.5rem}.line-container label{grid-template-columns:max-content minmax(4rem,1fr)max-content minmax(4rem,1fr)}form input[type=submit]{justify-self:start}.form-status{color:#52525b;min-height:1.4em}.line-intersect{position:absolute;width:auto;padding:.75rem;bottom:.5rem;left:.5rem;right:.5rem}.line-intersect form{display:flex;color:#3f3f46;flex-wrap:wrap;align-items: center;gap:.5rem}.line-intersect .form-status{flex:1 0 100%}.line-intersect p{display:flex;color:#3f3f46;flex-wrap:wrap;align-items: center;gap:.5rem;margin:.3rem}.line-intersect>button{margin-top:.65rem}@media (max-width:760px){body{overflow:auto}.points-container,.line-container{width:calc(100vw - 2rem);max-height:32vh}.line-container{top:.5rem;left:.5rem;right:.5rem}.points-container{top:calc(32vh + 2rem);left:.5rem;right:.5rem}.line-container label,label{grid-template-columns:1fr;gap:.35rem}.line-intersect{bottom:.5rem;left:.5rem;right:.5rem}}
