.c4{--cell:40px;--pad:.25;--top:.9;--disc-size:.84;background:radial-gradient(at 50% 0,#52b6ff24,#0000 60%),#120a28;position:absolute;inset:0}.c4-discs,.c4-frame,.c4-marks{left:0;top:calc(var(--cell) * var(--top));width:100%;height:calc(100% - var(--cell) * var(--top));position:absolute}.c4-discs{z-index:1}.c4-frame{z-index:2;pointer-events:none;filter:drop-shadow(0 calc(var(--cell) * .06) 0 var(--line))}.c4-face{fill:var(--accent);stroke:var(--line);stroke-width:.055px}.c4-marks{z-index:3;pointer-events:none}.disc{--disc:var(--tomato);--disc-dark:#c23a2f;width:calc(var(--cell) * var(--disc-size));height:calc(var(--cell) * var(--disc-size));left:calc(var(--cell) * (var(--pad) + var(--col) + (1 - var(--disc-size)) / 2));top:calc(var(--cell) * (var(--pad) + var(--row) + (1 - var(--disc-size)) / 2));background:radial-gradient(circle at 34% 30%, #ffffff8c 0 11%, transparent 12%), radial-gradient(circle, var(--disc) 0 52%, var(--disc-dark) 54% 60%, var(--disc) 62%);box-shadow:inset 0 calc(var(--cell) * -.06) 0 #00000038;will-change:transform;border-radius:50%;position:absolute}.disc[data-seat="1"]{--disc:var(--sun);--disc-dark:#d9a514}.c4-preview{z-index:3;top:calc(var(--cell) * (var(--top) - var(--disc-size)) / 2);left:calc(var(--cell) * (var(--pad) + var(--col,3) + (1 - var(--disc-size)) / 2));pointer-events:none;transition:left .12s ease-out;animation:1.2s ease-in-out infinite c4-hover}@keyframes c4-hover{50%{transform:translateY(calc(var(--cell) * -.05))}}.c4-last,.c4-win{border-radius:50%;position:absolute}.c4-last{width:calc(var(--cell) * .22);height:calc(var(--cell) * .22);left:calc(var(--cell) * (var(--pad) + var(--col) + .39));top:calc(var(--cell) * (var(--pad) + var(--row) + .39));background:#ffffffbf;box-shadow:0 0 0 2px #07040f80}.c4-win{width:calc(var(--cell) * .84);height:calc(var(--cell) * .84);left:calc(var(--cell) * (var(--pad) + var(--col) + .08));top:calc(var(--cell) * (var(--pad) + var(--row) + .08));border:calc(var(--cell) * .08) solid #fff;box-shadow:0 0 0 2px var(--line), 0 0 calc(var(--cell) * .4) #ffffffb3;animation:.9s ease-in-out infinite alternate c4-win}@keyframes c4-win{to{opacity:.7;transform:scale(.82)}}.c4-cols{z-index:4;position:absolute;inset:0}.c4-col{top:0;bottom:0;left:calc(var(--cell) * (var(--pad) + var(--col)));width:var(--cell);border-radius:calc(var(--cell) * .2);cursor:default;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;position:absolute}.c4.is-playable .c4-col{cursor:pointer}.c4.is-playable .c4-col.is-selected,.c4.is-playable .c4-col:hover{background:linear-gradient(#ffffff1a,#ffffff05 60%)}.c4.is-playable .c4-col.is-full{cursor:not-allowed}.c4-col:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}.c4-reactions{z-index:6;pointer-events:none;position:absolute;inset:0;overflow:hidden}.c4-reaction{bottom:4%;left:var(--x);font-size:calc(var(--cell) * .95);filter:drop-shadow(0 3px 0 var(--line));line-height:1;animation:2.1s cubic-bezier(.2,.7,.3,1) forwards c4-float;position:absolute}.c4-reaction.is-theirs{animation-name:c4-float-down;top:6%;bottom:auto}@keyframes c4-float{0%{opacity:0;transform:translateY(20%)scale(.4)}15%{opacity:1;transform:translateY(0)scale(1.15)}to{opacity:0;transform:translateY(-260%)scale(1)}}@keyframes c4-float-down{0%{opacity:0;transform:translateY(-20%)scale(.4)}15%{opacity:1;transform:translateY(0)scale(1.15)}to{opacity:0;transform:translateY(220%)scale(1)}}@media (prefers-reduced-motion:reduce){.c4-preview,.c4-win{animation:none}}