.tile{position:absolute;left:0;top:0;display:grid;place-items:center;border-radius:24%;background:linear-gradient(160deg,#46336c,#332355 55%,#2a1c47);border:1px solid rgba(200,168,245,.16);box-shadow:inset 0 1px #ffffff17,0 3px 6px #00000059;transition:translate .22s cubic-bezier(.34,1.3,.64,1);cursor:grab;-webkit-user-select:none;user-select:none}.tile .glyph{font-size:calc(var(--tile) * .58);pointer-events:none}img.glyph{filter:drop-shadow(0 2px 2px rgba(13,6,32,.4));-webkit-user-select:none;user-select:none}.tile img.glyph{width:calc(var(--tile) * .76);height:calc(var(--tile) * .76)}.tile.sel{z-index:5;scale:1.07;border-color:#ffbe6be6;box-shadow:0 0 0 2px #ffbe6bd9,0 0 16px #ffbe6b80,0 3px 6px #00000059}.tile.drag{z-index:10;transition:none;scale:1.12;cursor:grabbing;border-color:#c8a8f580;box-shadow:0 8px 18px #00000080,0 0 14px #c8a8f559}.tile.drag.sel{border-color:#ffbe6be6;box-shadow:0 0 0 2px #ffbe6bd9,0 0 16px #ffbe6b80,0 8px 18px #00000080}.tile.wiggle{animation:wiggle .3s}@keyframes wiggle{25%{rotate:-7deg}75%{rotate:7deg}}.tile.spawn-in{animation:spawnIn .32s cubic-bezier(.34,1.5,.64,1)}@keyframes spawnIn{0%{scale:0;rotate:-90deg}}.tile.sp-broom-h .glyph,.tile.sp-broom-v .glyph{animation:broomWob 1.1s ease-in-out infinite}@keyframes broomWob{50%{transform:rotate(12deg)}}.tile.sp-broom-h,.tile.sp-broom-v{border-color:#ffdf9e8c;box-shadow:inset 0 1px #ffffff17,0 0 10px #ffdf9e47,0 3px 6px #00000059}.tile.sp-broom-h{background-image:linear-gradient(0deg,transparent 28%,rgba(255,223,158,.16) 50%,transparent 72%),linear-gradient(160deg,#46336c,#332355 55%,#2a1c47)}.tile.sp-broom-v{background-image:linear-gradient(90deg,transparent 28%,rgba(255,223,158,.16) 50%,transparent 72%),linear-gradient(160deg,#46336c,#332355 55%,#2a1c47)}.tile.sp-cauldron{z-index:1;border-color:#8ee6a1b3;box-shadow:0 0 0 2px #8ee6a180,0 0 16px #8ee6a173,0 3px 6px #00000059;animation:cauldronPulse 1.3s ease-in-out infinite}@keyframes cauldronPulse{50%{scale:1.07}}.tile.sp-brew{z-index:1;background:conic-gradient(from 0deg,#ffb3da,#ffe9a8,#b8f0c5,#b5ece4,#ddc6ff,#ffb3da);box-shadow:0 0 16px #ff8fc9b3,inset 0 0 12px #fff9}.tile.sp-brew .glyph{animation:brewTwirl 2.6s linear infinite}@keyframes brewTwirl{to{transform:rotate(360deg)}}.tile.sel.sp-broom-h:after,.tile.sel.sp-broom-v:after,.tile.sel.sp-cauldron:after,.tile.sel.sp-brew:after{content:"";position:absolute;inset:-5px;border-radius:inherit;padding:3px;pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}.tile.sel.sp-broom-h:after{background:repeating-linear-gradient(90deg,#ffdf9ef2 0 10px,#ffdf9e33 10px 18px);animation:broomAntsH .8s linear infinite}@keyframes broomAntsH{to{background-position:18px 0}}.tile.sel.sp-broom-v:after{background:repeating-linear-gradient(0deg,#ffdf9ef2 0 10px,#ffdf9e33 10px 18px);animation:broomAntsV .8s linear infinite}@keyframes broomAntsV{to{background-position:0 -18px}}.tile.sel.sp-broom-h,.tile.sel.sp-broom-v{box-shadow:0 0 18px #ffdf9e8c,0 3px 6px #00000059}.tile.sel.sp-cauldron:after{background:linear-gradient(#f0fff4f2,#8ee6a1f2);animation:cauldronRing 1.3s ease-in-out -.65s infinite}@keyframes cauldronRing{50%{inset:-8px;opacity:.7}}.tile.sel.sp-cauldron{box-shadow:0 0 20px #8ee6a1a6,0 3px 6px #00000059}@property --brew-a{syntax: "<angle>"; inherits: false; initial-value: 0deg;}.tile.sel.sp-brew:after{background:conic-gradient(from var(--brew-a),#ffb3da,#ffe9a8,#b8f0c5,#b5ece4,#ddc6ff,#ffb3da);animation:brewRing 2.2s linear infinite}@keyframes brewRing{to{--brew-a: 360deg}}.tile.sel.sp-brew{outline:2px solid rgba(20,10,40,.9);box-shadow:0 0 14px #ff8fc98c,inset 0 0 12px #fff9}.tile.sel.sp-brew:after{inset:-7px}.tile.hint{z-index:4;animation:hintGlow calc(var(--hint-breath, 2.4) * 1s) ease-in-out infinite}@keyframes hintGlow{0%,to{box-shadow:0 0 0 calc(var(--hint-ring, 0) * 1px) #ffdf9e38,0 0 7px rgba(255,223,158,calc(.16 * var(--hint-glow, 1))),0 3px 6px #00000059}50%{box-shadow:0 0 0 calc(var(--hint-ring, 0) * 1.5px) #ffdf9e8c,0 0 17px rgba(255,223,158,calc(.55 * var(--hint-glow, 1))),0 3px 6px #00000059}}.tile.hint:before{content:"";position:absolute;inset:-11%;border-radius:50%;pointer-events:none;background:radial-gradient(circle 1.9px at 14% 22%,#fff6e0 0 40%,transparent 60%),radial-gradient(circle 1.6px at 88% 34%,#ffd76e 0 40%,transparent 60%),radial-gradient(circle 1.7px at 46% 96%,#fff6e0 0 40%,transparent 60%);animation:hintGlitter calc(var(--hint-breath, 2.4) * 1.5s) linear infinite}@keyframes hintGlitter{0%{opacity:calc(.14 * var(--hint-sparkles, 1));transform:rotate(0)}50%{opacity:calc(.75 * var(--hint-sparkles, 1));transform:rotate(180deg)}to{opacity:calc(.14 * var(--hint-sparkles, 1));transform:rotate(360deg)}}.tile.hint .glyph{animation:hintJiggle calc(var(--hint-breath, 2.4) * 1.08s) ease-in-out infinite}@keyframes hintJiggle{0%,26%,to{transform:translateY(0) rotate(0)}8%{transform:translateY(calc(-5% * var(--hint-jiggle, 1))) rotate(calc(-3deg * var(--hint-jiggle, 1)))}17%{transform:translateY(calc(-3% * var(--hint-jiggle, 1))) rotate(calc(2.5deg * var(--hint-jiggle, 1)))}}.shuffling .stir-el{pointer-events:none;z-index:3;will-change:transform,opacity}.shuffle-swirl.shuffle-out .stir-el{animation:stirOut .24s ease-in both}@keyframes stirOut{0%{transform:none;opacity:1}to{transform:translate(var(--sx, 0),var(--sy, 0)) rotate(200deg) scale(.2);opacity:.15}}.shuffle-swirl.shuffle-in .stir-el{animation:stirIn .32s cubic-bezier(.16,1,.3,1) both}@keyframes stirIn{0%{transform:translate(var(--sx, 0),var(--sy, 0)) rotate(-200deg) scale(.2);opacity:.2}55%{opacity:1}to{transform:none;opacity:1}}.shuffle-jumble.shuffle-out .stir-el{animation:jumbleOut .36s ease-in both;animation-delay:var(--sd, 0ms)}@keyframes jumbleOut{0%{transform:none}25%{transform:translateY(-14%) rotate(-9deg)}50%{transform:translateY(-16%) rotate(10deg)}75%{transform:translateY(-13%) rotate(-6deg);opacity:1}to{transform:translateY(10%) scale(.85);opacity:0}}.shuffle-jumble.shuffle-in .stir-el{animation:jumbleIn .38s cubic-bezier(.3,1.4,.5,1) both;animation-delay:var(--sd, 0ms)}@keyframes jumbleIn{0%{transform:translateY(-45%) scale(.9);opacity:0}to{transform:none;opacity:1}}.shuffle-fade.shuffle-out .stir-el{animation:stirFadeOut .26s ease-out both}@keyframes stirFadeOut{to{opacity:0}}.shuffle-fade.shuffle-in .stir-el{animation:stirFadeIn .3s ease-in both}@keyframes stirFadeIn{0%{opacity:0}}.shuffle-fade:after{content:"🥄";position:absolute;left:50%;top:50%;z-index:4;font-size:calc(var(--tile, 40px) * 1.3);pointer-events:none;animation:spoonStir .56s ease-in-out both}@keyframes spoonStir{0%{transform:translate(-160%,-50%) rotate(-30deg);opacity:0}25%{opacity:1}50%{transform:translate(-50%,-50%) rotate(12deg)}to{transform:translate(60%,-50%) rotate(40deg);opacity:0}}@media(prefers-reduced-motion:reduce){.shuffling .stir-el{animation:none}.shuffle-fade:after{content:none}.tile.sp-brew .glyph,.tile.sp-cauldron,.tile.sp-broom-h .glyph,.tile.sp-broom-v .glyph,.tile.sel,.tile.sel.sp-broom-h:after,.tile.sel.sp-broom-v:after,.tile.sel.sp-cauldron:after,.tile.sel.sp-brew:after,.tile.hint,.tile.hint:before,.tile.hint .glyph{animation:none}.tile.hint{box-shadow:0 0 0 calc(var(--hint-ring, 0) * 1.5px) #ffdf9e8c,0 0 17px rgba(255,223,158,calc(.55 * var(--hint-glow, 1))),0 3px 6px #00000059}.tile.hint:before{opacity:calc(.75 * var(--hint-sparkles, 1))}.tile{transition-duration:.12s}}