*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{overflow:hidden;font-family:Arial,Helvetica,sans-serif;color:#000;background:#fff}button{font:inherit}.app-shell{position:relative;width:100vw;height:100vh;overflow:hidden;background:#fff}.circle-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.circle-node{cursor:pointer}.bridge{pointer-events:none}.tool-panel{position:absolute;left:43px;top:318px;width:301px;height:458px;border-radius:10px;background:#0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:33px 20px 23px;pointer-events:auto}.pattern-row{display:flex;align-items:center;height:24px;gap:4px;font-size:16px;line-height:14px}.pattern-row span{width:61px;margin-left:5px}.pattern-row button{height:24px;min-width:27px;padding:0 5px;border:0;border-radius:5px;color:#000;background:transparent;line-height:14px;cursor:pointer;transition:color .16s ease,background-color .16s ease,transform .16s ease}.pattern-row button.active{color:#fff;background:#000}.pattern-row button:focus-visible,.panel-actions button:focus-visible{outline:2px solid #000;outline-offset:2px}.pattern-row button:active,.panel-actions button:active{transform:scale(.98)}.panel-actions{position:absolute;left:20px;right:19px;bottom:23px;display:grid;gap:12px}.panel-actions button{width:262px;height:34px;border:0;border-radius:5px;color:#000;background:transparent;font-size:16px;line-height:14px;cursor:pointer;transition:background-color .16s ease,transform .16s ease}.panel-actions button:hover,.pattern-row button:not(.active):hover{background:#ffffff47}@media(max-width:700px),(max-height:820px){.tool-panel{left:16px;top:auto;bottom:16px;width:min(301px,calc(100vw - 32px));height:188px}.panel-actions button{width:100%}}