.fr{--fr-board: color-mix(in srgb, var(--sky) 86%, black);--fr-hole: color-mix(in srgb, var(--fr-board) 14%, var(--bg));--fr-w: min(100%, 470px, calc(var(--tg-stage-h) * .98));width:var(--fr-w);margin:0 auto;user-select:none;-webkit-user-select:none}:root[data-look=dusk] .fr{--fr-board: color-mix(in srgb, var(--sky) 55%, #10233d);--fr-hole: color-mix(in srgb, var(--bg) 85%, var(--sky))}:root[data-look=ink] .fr{--fr-board: var(--sky)}:root[data-palette=colorblind] .fr{--fr-board: color-mix(in srgb, var(--ink-2) 45%, black)}.fr-preview{position:relative;aspect-ratio:7 / 1}.fr-ghost{position:absolute;top:0;left:calc(var(--col, 3) * 100% / 7);width:calc(100% / 7);height:100%;display:grid;place-items:center;opacity:0;transform:translateY(-6px);transition:left calc(.09s * var(--motion)) ease-out,opacity calc(.12s * var(--motion)),transform calc(.12s * var(--motion));pointer-events:none}.fr-ghost.is-on{opacity:1;transform:none}.fr-board{position:relative;aspect-ratio:7 / 6;border-radius:12px;box-shadow:0 10px 0 -4px color-mix(in srgb,var(--fr-board) 70%,black),var(--shadow)}.fr-discs,.fr-marks,.fr-face,.fr-cols{position:absolute;inset:0}.fr-discs,.fr-marks{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr))}.fr-discs{background:var(--fr-hole);border-radius:12px;overflow:visible}.fr-face{border-radius:12px;pointer-events:none;background:radial-gradient(circle closest-side,transparent 0 77%,rgba(0,0,0,.28) 78% 83%,var(--fr-board) 85%) 0 0 / calc(100% / 7) calc(100% / 6),var(--fr-board);-webkit-mask:radial-gradient(circle closest-side,transparent 0 77%,#000 78%) 0 0 / calc(100% / 7) calc(100% / 6);mask:radial-gradient(circle closest-side,transparent 0 77%,#000 78%) 0 0 / calc(100% / 7) calc(100% / 6);box-shadow:inset 0 2px #ffffff38,inset 0 -3px #0000002e}.fr-face:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff29,#fff0 30%)}.fr-slot{display:grid;place-items:center;min-width:0}.fr-disc{position:relative;width:86%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 34% 28%,color-mix(in srgb,var(--tg-c) 45%,white) 0 9%,transparent 30%),radial-gradient(circle at 50% 50%,var(--tg-c) 0 56%,color-mix(in srgb,var(--tg-c) 78%,black) 72%,color-mix(in srgb,var(--tg-c) 85%,black) 100%);box-shadow:inset 0 -3px #00000029}.fr-slot[data-p="0"] .fr-disc:after,.fr-ghost[data-p="0"] .fr-disc:after{content:"";position:absolute;inset:37%;border-radius:50%;background:color-mix(in srgb,var(--tg-c) 70%,black);opacity:.35}.fr-slot[data-p="1"] .fr-disc:after,.fr-ghost[data-p="1"] .fr-disc:after{content:"";position:absolute;inset:20%;border-radius:50%;border:3px solid color-mix(in srgb,var(--tg-c) 65%,black);opacity:.38}.fr-ghost .fr-disc{width:78%;box-shadow:0 4px 10px #0000002e}.fr-slot.is-falling{animation:fr-fall calc(var(--fall-ms, .4s) * var(--motion)) linear both;will-change:transform}@keyframes fr-fall{0%{transform:translateY(calc(var(--fall) * -100%));animation-timing-function:cubic-bezier(.5,0,1,.6)}74%{transform:translateY(0);animation-timing-function:cubic-bezier(.2,.8,.4,1)}86%{transform:translateY(-10%);animation-timing-function:cubic-bezier(.6,0,1,1)}to{transform:translateY(0)}}.fr-slot.is-dim .fr-disc{filter:saturate(.55) brightness(.9);opacity:.7}.fr-marks{pointer-events:none}.fr-mark{place-self:center;width:78%;aspect-ratio:1;border-radius:50%}.fr-mark.is-last{box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--cell) 75%,transparent)}.fr-mark.is-win{box-shadow:inset 0 0 0 4px var(--cell),0 0 0 3px var(--ink);animation:fr-win calc(.9s * var(--motion)) ease-in-out infinite alternate}@keyframes fr-win{to{transform:scale(.88)}}.fr-mark.is-hint{border:3px dashed var(--cell);box-shadow:0 0 14px var(--sun);animation:fr-win calc(.7s * var(--motion)) ease-in-out infinite alternate}.fr-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.fr-lines line{stroke:var(--cell);stroke-width:1.6;stroke-linecap:round;opacity:.85;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}.fr-cols{display:flex;touch-action:none;border-radius:12px;overflow:hidden}.fr-col{flex:1 1 0;min-width:0;border:0;padding:0;margin:0;background:transparent;cursor:default;-webkit-tap-highlight-color:transparent}.fr.is-live .fr-col{cursor:pointer}.fr.is-live .fr-col.is-hover,.fr.is-live .fr-col:focus-visible{background:linear-gradient(180deg,#ffffff29,#ffffff0d)}.fr-col:focus-visible{outline:3px solid var(--sun);outline-offset:-3px}.fr-col.is-hint{background:linear-gradient(180deg,color-mix(in srgb,var(--sun) 40%,transparent),transparent 85%)}.fr-col.is-shake{animation:fr-shake calc(.32s * var(--motion)) ease-in-out}@keyframes fr-shake{25%{box-shadow:inset 4px 0 0 var(--coral)}75%{box-shadow:inset -4px 0 0 var(--coral)}}.fr-nums{display:none;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:10px;color:var(--ink-2);font-size:.78rem;font-weight:700;text-align:center}@media(pointer:fine)and (min-width:700px){.fr-nums{display:grid}}