.lesson-app{--lb-light: #efe6d9;--lb-dark: #7d5a3c;--lb-white: #f7f7f5;--lb-black: #26211c;--lb-select: #3b82f6;--lb-highlight: #f59e0b;--lb-cursor: #ef4444}.lesson-app .lb-board{position:relative;width:100%;aspect-ratio:1}.lesson-app .lb-grid{display:grid;grid-template-columns:repeat(var(--lb-n),1fr);width:100%;height:100%}.lesson-app .lb-sq{position:relative;aspect-ratio:1;background:var(--lb-light)}.lesson-app .lb-sq.lb-dark{background:var(--lb-dark)}.lesson-app .lb-sq:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:4px solid var(--lb-highlight);opacity:var(--lb-hl, 0);pointer-events:none}.lesson-app .lb-sq.lb-selected{outline:3px solid var(--lb-select);outline-offset:-3px}.lesson-app .lb-sq.lb-dot:before{content:"";position:absolute;top:38%;right:38%;bottom:38%;left:38%;border-radius:50%;background:#00000047;pointer-events:none}.lesson-app .lb-sq.lb-dimmed .lb-piece{opacity:.35}.lesson-app .lb-piece{position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:50%;background:var(--lb-black)}.lesson-app .lb-piece.lb-white{background:var(--lb-white)}.lesson-app .lb-piece.lb-king:after{content:"♛";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:60%;color:var(--lb-select)}.lesson-app .lb-cursor{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;border:3px solid var(--lb-cursor);pointer-events:none;z-index:2}.lesson-app .lb-cursor[hidden]{display:none}.lesson-app .lb-pulse{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--lb-cursor);pointer-events:none;z-index:2;animation:lb-pulse .4s ease-out forwards}@keyframes lb-pulse{to{transform:scale(2.4);opacity:0}}