body{font-family:IBM Plex Mono,monospace;background-color:#1a1a1a;color:#f0f0f0;margin:0;padding:20px}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px}.choices{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px}.choices button{font-family:inherit;background-color:#333;color:#f0f0f0;padding:12px 24px;border:1px solid #555;cursor:pointer;font-size:16px;border-radius:8px;transition:background-color .3s ease,transform .1s ease}.choices button:hover{background-color:#444}.choices button:disabled{opacity:.4;cursor:not-allowed}.choices button:disabled:hover{background-color:#333}.choices button:active{transform:scale(.98)}.menu{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:20px}.menu-row{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.grid-container{width:100%;overflow-x:auto;margin-bottom:20px;display:flex;justify-content:center}fieldset{border:1px solid #555;border-radius:8px;padding:15px;display:flex;flex-wrap:wrap;gap:15px;align-items:center}legend{padding:0 10px;color:#f0f0f0}.choices .startStyling{background-color:#007bff;border-color:#0056b3}.choices .endStyling{background-color:#dc3545;border-color:#b21f2d}.choices .obsStyling{background-color:#6c757d;border-color:#5a6268;color:#fff}.choices .runStyling{background-color:#28a745;border-color:#1e7e34}.node-data{padding:0;list-style-type:none}.node-data li{display:flex;align-items:center;margin-bottom:10px;font-size:14px}.node-data .color-box{width:20px;height:20px;margin-right:10px;border-radius:4px}.node-data .start{background-color:#007bff}.node-data .end{background-color:#dc3545}.node-data .obstacle{background-color:#6c757d}.node-data .visited{background-color:#ffc107}.node-data .shortest-path{background-color:#28a745}.node-data .unexplored{background-color:#f8f9fa}.node-data .current{background-color:#6f42c1}.grid-wrapper{display:flex;flex-direction:column;align-items:center}.status-line{font-size:14px;color:#f0f0f0;opacity:.85;text-align:center;margin:10px 0 0}.speed-control{display:flex;align-items:center;gap:10px}.speed-control input[type=range]{width:90px;accent-color:#007bff;cursor:pointer}.speed-control .speed-value{font-size:14px;min-width:62px;text-align:right}.node{position:absolute;background-size:100% 100%;background-repeat:no-repeat;image-rendering:pixelated;cursor:pointer;transform:translateY(0);transition:filter .2s cubic-bezier(.22,.61,.36,1),transform .25s cubic-bezier(.22,.61,.36,1)}.node:hover{filter:brightness(1.25);z-index:5}.node-overlay{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .2s ease}.node-current{transform:translateY(-14px);filter:drop-shadow(0 14px 6px rgba(0,0,0,.45));z-index:6}.node-current .node-overlay{opacity:1;background:radial-gradient(circle,#ffb020a6,#ffb02000 70%);animation:currentPulse .6s ease-in-out infinite alternate}@keyframes currentPulse{0%{opacity:.6}to{opacity:1}}.node-marker{position:absolute;left:50%;bottom:58%;width:14px;height:14px;transform:translate(-50%);pointer-events:none}.node-marker:before{content:"";position:absolute;left:50%;bottom:4px;width:3px;height:16px;background:var(--marker-color);transform:translate(-50%);border-radius:2px;box-shadow:0 0 4px #00000080}.node-marker:after{content:"";position:absolute;left:50%;bottom:16px;width:14px;height:14px;background:var(--marker-color);border:2px solid rgba(255,255,255,.85);border-radius:50% 50% 50% 0;transform:translate(-50%) rotate(-45deg);box-shadow:0 2px 4px #00000080}.node-start .node-marker{--marker-color: #2f9bff}.node-end .node-marker{--marker-color: #ff4d5e}.grid{position:relative;margin:20px auto 0}.grid-trace{position:absolute;left:0;top:0;pointer-events:none;z-index:2;overflow:visible}.trace-explored{stroke:#ffb020d9;stroke-width:2;stroke-linecap:round}.trace-path{stroke:#2ecc59;stroke-width:3.5;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(46,204,89,.8))}.game-tree-backdrop{position:fixed;inset:0;background:#000000a6;display:flex;align-items:center;justify-content:center;z-index:100;padding:24px;box-sizing:border-box}.game-tree-panel{width:100%;max-width:1100px;max-height:90vh;background:#1a1a1a;border:1px solid #555;border-radius:8px;padding:15px 20px 20px;box-sizing:border-box;box-shadow:0 12px 40px #00000080;display:flex;flex-direction:column}.game-tree-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:12px}.game-tree-close{font-family:inherit;background:transparent;color:#f0f0f0;border:1px solid #555;width:30px;height:30px;border-radius:6px;cursor:pointer;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease}.game-tree-close:hover{background-color:#444}.game-tree-header h2{margin:0;font-size:16px;font-weight:600;color:#f0f0f0}.game-tree-controls{display:flex;align-items:center;gap:10px;margin-bottom:12px}.game-tree-controls button{font-family:inherit;background-color:#333;color:#f0f0f0;padding:6px 16px;border:1px solid #555;cursor:pointer;font-size:14px;border-radius:6px;transition:background-color .2s ease}.game-tree-controls button:hover{background-color:#444}.game-tree-controls input[type=range]{width:160px;accent-color:#007bff;cursor:pointer}.game-tree-step{font-size:13px;opacity:.75;min-width:64px;text-align:right}.game-tree-canvas{position:relative;width:100%;flex:1 1 auto;min-height:320px;overflow:hidden;border:1px solid #333;border-radius:6px;background:#161616;cursor:grab;touch-action:none}.game-tree-canvas:active{cursor:grabbing}.game-tree-viewport{position:absolute;top:12px;left:12px;display:flex;align-items:flex-start;transform-origin:0 0}.game-tree-subtree{display:flex;flex-direction:column}.game-tree-sublabel{font-size:12px;opacity:.6;margin-bottom:6px}.tree-node{fill:#8d99a6;stroke:#161616;stroke-width:1}.tree-node-root{fill:#007bff;stroke:#161616;stroke-width:1.5}
