.dots-game{min-width:0;max-width:1000px;margin:auto}.dots-game h1{margin:12px 0 4px;font-size:clamp(20px,3vw,28px)}.dots-game>a{align-items:center;gap:6px;display:inline-flex}.dots-tools,.dots-filters{flex-wrap:wrap;gap:6px;margin:10px 0;display:flex}.dots-tools button{border:1px solid var(--border);background:var(--surface);width:44px;height:44px;color:var(--text);border-radius:8px;justify-content:center;align-items:center;padding:0;display:flex}.dots-tools button[aria-pressed=true],.dots-filters button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground,#fff)}.dots-tools button:disabled{opacity:.35}.dots-tools button:focus-visible,.dots-point:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.dots-stage{border:1px solid var(--border);touch-action:none;overscroll-behavior:contain;isolation:isolate;background:#fff;border-radius:8px;width:100%;height:min(62dvh,650px);min-height:240px;position:relative;overflow:hidden}.dots-stage svg{transform-origin:50%;touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%}.dots-point{cursor:pointer;outline:none}.dots-visible{fill:#fff;stroke:#455174}.dots-point text{fill:#172039;pointer-events:none;font-family:inherit;font-weight:600}.dots-next .dots-visible{fill:#e0e7ff;stroke:#4338ca}.dots-connected .dots-visible{fill:#edf0f5;stroke:#98a2b3}.dots-connected text{fill:#697386}.dots-reveal{animation:.25s ease-out dots-reveal}.dots-loading{background:var(--surface);color:var(--text);place-content:center;display:grid;position:absolute;inset:0}.dots-hint{min-height:40px;color:var(--muted);font-size:13px}.dots-complete{flex-wrap:wrap;align-items:center;gap:12px;padding:8px 0;display:flex}.dots-complete h2{width:100%;margin:0;font-size:18px}.dots-complete a,.dots-complete button,.dots-filters button{border:1px solid var(--border);border-radius:8px;min-height:44px;padding:10px 14px}.dots-complete a:first-of-type{background:var(--primary);color:var(--primary-foreground,#fff)}.dots-fullscreen{z-index:1050;background:var(--surface);padding:calc(12px + env(safe-area-inset-top)) 16px calc(12px + env(safe-area-inset-bottom));max-width:none;position:fixed;inset:0;overflow:auto}.dots-fullscreen .dots-stage{height:calc(100dvh - 290px)}.dots-reset-backdrop{z-index:1200;background:#0f172acc;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.dots-reset{background:var(--surface);max-width:420px;color:var(--text);border:1px solid var(--border);border-radius:8px;padding:20px}.dots-reset button{min-height:44px;margin:4px;padding:8px 16px}.dots-card h3{font-size:16px}.dots-card p{font-size:13px}@keyframes dots-reveal{0%{opacity:0}to{opacity:1}}@media (max-width:767px){.dots-tools{gap:4px}.dots-stage{height:clamp(240px,100dvh - 370px,500px)}.dots-tools button{width:44px}.dots-fullscreen{padding-inline:10px}}@media (prefers-reduced-motion:reduce){.dots-reveal{animation:none}}
