.queens-board{background:var(--color-queens-boundary);border:4px solid var(--color-queens-boundary);clip-path:inset(0 round .65rem);grid-template-columns:repeat(var(--queens-order), minmax(0, 1fr));touch-action:none;user-select:none;border-radius:.65rem;width:100%;max-width:36rem;margin-inline:auto;display:grid;position:relative;overflow:hidden}.queens-cell{aspect-ratio:1;box-sizing:border-box;color:var(--color-queens-boundary);cursor:pointer;border:0;justify-content:center;align-items:center;min-width:0;padding:0;transition:background-color .24s;display:flex;position:relative}.queens-cell:before,.queens-cell:after{background:var(--color-queens-boundary);content:"";pointer-events:none;z-index:1;position:absolute}.queens-cell:before{height:1px;inset:0 0 auto}.queens-cell:after{width:1px;inset:0 auto 0 0}.queens-cell[data-top-line=region]:before{background:var(--color-queens-boundary);height:3px}.queens-cell[data-left-line=region]:after{background:var(--color-queens-boundary);width:3px}.queens-cell[data-top-line=none]:before,.queens-cell[data-left-line=none]:after{content:none}.queens-cell:focus-visible{outline:none}@media (hover:hover) and (pointer:fine){.queens-cell:focus-visible{outline:3px solid var(--color-queens-boundary);outline-offset:-4px;z-index:2}}.queens-cell[data-hint-role=target]{z-index:2;animation:1.5s ease-in-out infinite queens-hint-action-pulse;box-shadow:inset 0 0 0 3px #f8fff4,inset 0 0 0 6px #315b20}.queens-cell[data-hint-role=reason]{outline-offset:-5px;z-index:2;background-image:repeating-linear-gradient(135deg,#0000 0 6px,#10141524 6px 9px);outline:2px dashed #f8f4e8}.queens-cell[data-hint-kind=mistake]{animation-name:queens-hint-mistake-pulse;box-shadow:inset 0 0 0 3px #fff1ee,inset 0 0 0 6px #a53f36}.queens-region-highlight{pointer-events:none;z-index:2;background:#ffffff1f;border:2px solid #fffde8;animation:1.5s ease-in-out infinite queens-region-hint-pulse;position:absolute;inset:.22rem;box-shadow:inset 0 0 0 2px #10141542}.queens-hint-marker{color:#f8fff4;opacity:.82;pointer-events:none;z-index:4;background:#203a17d9;border:1px solid #f8fff499;border-radius:50%;justify-content:center;align-items:center;width:clamp(.72rem,2.35vw,.9rem);height:clamp(.72rem,2.35vw,.9rem);font-size:clamp(.46rem,1.35vw,.58rem);font-weight:800;line-height:1;display:flex;position:absolute;top:.12rem;right:.12rem}.queens-hint-marker[data-role=reason]{background:#35332d;border-style:dashed}.queens-cell[data-hint-kind=mistake] .queens-hint-marker{background:#872e29}.queens-hint{color:#e8f5e1;text-align:center;background:#263224;border:1px solid #6b8b5c;border-radius:.8rem;margin:.85rem 0 0;padding:.75rem .9rem;font-size:.86rem;line-height:1.45;box-shadow:inset 0 1px #ffffff0a}.queens-hint p{margin:.55rem 0 0}.queens-hint__legend{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.queens-hint__regions{flex-wrap:wrap;justify-content:center;gap:.45rem;margin-top:.55rem;display:flex}.queens-hint__region{background:#ffffff0c;border:1px solid #789f66;border-radius:999px;align-items:center;gap:.38rem;padding:.2rem .62rem .2rem .25rem;font-size:.74rem;font-weight:750;display:inline-flex}.queens-hint__region-swatch{border:2px solid #101415;border-radius:.28rem;width:1.15rem;height:1.15rem;box-shadow:0 0 0 1px #fff9}.queens-hint__key{color:#e8f5e1;letter-spacing:.04em;text-transform:uppercase;background:#ffffff09;border:1px solid #789f66;border-radius:999px;align-items:center;gap:.32rem;padding:.18rem .55rem .18rem .25rem;font-size:.7rem;font-weight:700;display:inline-flex}.queens-hint__key strong{background:#315b20;border-radius:50%;justify-content:center;align-items:center;width:1.15rem;height:1.15rem;display:inline-flex}.queens-hint__key[data-role=reason]{border-style:dashed}.queens-hint__key[data-role=reason] strong{background:#565149}.queens-hint[data-kind=mistake]{color:#ffd5cf;background:#3b2625;border-color:#a85d56}.queens-hint[data-kind=mistake] .queens-hint__key{color:#ffd5cf;border-color:#b96860}.queens-hint[data-kind=mistake] .queens-hint__key strong{background:#872e29}@keyframes queens-hint-action-pulse{0%,to{box-shadow:inset 0 0 0 3px #f8fff4,inset 0 0 0 6px #315b20}50%{box-shadow:inset 0 0 0 4px #f8fff4,inset 0 0 0 8px #315b20}}@keyframes queens-hint-mistake-pulse{0%,to{box-shadow:inset 0 0 0 3px #fff1ee,inset 0 0 0 6px #a53f36}50%{box-shadow:inset 0 0 0 4px #fff1ee,inset 0 0 0 8px #a53f36}}@keyframes queens-region-hint-pulse{0%,to{background-color:#ffffff17;border-color:#fffde8cc}50%{background-color:#ffffff36;border-color:#fff}}.queens-conflict-ring{border:3px solid var(--color-game-danger);pointer-events:none;border-radius:.3rem;position:absolute;inset:8%}.queens-marker{color:var(--color-queens-boundary);opacity:.78;justify-content:center;align-items:center;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:clamp(.8rem,4vw,1.55rem);font-weight:500;line-height:1;display:flex}.queens-marker[data-skin=cats]{color:#382821}.queens-marker[data-skin=dogs]{color:#263b49}.queens-marker[data-skin=flowers]{color:#28572c}.queens-marker__shape{filter:drop-shadow(0 1px #ffffff7a);display:block;position:relative}.queens-marker[data-skin=cats] .queens-marker__shape{background:currentColor;border-radius:48% 48% 58% 58%;width:.46em;height:.34em;transform:translateY(.12em)}.queens-marker[data-skin=cats] .queens-marker__shape:before{content:"";background:currentColor;border-radius:50%;width:.2em;height:.2em;position:absolute;top:-.22em;left:-.09em;box-shadow:.22em -.09em,.44em 0}.queens-marker[data-skin=dogs] .queens-marker__shape{background:currentColor;border-radius:999px;width:.68em;height:.2em;transform:rotate(-32deg)}.queens-marker[data-skin=dogs] .queens-marker__shape:before,.queens-marker[data-skin=dogs] .queens-marker__shape:after{content:"";background:currentColor;border-radius:50%;width:.25em;height:.42em;position:absolute;top:-.11em}.queens-marker[data-skin=dogs] .queens-marker__shape:before{left:-.11em}.queens-marker[data-skin=dogs] .queens-marker__shape:after{right:-.11em}.queens-marker[data-skin=flowers] .queens-marker__shape{width:.9em;height:.76em}.queens-marker[data-skin=flowers] .queens-marker__shape span{transform-origin:bottom;background:currentColor;border-radius:100% 0;width:.18em;height:.68em;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.queens-marker[data-skin=flowers] .queens-marker__shape span:first-child{transform:translate(-50%)rotate(-38deg)}.queens-marker[data-skin=flowers] .queens-marker__shape span:last-child{transform:translate(-50%)rotate(38deg)}.queens-piece{transform-style:preserve-3d;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.queens-piece-flip{perspective:12rem;pointer-events:none;z-index:4;width:100%;height:100%;display:block;position:relative}.queens-piece--queen{color:var(--color-queens-boundary);transform:translateY(-2%)}.queens-piece__icon{fill:currentColor;filter:drop-shadow(0 1px #ffffff42);stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75px;width:clamp(1.35rem,5.7vw,2.65rem);height:clamp(1.35rem,5.7vw,2.65rem);overflow:visible}.queens-piece__icon circle{fill:currentColor}.queens-piece--crown{opacity:0;font-family:Apple Color Emoji,Segoe UI Emoji,Noto Color Emoji,sans-serif;font-size:clamp(1.05rem,4.8vw,2.25rem);transform:rotateY(-90deg)translateY(-2%)}.queens-piece-flip--character{animation:queens-character-arrive .36s cubic-bezier(.2, .9, .35, 1.25) both, queens-character-idle 7s ease-in-out var(--queens-idle-delay) infinite;width:92%;height:92%}.queens-piece--character{background-image:var(--queens-character-sheet);background-position:var(--queens-piece-position) 0%;background-repeat:no-repeat;background-size:var(--queens-sheet-width) 200%;filter:drop-shadow(0 1px #ffffff40);inset:4%}.queens-piece-flip--character[data-skin=cats]{--queens-character-sheet:url(/games/queens/skins/cats.png)}.queens-piece-flip--character[data-skin=dogs]{--queens-character-sheet:url(/games/queens/skins/dogs.png)}.queens-piece-flip--character[data-skin=flowers]{--queens-character-sheet:url(/games/queens/skins/flowers.png)}.queens-piece-flip--character[data-conflict=true]{filter:saturate(.75);animation:.52s steps(2,jump-none) infinite queens-character-cross}.queens-piece-flip--character[data-conflict=true] .queens-piece--character{background-position-y:0%}.queens-piece-flip--character[data-celebrating=true]{animation:.92s cubic-bezier(.16,.9,.28,1.35) .52s both queens-character-celebrate}.queens-piece-flip--character[data-celebrating=true] .queens-piece--character{animation:.54s step-end .42s both queens-character-solved-swap}.queens-takeover-layer{pointer-events:none;z-index:2;position:absolute;inset:0;overflow:hidden}.queens-takeover-shape{animation:queens-takeover-grow 1.2s cubic-bezier(.16, .78, .22, 1) var(--queens-takeover-delay) both;aspect-ratio:1;background:var(--queens-takeover-color);left:var(--queens-takeover-left);top:var(--queens-takeover-top);width:var(--queens-takeover-size);border-radius:48% 52% 46% 54%/51% 47% 53% 49%;position:absolute;transform:translate(-50%,-50%)scale(0)}.queens-board[data-complete=true]:not([data-skin=classic]) .queens-cell:before,.queens-board[data-complete=true]:not([data-skin=classic]) .queens-cell:after{animation:.9s .12s both queens-grid-fade}.queens-piece-flip[data-crowned=true] .queens-piece--queen{animation:.84s cubic-bezier(.4,0,.2,1) both queens-flip-out}.queens-piece-flip[data-crowned=true] .queens-piece--crown{animation:.84s cubic-bezier(.4,0,.2,1) both queens-flip-in}@keyframes queens-flip-out{0%{opacity:1;transform:rotateY(0)translateY(-2%)scale(1)}28%{opacity:1;transform:rotateY(0)translateY(-2%)scale(1.24)}52%{opacity:0;transform:rotateY(90deg)translateY(-2%)scale(1.24)}to{opacity:0;transform:rotateY(90deg)translateY(-2%)scale(1)}}@keyframes queens-flip-in{0%,48%{opacity:0;transform:rotateY(-90deg)translateY(-2%)scale(1.24)}54%{opacity:1;transform:rotateY(0)translateY(-2%)scale(1.24)}78%{opacity:1;transform:rotateY(0)translateY(-2%)scale(.92)}to{opacity:1;transform:rotateY(0)translateY(-2%)scale(1)}}@keyframes queens-character-arrive{0%{opacity:0;transform:translateY(18%)scale(.62)}70%{opacity:1;transform:translateY(-4%)scale(1.08)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes queens-character-idle{0%,67%,83%,to{transform:rotate(0)translate(0)}71%{transform:rotate(-4deg)translate(-2%)}75%{transform:rotate(3deg)translate(2%)}79%{transform:rotate(-2deg)translate(0)}}@keyframes queens-character-cross{0%,to{transform:rotate(-5deg)translate(-3%)}50%{transform:rotate(5deg)translate(3%)}}@keyframes queens-character-celebrate{0%{transform:translateY(0)scale(1)}48%{transform:translateY(-18%)scale(1.13)}72%{transform:translateY(2%)scale(.96)}to{transform:translateY(0)scale(1.05)}}@keyframes queens-character-solved-swap{0%{background-position-y:0%}to{background-position-y:100%}}@keyframes queens-grid-fade{to{opacity:0}}@keyframes queens-takeover-grow{0%{opacity:0;transform:translate(-50%,-50%)scale(.12)}35%{opacity:.72}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@media (prefers-reduced-motion:reduce){.queens-cell[data-hint-role=target],.queens-cell[data-hint-kind=mistake],.queens-region-highlight{animation:none}.queens-piece-flip[data-crowned=true] .queens-piece--queen{opacity:0;animation:none}.queens-piece-flip[data-crowned=true] .queens-piece--crown{opacity:1;animation:none;transform:translateY(-2%)}.queens-piece-flip--character,.queens-piece-flip--character[data-conflict=true],.queens-piece-flip--character[data-celebrating=true],.queens-board[data-complete=true]:not([data-skin=classic]) .queens-cell:before,.queens-board[data-complete=true]:not([data-skin=classic]) .queens-cell:after,.queens-takeover-shape{animation-duration:1ms;animation-iteration-count:1;animation-delay:0s}.queens-piece-flip--character[data-celebrating=true] .queens-piece--character{animation-duration:1ms;animation-delay:0s}}