body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f7fa;color:#333;height:100vh;width:100vw;overflow:hidden}html{overflow:hidden;height:100%;width:100%}.App{max-width:100%;height:100vh;margin:0 auto;padding:10px;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column}button{transition:all .2s ease}button:hover{opacity:.9;transform:translateY(-1px)}button:active{transform:translateY(1px)}input[type=text],input[type=number]{transition:all .2s ease;border:1px solid #ddd}input[type=text]:focus,input[type=number]:focus{border-color:#3498db;outline:none;box-shadow:0 0 0 2px #3498db33}.visualization-container{display:flex;justify-content:center;align-items:center;margin:10px 0;flex:1;min-height:0;overflow:hidden}@media (max-width: 768px){.App{padding:10px}h1{font-size:20px;margin:5px 0}h2{font-size:18px;margin:5px 0}button{padding:6px 10px;font-size:14px}input[type=text],input[type=number]{padding:4px 6px;font-size:14px}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,-20px)}50%{opacity:1;transform:translate(-50%,5px)}to{opacity:1;transform:translate(-50%)}}@keyframes toastOut{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}@keyframes dicePulse{0%{transform:rotate(0)}20%{transform:rotate(10deg) scale(1.1)}40%{transform:rotate(-10deg) scale(1.1)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0)}}.node{animation:fadeIn .5s ease-out}.dice-button{padding:8px 12px;background-color:#16a085;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 4px #0000001a;position:relative;overflow:hidden}.dice-button:hover{background-color:#1abc9c;transform:scale(1.05);box-shadow:0 4px 8px #00000026}.dice-button:active{transform:scale(.95)}.dice-icon{display:inline-block;animation:dicePulse 1.5s infinite}.toast-notification{position:absolute;top:-50px;left:50%;transform:translate(-50%);background-color:#3498dbe6;color:#fff;padding:8px 16px;border-radius:4px;box-shadow:0 2px 10px #0003;z-index:100;font-weight:700;animation:toastIn .5s forwards}.toast-notification.hiding{animation:toastOut .5s forwards}@keyframes slowPointerPulse{0%{transform:translateY(-2px);opacity:.9}50%{transform:translateY(-4px);opacity:1}to{transform:translateY(-2px);opacity:.9}}@keyframes fastPointerPulse{0%{transform:translateY(2px);opacity:.9}50%{transform:translateY(4px);opacity:1}to{transform:translateY(2px);opacity:.9}}@keyframes fastPointerStepOne{0%{transform:translate(-15px);opacity:.8}40%{transform:translate(0);opacity:1}to{transform:translate(0);opacity:.9}}@keyframes fastPointerStepTwo{0%{transform:translate(0);opacity:.9}40%{transform:translate(15px);opacity:1}to{transform:translate(0);opacity:.9}}.slow-pointer-indicator{animation:slowPointerPulse 2s infinite;filter:drop-shadow(0 -2px 5px rgba(22,160,133,.5))}.fast-pointer-indicator{animation:fastPointerPulse 2s infinite;filter:drop-shadow(0 2px 5px rgba(192,57,43,.5))}.fast-step-one{animation:fastPointerStepOne 2s forwards}.fast-step-two{animation:fastPointerStepTwo 2s forwards}.pointer-focus{stroke-width:3px;animation:pointerFocus 1s infinite alternate}@keyframes pointerFocus{0%{stroke-width:2.5px;filter:drop-shadow(0 0 2px rgba(0,0,0,.3))}to{stroke-width:4px;filter:drop-shadow(0 0 6px rgba(0,0,0,.5))}}.fast-pointer-path{stroke-dasharray:5;animation:dashAnimation 1s linear infinite}@keyframes dashAnimation{to{stroke-dashoffset:-10}}.pointer-movement-path path{transition:all .5s ease}.pointer-movement-path text{font-weight:700;filter:drop-shadow(0 1px 1px rgba(0,0,0,.2))}@keyframes pathHighlight{0%,to{stroke-width:1.5px;opacity:.8}50%{stroke-width:2px;opacity:.9}}@keyframes stepLabelPulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.pointer-movement-path text{animation:stepLabelPulse 1.5s ease-in-out infinite}.pointer-movement-path path.animated-path{animation:pathHighlight 2s infinite}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
