@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap");*{margin:0;padding:0;box-sizing:border-box}body,html{height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;touch-action:manipulation}.mobile-story-container,body,html{overflow:hidden;font-family:Nunito,sans-serif!important}.mobile-story-container{position:relative;width:100vw;height:100vh;background:#000}.mobile-progress-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4,#ffeaa7);z-index:1000;transition:width .2s ease}.mobile-loading{width:100vw;height:100vh;background:linear-gradient(135deg,#059669,#047857 30%,#fbbf24 70%,#f59e0b);display:flex;align-items:center;justify-content:center;color:white;font-family:Nunito,sans-serif!important}.loading-content{text-align:center;padding:2rem}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.3);border-top-color:white;border-radius:50%;margin:0 auto 1.5rem}.loading-text{font-size:1.1rem;font-weight:600;margin-bottom:.5rem}.loading-text,.personalized-loading{font-family:Nunito,sans-serif!important}.personalized-loading{font-size:.9rem;opacity:.8;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}.mobile-error{width:100vw;height:100vh;background:linear-gradient(135deg,#059669,#047857 30%,#fbbf24 70%,#f59e0b);display:flex;align-items:center;justify-content:center;color:white;font-family:Nunito,sans-serif!important}.error-content{text-align:center;padding:2rem}.error-icon{font-size:3rem;margin-bottom:1rem}.error-text{font-size:1.1rem;margin-bottom:1.5rem}.error-button,.error-text{font-weight:600;font-family:Nunito,sans-serif!important}.error-button{background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.3);color:white;padding:.75rem 1.5rem;border-radius:25px;cursor:pointer;transition:all .2s ease}.error-button:hover{background:rgba(255,255,255,.3);transform:scale(1.05)}.mobile-pages-container{width:100%;height:100%;position:relative}.mobile-page{position:absolute;top:0;left:0;width:100%;padding:1.5rem 1rem;overflow:hidden;font-family:Nunito,sans-serif!important;transition:all .3s ease}.mobile-page,.title-page{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.title-page{background:linear-gradient(135deg,#059669,#047857 30%,#fbbf24 70%,#f59e0b);padding:4rem 1rem 2rem;text-align:center;position:relative}.title-content{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:90%;text-align:center}.mobile-story-title{font-size:clamp(2.2rem,10vw,3.5rem)!important;font-weight:900!important;color:white!important;text-shadow:0 4px 20px rgba(0,0,0,.3)!important;margin-bottom:1.5rem!important;line-height:1.2!important;letter-spacing:-.02em!important;text-align:center}.mobile-story-meta{display:flex;gap:.6rem;margin-bottom:1.5rem;flex-wrap:wrap;justify-content:center;align-items:center}.meta-badge{padding:.3rem .6rem;border-radius:16px;font-size:clamp(.8rem,2.5vw,1rem)!important;min-width:auto;background:transparent!important;border:1px solid rgba(255,255,255,.3)!important}.meta-badge,.personalization-badge{font-weight:600!important;color:white!important;text-shadow:0 1px 3px rgba(0,0,0,.3)!important;text-align:center}.personalization-badge{background:rgba(255,255,255,.2)!important;padding:.5rem 1rem!important;border-radius:20px!important;font-size:clamp(.9rem,3vw,1.1rem)!important;margin-bottom:1.5rem!important;border:1px solid rgba(255,255,255,.3)!important}.learning-section{width:100%;max-width:85%;margin-bottom:1rem;text-align:center}.section-title{font-size:clamp(.9rem,3.2vw,1.2rem)!important;font-weight:700!important;color:white!important;text-shadow:0 2px 8px rgba(0,0,0,.3)!important;margin-bottom:.6rem!important;text-align:center}.learning-list{display:flex;flex-direction:column;gap:.3rem;align-items:center;width:100%}.learning-item{background:rgba(255,255,255,.15)!important;backdrop-filter:blur(10px)!important;padding:.3rem .6rem!important;border-radius:8px!important;font-size:clamp(.75rem,2.8vw,.9rem)!important;font-weight:500!important;color:white!important;text-shadow:0 1px 3px rgba(0,0,0,.3)!important;text-align:center;border:1px solid rgba(255,255,255,.2)!important;justify-content:center;width:100%;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:auto;line-height:1.2;margin:0}.bullet{color:#ffd89b;font-weight:900;font-size:.8rem}.scroll-hint{position:fixed!important;bottom:2rem!important;left:50%!important;transform:translateX(-50%)!important;color:white!important;font-size:clamp(.7rem,2.2vw,.9rem)!important;font-weight:500!important;text-shadow:0 2px 8px rgba(0,0,0,.3)!important;text-align:center!important;white-space:nowrap!important;width:auto!important;margin:0!important;padding:0!important;z-index:9999!important;background:transparent!important;border:none!important;outline:none!important;animation:gentleBounce 2s ease-in-out infinite!important}.hint-text{font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;margin-bottom:.3rem;opacity:.9;font-family:Nunito,sans-serif!important}.hint-arrow{display:inline-block;margin-left:.2rem;animation:gentleBounce 2s ease-in-out infinite!important}@keyframes gentleBounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-8px)}60%{transform:translateY(-4px)}}.story-content{position:relative}.mobile-page-text{font-weight:800!important;text-align:center!important;color:white!important;text-shadow:0 2px 12px rgba(0,0,0,.18)!important;line-height:1.3!important;max-width:100%!important;word-wrap:break-word!important;overflow-wrap:break-word!important;hyphens:auto!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:50vh!important;padding:1rem!important;font-family:Nunito,sans-serif!important;word-spacing:.05em!important;letter-spacing:-.01em!important;font-size:clamp(1.5rem,7vw,2.5rem)!important}@keyframes fadeInText{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.words-5-15{font-size:clamp(2.2rem,10vw,3.5rem)!important;font-weight:900!important}.words-16-25{font-size:clamp(2rem,9vw,3.2rem)!important;font-weight:800!important}.words-26-35{font-size:clamp(1.8rem,8vw,2.8rem)!important;font-weight:700!important}.words-36-45{font-size:clamp(1.6rem,7vw,2.4rem)!important;font-weight:600!important;line-height:1.4!important}.words-46-plus{font-size:clamp(1.4rem,6vw,2.2rem)!important;font-weight:600!important;line-height:1.5!important}.page-number-indicator{position:absolute;bottom:1rem;right:1rem;background:rgba(0,0,0,.5);color:white;padding:.4rem .8rem;border-radius:12px;font-size:.75rem;font-weight:600;font-family:Nunito,sans-serif!important}.bg-forest-ambient{background:linear-gradient(135deg,#34d399,#10b981 50%,#059669);color:#ffffff}.bg-night-sky{background:linear-gradient(135deg,#3b82f6,#1d4ed8 50%,#1e40af);color:#ffffff}.bg-ocean-waves{background:linear-gradient(135deg,#06b6d4,#0891b2 50%,#0e7490);color:#ffffff}.bg-magical-sparkles{background:linear-gradient(135deg,#8b5cf6,#7c3aed 50%,#6d28d9);color:#ffffff}.bg-cozy-indoor{background:linear-gradient(135deg,#f97316,#ea580c 50%,#c2410c);color:#ffffff}.bg-adventure-action{background:linear-gradient(135deg,#ef4444,#dc2626 50%,#b91c1c);color:#ffffff}.bg-peaceful-meadow{background:linear-gradient(135deg,#84cc16,#65a30d 50%,#4d7c0f);color:#ffffff}.bg-mysterious-cave{background:linear-gradient(135deg,#6b7280,#4b5563 50%,#374151);color:#ffffff}.bg-sunny-day{background:linear-gradient(135deg,#fbbf24,#f59e0b 50%,#ffd700);color:#fff}.bg-warm-home{background:linear-gradient(135deg,#fdba74,#fbbf24 50%,#f59e0b);color:#fff}.bg-garden-bloom{background:linear-gradient(135deg,#34d399,#10b981 50%,#059669);color:#fff}.bg-default-bright{background:linear-gradient(135deg,#fbbf24,#f59e0b 50%,#10b981);color:#ffffff}.end-page{background:linear-gradient(135deg,#059669,#047857 30%,#fbbf24 70%,#f59e0b);color:white}.end-content{text-align:center;max-width:100%;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.end-title{font-size:clamp(2.8rem,12vw,5rem);font-weight:900;margin-bottom:1rem;font-family:Nunito,sans-serif!important;text-align:center}.end-message{display:flex;flex-direction:column;gap:1rem;align-items:center;flex:1;justify-content:center}.characters-section,.emotions-section,.moral-section{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:15px;padding:.8rem;border:1px solid rgba(255,255,255,.2);text-align:center;width:100%;max-width:90%}.moral-text{font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;line-height:1.4;font-family:Nunito,sans-serif!important;text-align:center;margin-top:.3rem}.emotions-list{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin-top:.5rem}.emotion-badge{background:rgba(255,255,255,.2);padding:.3rem .6rem;border-radius:12px;font-size:clamp(.7rem,2.2vw,.8rem);font-weight:600;border:1px solid rgba(255,255,255,.3);font-family:Nunito,sans-serif!important}.characters-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;align-items:center}.character-card{text-align:center;padding:.3rem 0;width:100%}.character-name{font-weight:700;margin-bottom:.2rem;color:#ffd89b;font-size:clamp(.8rem,2.5vw,.9rem)}.character-desc,.character-name{font-family:Nunito,sans-serif!important;text-align:center}.character-desc{font-size:clamp(.7rem,2.2vw,.8rem);opacity:.9;line-height:1.3}.discussion-page{background:linear-gradient(135deg,#059669,#047857 30%,#fbbf24 70%,#f59e0b);color:white}.discussion-content{text-align:center;max-width:100%;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.discussion-header{margin-bottom:1rem;text-align:center}.discussion-title{font-size:clamp(2rem,8vw,2.5rem);font-weight:900;line-height:1.2;margin-bottom:.5rem;text-shadow:0 4px 20px rgba(0,0,0,.3)}.discussion-title,.personalized-thanks{font-family:Nunito,sans-serif!important;text-align:center}.personalized-thanks{font-size:1rem;font-weight:600;color:#ffd89b}.discussion-section{margin-bottom:1rem;text-align:center;flex:1;display:flex;flex-direction:column;justify-content:center}.discussion-list{display:flex;flex-direction:column;gap:.6rem;margin-top:.5rem;align-items:center}.discussion-item{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);padding:.6rem .8rem;border-radius:12px;text-align:center;font-size:clamp(.9rem,2.8vw,1.1rem);font-weight:600;line-height:1.3;border:1px solid rgba(255,255,255,.2);font-family:Nunito,sans-serif!important;width:100%;max-width:90%}.story-actions{flex-direction:column;gap:.6rem;margin-top:1rem}.action-button,.story-actions{display:flex;align-items:center}.action-button{background:rgba(255,255,255,.2);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);color:white;padding:.7rem 1rem;border-radius:25px;font-weight:600;cursor:pointer;transition:all .2s ease;justify-content:center;gap:.5rem;font-family:Nunito,sans-serif!important;font-size:clamp(.9rem,2.5vw,1rem)}.action-button:hover{background:rgba(255,255,255,.3);transform:scale(1.02)}.action-button.liked{background:rgba(255,255,255,.3);color:white}@media (max-width:480px){.mobile-page{padding:1rem .8rem}.mobile-story-title{font-size:clamp(2.2rem,9vw,2.8rem);margin-bottom:.8rem}.mobile-page-text{font-size:clamp(1.4rem,6vw,2rem);padding:.8rem}.discussion-item{font-size:clamp(.8rem,2.5vw,1rem);padding:.5rem .7rem}.end-title{font-size:clamp(2.2rem,10vw,3rem)}.discussion-title{font-size:clamp(1.6rem,7vw,2rem)}}@media (hover:none) and (pointer:coarse){.action-button{min-height:44px;min-width:44px}}@media (min-width:768px){.title-content{max-width:70%}.learning-section{max-width:60%}.learning-item{max-width:80%;padding:.3rem .6rem!important;font-size:clamp(.7rem,2vw,.9rem)!important}.mobile-story-title{font-size:clamp(2rem,8vw,3rem)!important}.meta-badge{font-size:clamp(.7rem,2vw,.9rem)!important;padding:.25rem .5rem}.personalization-badge{font-size:clamp(.8rem,2.5vw,1rem)!important;padding:.4rem .8rem!important}.section-title{font-size:clamp(.9rem,3vw,1.2rem)!important}.scroll-hint{font-size:clamp(.6rem,1.8vw,.8rem)!important}}@media (max-width:767px){.title-content{max-width:95%}.learning-section{max-width:90%}.learning-item{max-width:100%}}