.board{--gap:clamp(4px, 2.5cqi, 12px);aspect-ratio:1;background:var(--board);touch-action:none;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;width:100%;max-width:30rem;margin-inline:auto;position:relative;container-type:inline-size}.board-cells{grid-template-columns:repeat(var(--size), 1fr);grid-template-rows:repeat(var(--size), 1fr);gap:var(--gap);padding:var(--gap);display:grid;position:absolute;inset:0}.board-cell{background:var(--board-cell);border-radius:4px}.board-tiles{position:absolute;inset:0}.tile{--tile:calc((100cqi - (var(--size) + 1) * var(--gap)) / var(--size));width:var(--tile);height:var(--tile);background:var(--tile-2);color:var(--tile-2-ink);font-size:calc(var(--tile) * var(--k,.5));font-variant-numeric:tabular-nums;translate:calc(var(--gap) + var(--c) * (var(--tile) + var(--gap)) + var(--dx,0px)) calc(var(--gap) + var(--r) * (var(--tile) + var(--gap)) + var(--dy,0px));border-radius:4px;place-items:center;font-weight:700;line-height:1;transition:translate .1s ease-in-out;display:grid;position:absolute;top:0;left:0}.board--dragging .tile{transition:none}.tile[data-digits="3"]{--k:.42}.tile[data-digits="4"]{--k:.34}.tile[data-digits="5"]{--k:.28}.tile[data-digits="6"],.tile[data-digits="7"]{--k:.23}.tile[data-value="4"]{background:var(--tile-4);color:var(--tile-4-ink)}.tile[data-value="8"]{background:var(--tile-8);color:var(--tile-8-ink)}.tile[data-value="16"]{background:var(--tile-16);color:var(--tile-16-ink)}.tile[data-value="32"]{background:var(--tile-32);color:var(--tile-32-ink)}.tile[data-value="64"]{background:var(--tile-64);color:var(--tile-64-ink)}.tile[data-value="128"]{background:var(--tile-128);color:var(--tile-128-ink)}.tile[data-value="256"]{background:var(--tile-256);color:var(--tile-256-ink)}.tile[data-value="512"]{background:var(--tile-512);color:var(--tile-512-ink)}.tile[data-value="1024"]{background:var(--tile-1024);color:var(--tile-1024-ink)}.tile[data-value="2048"]{background:var(--tile-2048);color:var(--tile-2048-ink)}.tile[data-value=super]{background:var(--tile-super);color:var(--tile-super-ink)}.tile--new{animation:.15s ease-out tile-appear}.tile--merged{animation:.15s ease-out tile-pop}@keyframes tile-appear{0%{opacity:0;scale:.3}}@keyframes tile-pop{50%{scale:1.12}}@media (prefers-reduced-motion:reduce){.tile{transition:none}.tile--new,.tile--merged{animation:none}}.m3-board{aspect-ratio:7/9;touch-action:none;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;width:100%;max-width:clamp(18rem,77.7778svh - 9.33333rem,30rem);margin-inline:auto;position:relative;container-type:inline-size}.m3-grid{--cell:calc(100cqi / 7);top:calc((9 - var(--h,9)) * var(--cell) / 2);left:calc((7 - var(--w,7)) * var(--cell) / 2);width:calc(var(--w,7) * var(--cell));height:calc(var(--h,9) * var(--cell));position:absolute}.m3-cells,.m3-gems,.m3-crates,.m3-fx{position:absolute;inset:0}.m3-cells{grid-template-columns:repeat(var(--w,7), 1fr);grid-template-rows:repeat(var(--h,9), 1fr);display:grid}.m3-cell{background:var(--m3-cell)}.m3-cell--alt{background:var(--m3-cell-alt)}.m3-cell--hole{background:0 0}.m3-cell[data-ice="1"]{background:var(--m3-ice);box-shadow:inset 0 0 0 2px var(--m3-ice-edge)}.m3-cell[data-ice="2"]{background:repeating-linear-gradient(135deg, transparent 0 7px, var(--m3-ice-edge) 7px 9px), var(--m3-ice-2);box-shadow:inset 0 0 0 3px var(--m3-ice-edge)}.m3-cell--crack{animation:.3s ease-out m3-crack}.m3-gems{overflow:hidden}.m3-gem,.m3-crate,.m3-flash,.m3-cursor{width:var(--cell);height:var(--cell);translate:calc(var(--c) * var(--cell) + var(--dx,0px)) calc(var(--r) * var(--cell) + var(--dy,0px));position:absolute;top:0;left:0}.m3-gem{transition:translate var(--t,0s) ease-in;place-items:center;display:grid}.m3-gem>svg{grid-area:1/1;width:86%;height:86%}.m3-gem>.m3-power{width:100%;height:100%}.m3-gem[data-power=column]>.m3-power{rotate:90deg}.m3-gem[data-power=bomb]>.m3-power{animation:1.4s ease-in-out infinite m3-pulse}.m3-gem--dragging{z-index:2;transition:none}.m3-gem--selected>svg:first-child{filter:drop-shadow(0 0 3px var(--m3-select)) drop-shadow(0 0 1px var(--m3-select));scale:1.12}.m3-gem--hint{animation:.9s ease-in-out infinite m3-wiggle}.m3-gem--gone{animation:.19s ease-in forwards m3-gone}.m3-gem--new{animation:.26s ease-out m3-pop}.m3-crates,.m3-fx{pointer-events:none}.m3-crate{padding:3%}.m3-crate>svg{width:100%;height:100%;display:block}.m3-crate--hit{animation:.26s ease-in-out m3-shake}.m3-crate--broken{animation:.38s ease-in forwards m3-gone}.m3-flash{background:radial-gradient(circle, var(--m3-flash) 0 30%, transparent 70%);animation:.38s ease-out forwards m3-flash}.m3-cursor{z-index:3;border:3px solid var(--m3-cursor);pointer-events:none;border-radius:6px}.m3-board:not(:focus-visible) .m3-cursor{display:none}.m3-wait{color:var(--color-muted);place-items:center;margin:0;font-weight:600;display:grid;position:absolute;inset:0}.m3-wait[hidden]{display:none}.m3-goals{flex-wrap:wrap;justify-content:center;gap:.5rem;min-height:2.5rem;margin:0 auto .5rem;padding:0;list-style:none;display:flex}.m3-goal{background:var(--color-sheet);font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:.375rem;min-height:2.5rem;padding:0 .75rem 0 .375rem;font-weight:700;display:flex}.m3-goal--done{color:var(--m3-done)}.m3-goal-icon{width:1.75rem;height:1.75rem}.m3-goal-ice{background:var(--m3-ice-2);width:1.375rem;height:1.375rem;box-shadow:inset 0 0 0 2px var(--m3-ice-edge);border-radius:3px;margin:.1875rem;display:inline-block}.m3-goal-points{color:var(--color-muted);padding-left:.375rem;font-size:.875rem;font-weight:600}.m3-tip{text-align:center;max-width:30rem;min-height:3em;color:var(--color-muted);margin:.5rem auto 0}.m3-legend{margin-top:.5rem}.m3-legend-list{gap:.75rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.m3-legend-item{grid-template-columns:2.75rem 1fr;align-items:center;gap:.75rem;display:grid}.m3-legend-icon{background:var(--m3-cell);border-radius:6px;place-items:center;width:2.75rem;height:2.75rem;display:grid}.m3-legend-icon svg{grid-area:1/1;width:86%;height:86%}.m3-legend-icon .m3-power{width:100%;height:100%}.m3-legend-item--pair{grid-template-columns:auto 1fr}.m3-legend-icon--pair{grid-template-columns:1fr 1fr;width:5.5rem}.m3-legend-icon--pair>span{place-items:center;width:2.75rem;height:2.75rem;display:grid}.m3-legend-icon--ice{background:var(--m3-ice);box-shadow:inset 0 0 0 2px var(--m3-ice-edge)}.m3-stars{letter-spacing:.25rem;color:var(--m3-star);margin-bottom:.25rem;font-size:2rem;line-height:1.2;display:block}.m3-map{grid-template-columns:repeat(5,1fr);gap:.5rem;display:grid}.m3-level{border:1px solid var(--color-rule);background:var(--color-paper);min-height:3.25rem;color:var(--color-ink);font-variant-numeric:tabular-nums;cursor:pointer;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;font-weight:700;display:flex}.m3-level:hover:not(:disabled){border-color:var(--color-stamp)}.m3-level:disabled{cursor:default;opacity:.45}.m3-level[aria-current=true]{border-color:var(--color-stamp);box-shadow:inset 0 0 0 1px var(--color-stamp)}.m3-level-stars{min-height:1em;color:var(--m3-star);font-size:.75rem;line-height:1}@keyframes m3-gone{to{opacity:0;scale:.2}}@keyframes m3-pop{0%{opacity:0;scale:.3}}@keyframes m3-wiggle{25%{rotate:-9deg}75%{rotate:9deg}}@keyframes m3-pulse{50%{scale:1.08}}@keyframes m3-shake{25%{rotate:-6deg}75%{rotate:6deg}}@keyframes m3-crack{50%{filter:brightness(1.4)}}@keyframes m3-flash{0%{opacity:1;scale:.6}to{opacity:0;scale:1.5}}@media (prefers-reduced-motion:reduce){.m3-gem{transition:none}.m3-gem--hint,.m3-gem--gone,.m3-gem--new,.m3-gem[data-power=bomb]>.m3-power,.m3-crate--hit,.m3-cell--crack{animation:none}.m3-gem--hint>svg:first-child{filter:drop-shadow(0 0 3px var(--m3-select)) drop-shadow(0 0 1px var(--m3-select))}}
