#letter-fun[hidden]{display:none!important}#letter-fun{position:absolute;inset:0;z-index:3;pointer-events:none}#letter-fun button{pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;font-family:inherit}#letter-fun h2{position:absolute;top:48px;left:0;right:0;text-align:center;color:#4e438b;font-size:clamp(26px,5vw,40px);margin:12px}.letter-world .storybook-page,.letter-world #storybook-enter,.letter-world .storybook-welcome,.letter-world .storybook-pet{visibility:hidden}.letter-world .storybook-companion{left:25%;bottom:12%;width:min(52vw,380px);z-index:2}.letter-balloons{position:absolute;top:21%;left:8%;right:8%;display:grid;grid-template-columns:repeat(3,1fr);gap:20px 14px;justify-items:center}.letter-balloon{position:relative;width:clamp(65px,17vw,110px);height:clamp(80px,20vw,130px);border:3px solid #fff9;border-radius:50% 50% 46% 46%;background:radial-gradient(ellipse at 30% 25%,#fff9,transparent 40%),var(--balloon);box-shadow:inset -8px -8px 0 #0000000a,0 8px 12px #52775c22;color:white;font-size:30px;animation:letter-float 3s ease-in-out infinite;animation-delay:var(--delay)}.letter-balloon:after{content:'';position:absolute;top:100%;left:50%;height:17px;border-left:2px solid #6b8d86}.letter-balloon.popped{visibility:hidden}.letter-reveal{position:absolute;bottom:12%;right:5%;width:43%;min-height:180px;border:3px solid white;border-radius:30px;background:#fffbe5e8;color:#5d438c;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 8px 0 #a0c9a755}.letter-symbol{font-size:clamp(45px,10vw,76px);font-weight:900;line-height:1}.letter-picture{font-size:clamp(48px,12vw,80px)}.letter-word{font-size:22px;font-weight:700;line-height:1.1}.letter-status{position:absolute;bottom:3%;left:75px;right:75px;text-align:center;color:#3e6661;font-size:18px}.letter-back,.letter-again{position:absolute;bottom:16px;left:16px;width:54px;height:54px;border-radius:50%;border:3px solid white;background:#ffdf80;font-size:26px}.letter-again{left:auto;right:16px}.letter-world #storybook-close{display:none}#letter-fun button:focus-visible{outline:4px solid #4f3a92;outline-offset:5px}@keyframes letter-float{50%{transform:translateY(-8px) rotate(3deg)}}@media(max-height:650px) and (orientation:portrait){.letter-balloons{top:20%;gap:12px}.letter-balloon{width:60px;height:73px}.letter-world .storybook-companion{bottom:11%;width:48vw}.letter-reveal{min-height:150px;bottom:12%}.letter-symbol{font-size:42px}.letter-picture{font-size:48px}.letter-word{font-size:18px}}@media(orientation:landscape){#letter-fun h2{top:10px}.letter-balloons{top:23%;left:42%;right:4%;grid-template-columns:repeat(6,1fr);gap:6px}.letter-balloon{width:clamp(44px,7vw,76px);height:clamp(56px,10vw,100px)}.letter-world .storybook-companion{left:22%;bottom:5%;width:min(64dvh,380px)}.letter-reveal{right:14%;bottom:16%;width:30%;min-height:100px;flex-direction:row;gap:15px}.letter-word{position:absolute;bottom:8px}.letter-symbol{font-size:52px}.letter-picture{font-size:55px}.letter-reveal{padding-bottom:25px;box-sizing:border-box}}@media(prefers-reduced-motion:reduce){.letter-balloon{animation:none}}
.letter-picture .world-illustration{display:block;width:clamp(55px,14vw,85px);height:clamp(55px,14vw,85px)}