.chg-puzzle{--chg-n: 4;--chg-ratio: 1.5;--chg-piece-gap: 2px}.chg-puzzle__pictures{display:flex;flex-wrap:wrap;gap:var(--chg-gap);max-width:100%;margin:0 0 1.6rem}.chg-puzzle__pick{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:6.4rem;height:6.4rem;aspect-ratio:1;padding:0;border:3px solid transparent;border-color:transparent!important;border-radius:var(--chg-radius-sm);background:var(--chg-navy);overflow:hidden;cursor:pointer;opacity:.7;transition:opacity .15s ease,border-color .15s ease}.chg-puzzle__pick img{display:block;width:100%;height:100%;object-fit:cover}.chg-puzzle__pick:hover{opacity:1}.chg-puzzle__pick[aria-pressed=true]{border-color:var(--chg-yellow)!important;opacity:1}.chg-puzzle__pick:focus-visible{outline:3px solid var(--chg-white);outline-offset:2px}.chg-puzzle__layout{display:flex;flex-direction:column;align-items:center;gap:1.2rem}.chg-puzzle__target{margin:0;width:min(40%,14rem);border:2px solid var(--chg-yellow);border-color:var(--chg-yellow)!important;border-radius:var(--chg-radius-sm);overflow:hidden;background:var(--chg-navy)}.chg-puzzle__target[hidden]{display:none}.chg-puzzle__target img{width:100%;height:auto;aspect-ratio:var(--chg-ratio);object-fit:cover}.chg-puzzle__stage{width:100%;display:flex;justify-content:center}@media(min-width:750px){.chg-puzzle__layout{flex-direction:row-reverse;align-items:flex-start;justify-content:center;gap:2rem}.chg-puzzle__target{flex:0 0 auto;width:16rem}.chg-puzzle__stage{flex:0 1 64rem;min-width:0;justify-content:flex-end}}.chg-puzzle__grid{position:relative;display:grid;grid-template-columns:repeat(var(--chg-n),minmax(0,1fr));grid-template-rows:repeat(var(--chg-n),minmax(0,1fr));gap:var(--chg-piece-gap);width:min(100%,64rem,calc(72vh * var(--chg-ratio)));aspect-ratio:var(--chg-ratio);margin:0 auto;padding:var(--chg-piece-gap);border-radius:var(--chg-radius-sm);background:var(--chg-navy);outline:2px solid rgba(255,255,255,.18);touch-action:none;user-select:none;-webkit-user-select:none;transition:gap .3s ease,padding .3s ease}.chg-puzzle__loading{grid-column:1 / -1;grid-row:1 / -1;align-self:center;justify-self:center;margin:0;font-size:1.4rem;color:var(--chg-muted)!important}.chg-piece{appearance:none;-webkit-appearance:none;position:relative;display:block;width:100%;height:100%;min-width:0;margin:0;padding:0;border:0;border-radius:2px;background-color:var(--chg-navy-soft);background-repeat:no-repeat;background-size:calc(var(--chg-n) * 100%) calc(var(--chg-n) * 100%);color:transparent!important;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;transition:transform .18s ease,box-shadow .18s ease}.chg-piece:hover{box-shadow:inset 0 0 0 2px #ffffff8c}.chg-piece:focus-visible{outline:3px solid var(--chg-white);outline-offset:-3px;z-index:2}.chg-piece[aria-pressed=true]{box-shadow:inset 0 0 0 4px var(--chg-yellow),0 0 0 2px var(--chg-yellow);z-index:3}.chg-piece.is-over{box-shadow:inset 0 0 0 4px var(--chg-yellow)}.chg-piece.is-dragging{z-index:10;cursor:grabbing;pointer-events:none;box-shadow:0 12px 28px #0000008c,0 0 0 3px var(--chg-yellow);transition:box-shadow .18s ease}.chg-piece.is-swapped{animation:chg-piece-in .22s ease-out}@keyframes chg-piece-in{0%{transform:scale(.9)}to{transform:scale(1)}}.chg-puzzle__grid.is-solved{--chg-piece-gap: 0px;outline-color:var(--chg-yellow)}.chg-puzzle__grid.is-solved .chg-piece{border-radius:0;cursor:default;box-shadow:none}@media(prefers-reduced-motion:reduce){.chg-puzzle__grid,.chg-piece,.chg-piece.is-dragging{transition:none}.chg-piece.is-swapped{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/29/assets/clubhuus-puzzle.css.map */