.shell{--board-padding:12px;--board-gap:6px;--tile-font-size:2rem;transform-origin:top;flex-direction:column;width:min(100vw,520px);min-height:100vh;margin:0 auto;padding:16px 14px;display:flex}.hud{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;display:grid}.hud>div{justify-items:center;padding:10px 12px;display:grid}.hud-content{text-align:center;justify-items:center;min-width:5.2em;display:inline-grid}.label{color:#5e7775;font-size:.78rem;display:block}.hud strong{font-size:1.35rem}.board-grid{inset:var(--board-padding);grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);width:auto;height:auto;position:absolute}.cell{width:100%;height:100%;font-size:var(--tile-font-size)}.tile.selected{outline:4px solid var(--game-color-state-focus);transform:translateY(2px)}.tile-fallback{pointer-events:none;color:#0b6862;background:#eef8f6;border:2px solid #0b6862;border-radius:35%;place-items:center;width:72%;height:72%;font-size:.78rem;font-weight:800;display:inline-grid}.tile-fallback-hidden{display:none}.start-button{min-width:180px;min-height:60px;font-size:1.25rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.match-effects{inset:var(--board-padding);pointer-events:none;z-index:5;position:absolute}.shuffle-hiding .board-grid{animation:.3s ease-in forwards shuffle-board-hide}.shuffle-showing .board-grid{animation:.3s ease-out forwards shuffle-board-show}.match-lines{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.match-line{fill:none;stroke:#67d8cf;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.6px;filter:drop-shadow(0 0 3px #3bb5abcc);vector-effect:non-scaling-stroke;animation:.28s ease-out forwards line-pop}.effect-tile{width:calc((100% - (var(--board-gap) * 7)) / 8);height:calc((100% - (var(--board-gap) * 7)) / 8);font-size:var(--tile-font-size);animation:.28s ease-out forwards tile-pop;position:absolute;transform:translate(-50%,-50%)}@keyframes line-pop{0%{opacity:0;stroke-width:1.2px}25%{opacity:1;stroke-width:3px}to{opacity:0;stroke-width:2.2px}}@keyframes tile-pop{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}45%{opacity:1;transform:translate(-50%,-50%)scale(1.16)}to{opacity:0;transform:translate(-50%,-50%)scale(.25)}}@keyframes shuffle-board-hide{0%{opacity:1;transform:translate(0)scale(1)}18%{transform:translate(-7px)rotate(-.5deg)scale(1)}36%{transform:translate(7px)rotate(.5deg)scale(1)}54%{transform:translate(-5px)rotate(-.35deg)scale(.98)}72%{opacity:.78;transform:translate(5px)rotate(.35deg)scale(.94)}to{opacity:.18;transform:translate(0)scale(.86)}}@keyframes shuffle-board-show{0%{opacity:.18;transform:scale(.86)}65%{opacity:1;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}.result .start-button{justify-self:center;margin-top:12px;position:static;transform:none}.final-score{color:#0b6862;margin:8px 0;font-size:2.4rem;font-weight:800}@media (prefers-reduced-motion:reduce){.shuffle-hiding .board-grid{animation:.3s ease-in forwards shuffle-board-hide-reduced}.shuffle-showing .board-grid{animation:.3s ease-out forwards shuffle-board-show-reduced}@keyframes shuffle-board-hide-reduced{0%{opacity:1}to{opacity:.2}}@keyframes shuffle-board-show-reduced{0%{opacity:.2}to{opacity:1}}}@media (width<=640px){.shell{--board-padding:6px;--board-gap:3px;--tile-font-size:1.5rem;width:min(100vw - 20px,520px);padding:14px 10px 20px}.hud{gap:8px;margin-bottom:10px}.result{gap:12px;padding:18px 16px}.result h2,.result p{margin:0}.result h2{font-size:1.55rem}.result p{font-size:.98rem;line-height:1.3}.result .final-score{margin:2px 0 6px;font-size:2.7rem}.result .start-button{min-width:150px;min-height:48px;margin-top:8px;padding:10px 24px;font-size:1.05rem}}@media (width<=360px){.shell{--board-padding:4px;--board-gap:2px;width:min(100vw - 8px,520px);padding-left:4px;padding-right:4px}}