@layer components{.board-axis{font-family:var(--font-sans);font-size:10px;fill:var(--board-ink);text-anchor:middle}.research-sprite{image-rendering:pixelated}.research-board{display:block;width:100%;max-width:720px;margin:0 auto;overflow:visible}.research-axis-row{dominant-baseline:central}.research-square{cursor:pointer;outline:none}.research-square-far image{opacity:.32}.research-square-outline{fill:none;stroke:var(--gold);stroke-width:1.6;pointer-events:none}.research-square-level{font-family:var(--font-sans);font-size:7.5px;font-weight:700;fill:#f3f7ff;text-anchor:end;paint-order:stroke;stroke:var(--board-deep);stroke-width:2.4px;stroke-linejoin:round;pointer-events:none}.research-square-level.research-square-maxed{fill:var(--gold)}.research-square-focus{fill:none;stroke:none;pointer-events:none}.research-square:hover .research-square-focus{stroke:var(--board-ink);stroke-width:1}.research-square:focus-visible .research-square-focus{stroke:#fff;stroke-width:1.8}.research-square-selected{pointer-events:none}.research-key{width:12px;height:12px;border-radius:2px;display:inline-block;flex-shrink:0}.research-key-open{border:2px solid var(--gold);background:#5d5d5d}.research-key-far{background:#8a8a8a;opacity:.4}.research-shapes{pointer-events:none}.research-shape{opacity:.75}.research-shape-outline{fill:none;stroke:#fff;stroke-width:1.5;stroke-dasharray:4 3;stroke-linejoin:round}.research-key-outline{border:1.5px dashed #fff;background:var(--board);outline:1px solid var(--board)}.research-observations{max-width:640px}.research-observation{cursor:pointer;outline:none}.research-observation-sprite{opacity:.5}.research-observation-far image{opacity:.32}.research-observation-ring{fill:transparent;stroke:none}.research-observation:hover .research-observation-ring{stroke:var(--board-ink);stroke-width:1}.research-observation-ring[data-selected]{fill:#ffffff14;stroke:var(--gold);stroke-width:1.6}.research-observation:focus-visible .research-observation-ring{stroke:#fff;stroke-width:1.8}.research-lenses{pointer-events:none}.research-observation-level{font-size:9px}.research-key-faint{opacity:.32}.research-board[role=img] .research-square,.research-board[role=img] .research-observation{cursor:default}.research-board[role=img] .research-square:hover .research-square-focus,.research-board[role=img] .research-observation:hover .research-observation-ring:not([data-changed]){stroke:none}.research-plan-key{position:relative;flex-shrink:0;width:16px;height:14px;border-radius:2px;background:var(--board)}.research-plan-key:after{content:"";position:absolute}@media(min-width:951px){.research-plan-viewer .research-board{max-height:calc(100vh - 330px);min-height:260px}}.research-observation-ring[data-changed],.research-observation:hover .research-observation-ring[data-changed]{fill:#7ee0a41a;stroke:var(--board-gain);stroke-width:1.4;stroke-dasharray:3 2}.research-observation-ring[data-changed][data-selected]{stroke:var(--gold);stroke-width:1.6;stroke-dasharray:none}.research-key-changed{border:1.5px dashed var(--board-gain);background:var(--board);outline:1px solid var(--board)}.research-square-changed{fill:#7ee0a41a;stroke:var(--board-gain);stroke-width:1.4;stroke-dasharray:3 2;pointer-events:none}@media(max-width:680px){.research-square-level{font-size:9px}.research-observation-level{font-size:11px}}.research-points-outline{fill:none;pointer-events:none}.research-points-planned{stroke:var(--gold);stroke-width:1.6}.research-points-done{stroke:var(--board-gain);stroke-width:1.4}.research-points-later{stroke:#e6eefc;stroke-width:1.2;stroke-dasharray:3 2.5}.research-points-tag{pointer-events:none;transform-box:fill-box;transform-origin:0 0}.research-points-tag rect{fill:var(--gold);stroke:var(--board-deep);stroke-width:.8}.research-points-tag text{font-family:var(--font-sans);font-size:7px;font-weight:700;fill:#332617;text-anchor:middle;dominant-baseline:central;font-variant-numeric:tabular-nums}.research-points-key-planned:after{inset:2px 3px;border:1.5px solid var(--gold);border-radius:2px}.research-points-key-select:after{inset:1px 2px;border:2px solid #f3f7ff;border-radius:2px}.research-points-key-done:after{inset:2px 3px;border:1.5px solid var(--board-gain);border-radius:2px}.research-points-key-later:after{inset:2px 3px;border:1px dashed #e6eefc;border-radius:2px}@media(max-width:680px){.research-points-tag{transform:scale(1.25)}}}
