*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Varela Round,Arial Hebrew,sans-serif;background:#e8f4fd;color:#3d3437;overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.site-status{height:100%;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;font-size:22px}.site-status-emoji{font-size:52px}.bouncing{animation:bounce 1.2s ease-in-out infinite;display:inline-block}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}.story-booklet-view{height:100%;position:relative;overflow:hidden}.story-top-bar{position:absolute;top:6px;left:0;right:0;z-index:8;display:flex;align-items:center;justify-content:center;min-height:34px;pointer-events:none}.story-title{font-size:clamp(15px,2.4vh,22px);font-weight:400;color:#fdf6dd;text-shadow:0 1px 10px rgba(20,24,60,.9),0 0 3px rgba(20,24,60,.9)}.story-restart-button{position:absolute;inset-inline-start:10px;top:0;pointer-events:auto;font-family:inherit;font-size:15px;padding:7px 16px;border-radius:999px;border:2px solid rgba(253,246,221,.9);background:#14183c73;color:#fdf6dd;cursor:pointer;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.story-restart-button:hover{background:#14183ca6}.story-stage{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.story-book-perspective{perspective:2600px;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.story-book-sheet{position:relative;width:min(100vw,300dvh);aspect-ratio:3 / 1;transform-style:preserve-3d}.story-book-closed{width:auto;height:min(96dvh,128vw);aspect-ratio:3 / 4;transform:rotateY(-7deg) rotateX(2deg);transition:transform .45s ease}.story-open-book{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;border-radius:10px;overflow:hidden;background:#fffdf6;box-shadow:0 2px #e7dfc8,0 4px #dcd3b8,0 6px #e7dfc8,0 22px 55px #2828506b}.story-page{position:relative;width:50%;height:100%;overflow:hidden}.story-page-clip{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.story-spread-image{position:absolute;top:0;height:100%;width:200%;max-width:none;object-fit:cover}.story-spine{position:absolute;top:0;bottom:0;left:50%;width:30px;transform:translate(-50%);background:linear-gradient(90deg,#0000,#3c325a29 42%,#3c325a3d,#3c325a29 58%,#0000);pointer-events:none}.story-closed-cover{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 3px #e7dfc8,0 6px #dcd3b8,0 26px 60px #28285073}.story-cover-inleaf{position:absolute;box-shadow:none;border-radius:0}.story-cover-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.story-cover-text{position:absolute;top:7%;left:0;right:0;text-align:center;text-shadow:0 2px 14px rgba(20,24,60,.85),0 0 4px rgba(20,24,60,.9)}.story-cover-title{font-size:clamp(24px,5.4vh,46px);color:#fdf6dd;font-weight:400}.story-cover-author{font-size:clamp(15px,2.8vh,24px);color:#e8ddc0;margin-top:6px}.story-leaf{position:absolute;top:0;bottom:0;width:50%;z-index:4;transform-style:preserve-3d;will-change:transform}.story-leaf-left{left:0;transform-origin:100% 50%;animation:leafForward .78s cubic-bezier(.3,.05,.35,1) forwards}.story-leaf-right{right:0;transform-origin:0% 50%;animation:leafBackward .78s cubic-bezier(.3,.05,.35,1) forwards}@keyframes leafForward{0%{transform:rotateY(0)}85%{transform:rotateY(168deg)}to{transform:rotateY(172deg)}}@keyframes leafBackward{0%{transform:rotateY(0)}85%{transform:rotateY(-168deg)}to{transform:rotateY(-172deg)}}.story-leaf-face{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;backface-visibility:hidden;border-radius:10px 0 0 10px}.story-leaf-right .story-leaf-face{border-radius:0 10px 10px 0}.story-leaf-back{transform:rotateY(180deg);background:linear-gradient(105deg,#f3ecd7,#faf5e6 40%,#efe7d0);box-shadow:inset 0 0 40px #78643c2e}.story-leaf-shade{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(90deg,#1e1a3c00 30%,#1e1a3c8c);animation:leafShade .78s linear forwards}.story-leaf-right .story-leaf-shade{background:linear-gradient(-90deg,#1e1a3c00 30%,#1e1a3c8c)}@keyframes leafShade{0%{opacity:0}30%{opacity:.75}60%{opacity:.4}to{opacity:.1}}.story-leaf-back-shade{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(90deg,#3c321e59,#3c321e00 45%);animation:backShade .78s linear forwards}@keyframes backShade{0%,40%{opacity:0}70%{opacity:1}to{opacity:.4}}.story-under-shadow{position:absolute;top:0;bottom:0;width:55%;z-index:3;pointer-events:none}.under-shadow-forward{left:0;background:linear-gradient(90deg,#14123280,#14123200);animation:underShade .78s linear forwards}.under-shadow-backward{right:0;background:linear-gradient(-90deg,#14123280,#14123200);animation:underShade .78s linear forwards}@keyframes underShade{0%{opacity:.9;transform:translate(0)}to{opacity:0}}.story-cover-leaf{position:absolute;top:0;bottom:0;right:0;width:50%;z-index:4;transform-style:preserve-3d;transform-origin:0% 50%;will-change:transform}.cover-open-anim{animation:coverOpen .78s cubic-bezier(.3,.05,.35,1) forwards}.cover-close-anim{animation:coverClose .78s cubic-bezier(.3,.05,.35,1) forwards}@keyframes coverOpen{0%{transform:rotateY(0)}85%{transform:rotateY(-168deg)}to{transform:rotateY(-172deg)}}@keyframes coverClose{0%{transform:rotateY(-172deg)}to{transform:rotateY(0)}}.story-page-corner{position:absolute;bottom:0;width:64px;height:64px;cursor:pointer;z-index:6}.corner-left{left:0}.corner-right{right:0}.story-corner-fold{position:absolute;bottom:0;width:0;height:0;border-style:solid;opacity:.85;transition:all .18s ease}.corner-fold-left{left:0;border-width:0 44px 44px 0;border-color:transparent #fdf6dd transparent transparent;filter:drop-shadow(-2px -2px 3px rgba(60,50,90,.25))}.corner-fold-right{right:0;border-width:44px 44px 0 0;border-color:#fdf6dd transparent transparent transparent;filter:drop-shadow(2px -2px 3px rgba(60,50,90,.25))}.story-page-corner:hover .story-corner-fold{opacity:1}.corner-left:hover .corner-fold-left{border-width:0 58px 58px 0}.corner-right:hover .corner-fold-right{border-width:58px 58px 0 0}.story-page-words{position:absolute;z-index:4;top:16%;bottom:12%;right:3.7%;width:30.5%;display:flex;flex-direction:column;justify-content:center;color:#312b29;font-family:Varela Round,Arial Hebrew,sans-serif;font-size:clamp(12px,2.15vw,25px);line-height:1.5;text-align:center;white-space:pre-wrap;pointer-events:none;text-shadow:0 1px rgba(255,255,255,.45)}.story-page-words span{display:block}@media(max-height:560px){.story-page-words{font-size:clamp(14px,3.6vh,18px);line-height:1.3}}.story-listen-button{position:fixed;bottom:64px;left:50%;transform:translate(-50%);font-family:inherit;font-size:19px;padding:12px 26px;border-radius:999px;border:none;background:#ffe489;color:#453a55;cursor:pointer;box-shadow:0 6px 22px #2828504d;z-index:10}.story-page-indicator{position:absolute;bottom:8px;inset-inline-end:12px;z-index:7;font-size:13px;color:#fdf6dd;opacity:.85;text-shadow:0 1px 6px rgba(20,24,60,.9)}.rotate-prompt{display:none}@media(orientation:portrait)and (max-width:700px){.rotate-prompt{display:flex;position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:#2c3a6e;color:#fdf6dd;font-size:24px;text-align:center;padding:24px}.rotate-prompt-emoji{font-size:64px;animation:rotateHint 1.6s ease-in-out infinite;display:inline-block}@keyframes rotateHint{0%,to{transform:rotate(0)}50%{transform:rotate(90deg)}}}footer,.story-footer{display:none}.story-booklet-view:has(.story-book-closed) .story-top-bar{visibility:hidden}@media(max-height:520px){.story-top-bar{display:none}}.story-spread-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;z-index:2;pointer-events:none}.story-spine{z-index:3}.story-page-words-illustrated{top:10%;bottom:10%;right:3.5%;width:29.5%;min-height:0;color:#40394b;font-size:clamp(14px,2vw,25px);line-height:1.5;text-shadow:0 1px rgba(255,255,255,.65)}@media(max-height:560px){.story-page-words-illustrated{font-size:clamp(14px,3.5vh,17px);line-height:1.36}}
