.graph-game .graph-workspace{grid-template-columns:minmax(0,1fr) minmax(10rem,.46fr);align-items:center;gap:1rem;margin-top:.8rem;display:grid}.graph-game .graph-board-panel,.graph-game .graph-target-panel{min-width:0}.graph-game .graph-board-panel{justify-self:center;width:100%;max-width:30rem}.graph-game .graph-target-panel{border-left:1px solid var(--color-border);text-align:center;padding-left:.9rem}.graph-game .graph-target-panel h2{font:.9rem var(--font-ui);color:var(--color-muted);margin:0}.graph-game #shot-count{text-align:center;font-family:var(--font-ui)}.graph-game .graph-canvas{aspect-ratio:1;touch-action:manipulation;width:100%;position:relative}.graph-game .graph-svg{width:100%;height:100%;display:block;overflow:visible}.graph-game .graph-line{stroke:#b6c4bb;stroke-width:2.8px;pointer-events:none}.graph-game .graph-canvas[data-interactive=true] .graph-line{pointer-events:stroke;cursor:pointer}.graph-game .graph-canvas[data-interactive=true] .graph-line:hover{stroke:var(--color-accent)}.graph-game .graph-static-node{fill:var(--color-surface-2);stroke:var(--color-accent);stroke-width:2px}.graph-game .graph-node-label{fill:var(--color-heading);font:600 16px var(--font-ui)}.graph-game .graph-target-panel .graph-node-label{font-size:26px}.graph-game .graph-canvas button{cursor:pointer;touch-action:manipulation;background:0 0;border:0;margin:0;padding:0;position:absolute}.graph-game .graph-canvas button:disabled{opacity:1;cursor:default}.graph-game .graph-edge{z-index:1;border-radius:3px;height:44px}.graph-game .graph-edge:disabled{pointer-events:none}.graph-game .graph-edge:after{content:"";background:var(--color-accent);opacity:0;border-radius:2px;height:4px;position:absolute;inset:calc(50% - 2px) 0 auto}.graph-game .graph-edge:focus-visible:after,.graph-game .graph-edge.is-highlighted:after{opacity:1}.graph-game .graph-node{z-index:2;aspect-ratio:1;width:17.5%;min-width:44px;min-height:44px;color:var(--color-heading);font:600 clamp(1rem, 2.5vw, 1.2rem) var(--font-ui);isolation:isolate;border-radius:50%;transform:translate(-50%,-50%)}.graph-game .graph-node:before{content:"";z-index:-1;border:2px solid var(--color-accent);background:var(--color-surface-2);border-radius:50%;position:absolute;inset:12.5%}.graph-game .graph-node:not(:disabled):hover:before,.graph-game .graph-node:focus-visible:before,.graph-game .graph-node.is-highlighted:before{background:var(--color-surface);box-shadow:0 0 0 3px var(--color-accent)}.graph-game #graph-board [data-tutorial-focus]{outline:none}.graph-game #graph-board .graph-node[data-tutorial-focus]{color:#1b2822}.graph-game #graph-board .graph-node[data-tutorial-focus]:before{background:#f2d572;border-color:#f2d572;box-shadow:0 0 16px #f2d5728c}.graph-game #graph-board .graph-edge[data-tutorial-focus]:after{opacity:1;background:#f2d572;box-shadow:0 0 9px #f2d572cc}.graph-game .graph-animation{pointer-events:none}.graph-game .graph-animation-dot{fill:#f2d572;filter:drop-shadow(0 0 3px #f2d572b3)}.graph-game .graph-animation-edge{stroke:#f5f5f2;stroke-width:3.2px;stroke-linecap:round}.graph-game .graph-animation-edge.is-removing{stroke:#b6c4bb;stroke-width:2.8px}.graph-game .graph-node.is-source:before{border-color:#f2d572;box-shadow:0 0 16px #f2d57273}.graph-game .graph-node.is-affected:before{background:#3d3825;border-color:#f2d572;box-shadow:0 0 12px #f2d57259}.graph-game .graph-circuit-panel{box-sizing:border-box;border:1px solid var(--color-border);background:var(--color-surface-2);border-radius:.75rem;width:min(100%,28rem);margin:1.3rem auto 1.2rem;padding:.85rem 1rem}.graph-game .graph-circuit-panel>h2{font:.9rem var(--font-ui);color:var(--color-heading);justify-content:space-between;align-items:center;gap:.5rem;margin:0 0 .65rem;display:flex}.graph-game .graph-circuit-badge{color:var(--color-accent);background:#9ad9d114;border-radius:1rem;padding:.2rem .45rem;font-size:.72rem}.graph-game #circuit-scroll{background:0 0;border:0}.graph-game #clifford-circuit{max-width:100%;height:auto;margin:0 auto;display:block}.graph-game .graph-circuit-wire{stroke:#b6c4bb;stroke-width:1.4px}.graph-game .graph-wire-label{fill:var(--color-muted);font:11px var(--font-ui);opacity:.7}.graph-game .graph-state-label{fill:var(--color-muted);font:14px system-ui,sans-serif}.graph-game #show-gate-legend{margin-top:.7rem}.gate-legend-dialog h2{padding-right:1.5rem}.gate-legend{margin:.8rem 0 0;padding-left:1.3rem}.gate-legend li{padding-block:.2rem}.gate-legend svg{vertical-align:middle;margin-right:.65rem}.graph-game .graph-editor-controls{font-family:var(--font-ui);flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-block:.75rem;display:flex}.graph-game .graph-editor-controls .button{padding:.4rem .65rem;font-size:.85rem}.graph-game .graph-editor-controls select{flex:0 8rem;min-height:2.75rem}.graph-game .custom-controls{font:.9rem var(--font-ui);flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;margin:1rem auto 0;display:flex}.graph-game .custom-controls select{flex:0 9rem;min-height:44px}@media (width<=600px){.graph-game .graph-workspace{grid-template-columns:minmax(0,1fr);gap:.2rem}.graph-game .graph-target-panel{border-left:0;border-bottom:1px solid var(--color-border);grid-row:1;justify-content:center;align-items:center;gap:.65rem;padding:0 0 .3rem;display:flex}.graph-game .graph-target-panel .graph-canvas{flex-shrink:0;width:10rem}.graph-game .graph-board-panel{max-width:25rem}.graph-game .graph-circuit-panel{margin-top:.9rem}.graph-game .graph-editor-controls .button{min-height:2.75rem}}
