.course-training-board{aspect-ratio:1;isolation:isolate;user-select:none;background:#1c1713;width:100%;position:relative}.course-board-background{z-index:0;object-fit:cover;image-rendering:auto;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.course-board-square{z-index:2;appearance:none;background:0 0;border:0;border-radius:0;outline:none;width:12.5%;height:12.5%;padding:0;position:absolute}.course-board-square:before{z-index:0;content:"";pointer-events:none;border-radius:16%;transition:background-color .12s,box-shadow .12s;position:absolute;inset:5%}.course-board-square[data-selected]:before{background:#22c55e57;box-shadow:inset 0 0 0 3px #15803db8}.course-board-square[data-expected]:before{box-shadow:inset 0 0 0 4px #4ade8080}.course-board-square[data-invalid]:before{background:#ef44446b;box-shadow:inset 0 0 0 4px #b91c1cbf}.course-board-square:focus-visible:before{box-shadow:inset 0 0 0 4px #ffffffe6,0 0 0 3px #f97316e6}.course-board-piece{z-index:3;object-fit:contain;image-rendering:auto;touch-action:none;cursor:grab;filter:none;will-change:transform;width:100%;height:100%;display:block;position:relative}.course-board-piece:active{cursor:grabbing}.course-board-arrow{z-index:5;pointer-events:none;filter:drop-shadow(0 3px 4px #15803d3d);width:100%;height:100%;position:absolute;inset:0;overflow:visible}.course-board-arrow line{stroke:#4ade80;stroke-width:1.8px;stroke-linecap:round;opacity:.96}.course-board-arrow polygon{fill:#4ade80;opacity:.96}.course-board-ranks,.course-board-files{z-index:6;color:#1c17138a;pointer-events:none;font-size:clamp(.55rem,1vw,.72rem);font-weight:700;line-height:1;display:flex;position:absolute}.course-board-ranks{inset-block:.4rem;flex-direction:column;justify-content:space-between;left:.35rem}.course-board-files{inset-inline:.55rem;justify-content:space-between;bottom:.35rem}.course-preview-control{border-radius:.75rem;justify-content:center;align-items:center;min-height:2.5rem;font-size:1.15rem;transition:color .15s,background-color .15s,opacity .15s;display:inline-flex}.course-preview-control:hover:not(:disabled){color:var(--foreground);background:color-mix(in srgb, var(--muted) 70%, transparent)}.course-preview-control:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.course-preview-control:disabled{cursor:not-allowed;opacity:.35}@media (prefers-reduced-motion:reduce){.course-board-square:before,.course-preview-control{transition:none}}