.word-builder-container{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-grow:1;gap:3rem;padding:2rem}.character-display{position:relative;height:300px;display:flex;align-items:center;justify-content:center}.character-display img{height:100%;object-fit:contain;filter:drop-shadow(0 10px 15px rgba(0,0,0,.1));transform-origin:bottom center;transition:filter .2s ease}.idle{animation:float 2s ease-in-out infinite alternate}@keyframes float{0%{transform:translateY(0)}to{transform:translateY(-5px)}}.char-jump{animation:char-jump .3s ease-in-out}@keyframes char-jump{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.char-shake{animation:char-shake .3s ease-in-out}@keyframes char-shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}.dance{animation:dance .5s ease-in-out infinite alternate}@keyframes dance{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-20px) rotate(5deg)}}.drop-zones{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.drop-zone{width:80px;height:80px;border:4px dashed var(--color-zuna-sky);border-radius:var(--radius-md);background:#ffffff80;display:flex;align-items:center;justify-content:center;transition:all .2s}.drop-zone.hover{background:#a8d8ea80;transform:scale(1.1)}.letter-bank{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;min-height:100px;padding:1rem;background:#fff;border-radius:var(--radius-lg);box-shadow:inset 0 2px 10px #0000000d;width:100%;max-width:800px}.draggable-letter{width:70px;height:70px;background:var(--color-leo);color:#fff;font-family:var(--font-heading);font-size:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);cursor:grab;box-shadow:0 4px #d35400;user-select:none;touch-action:none}.draggable-letter:active,.draggable-letter.dragging{cursor:grabbing;transform:translateY(4px);box-shadow:0 0 #d35400}.draggable-letter.locked{cursor:default;box-shadow:none;transform:none;background:var(--color-trust-green);pointer-events:none}.shake{animation:shake .4s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-2px,0,0)}20%,80%{transform:translate3d(4px,0,0)}30%,50%,70%{transform:translate3d(-8px,0,0)}40%,60%{transform:translate3d(8px,0,0)}}@media(max-width:600px){.drop-zone{width:50px;height:50px}.draggable-letter{width:45px;height:45px;font-size:1.5rem;box-shadow:0 2px #d35400}.character-display{height:200px}}