.bfit-root{width:100%}.bfit-wrap{contain:inline-size;justify-content:center;width:100%;display:flex}.bfit-play{flex-direction:column;align-items:center;gap:16px;display:flex;position:relative}.bfit-grid{border:3px solid var(--ink);border-radius:var(--r-md);background:var(--cream);box-shadow:var(--hard);box-sizing:border-box;touch-action:none;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);padding:0;display:grid;position:relative;overflow:visible}.bfit-cell{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 12%, transparent);position:relative}.bfit-cell.is-full:after,.bfit-cell.is-ghost:after,.bfit-cell.is-bad:after{content:"";border:2.5px solid var(--ink);background:var(--fill);box-shadow:2px 2px 0 var(--ink);border-radius:7px;position:absolute;inset:2px 3px 3px 2px}.bfit-cell.is-full:before{content:"";z-index:1;background:var(--white);opacity:.6;border-radius:99px;width:22%;height:16%;position:absolute;top:22%;left:22%}.bfit-cell.is-ghost:after{background:color-mix(in srgb, var(--fill) 45%, var(--white));box-shadow:none;border-style:dashed}.bfit-cell.is-bad:after{border:2px dashed var(--ink-3);box-shadow:none;background:0 0}.bfit-cell.is-full.is-bad:after{border:2.5px solid var(--ink);background:var(--fill);box-shadow:2px 2px 0 var(--ink)}.bfit-cell.is-hot{background:color-mix(in srgb, var(--sun) 55%, var(--cream))}.bfit-cell.is-hot.is-full:after{box-shadow:3px 4px 0 var(--ink);transform:translate(-1px,-2px)}.bfit-cell.is-landed:after{animation:bfit-land .26s var(--ease-squish)}@keyframes bfit-land{0%{transform:scale(1.14,.84)}to{transform:none}}.bfit-grid.is-over .bfit-cell.is-full:after{filter:saturate(.45)}.bfit-burst{pointer-events:none;z-index:5;position:absolute;inset:0}.bfit-pop{width:var(--cell);height:var(--cell);animation:bfit-pop .42s var(--ease-out) forwards;position:absolute}.bfit-pop:after{content:"";border:2.5px solid var(--ink);background:var(--fill);border-radius:7px;position:absolute;inset:2px 3px 3px 2px}@keyframes bfit-pop{0%{transform:scale(1)}35%{transform:scale(1.18)rotate(6deg)}to{opacity:0;transform:scale(0)}}.bfit-bit{width:calc(var(--cell) * .26);height:calc(var(--cell) * .26);margin:calc(var(--cell) * -.13) 0 0 calc(var(--cell) * -.13);border:2px solid var(--ink);border-radius:3px;animation:.82s cubic-bezier(.2,.7,.4,1) forwards bfit-bit;position:absolute}.bfit-bit.is-round{border-radius:50%}@keyframes bfit-bit{0%{opacity:1;transform:translate(0)rotate(0)scale(.4)}60%{opacity:1}to{transform:translate(var(--dx), calc(var(--dy) + var(--cell) * 1.2)) rotate(var(--rot)) scale(1);opacity:0}}.bfit-callout{z-index:6;border:var(--edge);background:var(--sun);box-shadow:var(--hard);font-family:var(--font-display);letter-spacing:-.03em;white-space:nowrap;pointer-events:none;animation:bfit-callout 1s var(--ease-spring) forwards;border-radius:14px;align-items:center;gap:8px;padding:6px 14px 8px;font-size:24px;font-weight:800;display:inline-flex;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)rotate(-3deg)}.bfit-callout b{border:2px solid var(--ink);background:var(--white);border-radius:99px;padding:0 8px 2px;font-size:18px}@keyframes bfit-callout{0%{opacity:0;transform:translate(-50%,-30%)rotate(-3deg)scale(.5)}20%{opacity:1;transform:translate(-50%,-50%)rotate(-3deg)scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-90%)rotate(-3deg)scale(1)}}.bfit-tray{grid-template-columns:repeat(3,1fr);gap:10px;width:100%;display:grid}.bfit-slot{height:calc(var(--mini) * 5 + 22px);border:var(--edge);border-radius:var(--r-md);background:var(--white);box-shadow:var(--hard-sm);cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;transition:transform .14s var(--ease-spring), box-shadow .14s var(--ease-spring), background .14s;place-items:center;padding:0;display:grid;position:relative}.bfit-slot:disabled{background:var(--cream);box-shadow:none;cursor:default}.bfit-slot:not(:disabled):hover{box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px)}.bfit-slot.is-sel{background:color-mix(in srgb, var(--sun) 55%, var(--white))}.bfit-slot:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.bfit-slot.is-dragging .bfit-piece{opacity:.18}.bfit-slot.is-back .bfit-piece{animation:bfit-back .26s var(--ease-spring)}@keyframes bfit-back{0%{transform:translateY(-24px)scale(1.2)}}.bfit-slot.is-stuck{background:var(--cream)}.bfit-slot.is-stuck .bfit-piece{opacity:.42}.bfit-slot.is-over.is-stuck .bfit-piece{opacity:.6;animation:bfit-shake .42s var(--ease-out) 2}@keyframes bfit-shake{25%{transform:translate(-4px)rotate(-3deg)}60%{transform:translate(4px)rotate(3deg)}}.bfit-nofit{border:2px solid var(--ink);background:var(--white);white-space:nowrap;color:var(--ink);border-radius:99px;padding:1px 8px 2px;font-size:11px;font-weight:800;position:absolute;bottom:6px;left:50%;transform:translate(-50%)rotate(-3deg)}.bfit-piece{pointer-events:none;display:block;position:relative}.bfit-block{width:var(--c);height:var(--c);position:absolute}.bfit-block:after{content:"";border:2px solid var(--ink);background:var(--fill);box-shadow:1.5px 1.5px 0 var(--ink);border-radius:5px;position:absolute;inset:1px 2px 2px 1px}.bfit-piece.is-floating .bfit-block:after{box-shadow:3px 3px 0 var(--ink);border-width:2.5px;border-radius:7px;inset:2px 3px 3px 2px}.bfit-float{z-index:1000;pointer-events:none;will-change:transform;position:fixed;top:0;left:0}.bfit-float .bfit-piece{animation:bfit-lift .16s var(--ease-spring)}@keyframes bfit-lift{0%{transform:scale(.6)}}.bfit-score{display:inline-block;position:relative}.bfit-gain{color:var(--good);white-space:nowrap;pointer-events:none;animation:bfit-gain 1s var(--ease-out) forwards;margin-left:4px;font-size:15px;position:absolute;top:-6px;left:100%}@keyframes bfit-gain{0%{opacity:1;transform:translateY(8px)}to{opacity:0;transform:translateY(-14px)}}.bfit-combo{color:var(--ink-3)}.bfit-combo.is-on{color:var(--ink);background:var(--sun);border-radius:8px;padding:0 6px}.bfit-overlay{z-index:20;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.bfit-card{pointer-events:auto;border-radius:var(--r-lg);border:3px solid var(--ink);background:var(--white);width:min(320px,92%);box-shadow:var(--hard-lg);animation:bfit-card .36s var(--ease-spring);flex-direction:column;gap:8px;margin-bottom:30%;padding:16px 18px;display:flex}@keyframes bfit-card{0%{opacity:0;transform:translateY(16px)scale(.92)rotate(-2deg)}}.bfit-card-title{font-family:var(--font-display);letter-spacing:-.03em;margin:0;font-size:26px;font-weight:800;line-height:1}.bfit-card-sub{color:var(--ink-2);margin:0;font-size:14px;font-weight:500}.bfit-card-sub strong{color:var(--ink)}.bfit-card-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:4px;display:flex}@media (width<=520px){.bfit-tray{gap:8px}.bfit-callout{font-size:20px}}@media (prefers-reduced-motion:reduce){.bfit-cell:after,.bfit-pop,.bfit-bit,.bfit-callout,.bfit-slot .bfit-piece,.bfit-float .bfit-piece,.bfit-card,.bfit-gain{animation:none!important}.bfit-bit{display:none}}
