:root[data-game=kropki]{--brand-100:#ede9fe;--brand-300:#c4b5fd;--brand-400:#8b5cf6;--brand-text:#000}.kropki-frame{flex-shrink:0;width:min(100%,420px,100svh - 208px);min-width:245px}.kropki-board{aspect-ratio:1;flex-shrink:0;width:100%}.kropki-cell{fill:#f0f0f0}.dark .kropki-cell{fill:#29313f}.kropki-finger{aspect-ratio:1;opacity:.2;border-radius:50%;width:34%;margin-top:-17%;margin-left:-17%}.kropki-finger[data-mouse=true]{width:17%;margin-top:-8.5%;margin-left:-8.5%}