.fr-wrap{position:relative;aspect-ratio:7 / 6;touch-action:manipulation}.fr-board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(6,1fr);gap:3%;padding:2.5%;border-radius:var(--radius-md);background:var(--primary-30)}.fr-slot{position:relative;border-radius:50%;background:var(--primary-95);box-shadow:inset 0 3px 4px rgba(0,0,0,0.25);overflow:hidden}.fr-disc{position:absolute;inset:0;border-radius:50%;animation:fr-drop calc(0.12s + var(--from,0) * 0.07s) ease-in}.fr-disc--x{background:radial-gradient(circle at 38% 35%,var(--secondary-80),var(--secondary-seed));box-shadow:inset 0 -3px 0 rgba(0,0,0,0.15)}.fr-disc--o{background:radial-gradient(circle at 38% 35%,var(--tertiary-50),var(--tertiary-30));box-shadow:inset 0 -3px 0 rgba(0,0,0,0.2)}.fr-slot.is-win{outline:4px solid var(--color-surface);outline-offset:-4px}.fr-cols{position:absolute;inset:0;display:grid;grid-template-columns:repeat(7,1fr)}.fr-col{border:0;padding:0;background:transparent;cursor:pointer;border-radius:var(--radius-md)}.fr-col:hover:not(:disabled),.fr-col:focus-visible{background:rgba(255,255,255,0.18)}.fr-col:disabled{cursor:default}@keyframes fr-drop{from{transform:translateY(calc(var(--from,0) * -105% - 100%))}to{transform:none}}@media (prefers-reduced-motion:reduce){.fr-disc{animation:none}}