@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Fredoka,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#ff6b9d,#c44569,#f8b500,#ffa07a,#98d8c8);background-size:400% 400%;animation:gradientShift 15s ease infinite;min-height:100vh}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.app{max-width:950px;margin:0 auto;padding:2rem 1rem;min-height:100vh}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem 1rem}.login-card{background:linear-gradient(135deg,#fff9e6,#fff);border:5px solid #FFD700;border-radius:30px;padding:3rem 2.5rem;box-shadow:0 10px 40px #0003;max-width:450px;width:100%;animation:slideIn .5s ease-out}.login-header{text-align:center;margin-bottom:2.5rem}.login-header h1{font-size:2.5rem;color:#c44569;font-weight:700;margin-bottom:.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.1);animation:bounce 2s ease-in-out infinite}.login-stars{font-size:1.5rem;margin:1rem 0;animation:twinkle 1.5s ease-in-out infinite;letter-spacing:10px}.login-subtitle{font-size:1.1rem;color:#666;margin-top:1rem;font-weight:400}.login-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-label{font-size:1.1rem;font-weight:600;color:#c44569;font-family:Fredoka,sans-serif}.form-input{width:100%;padding:1rem 1rem 1rem 3.5rem;border:4px solid white;border-radius:25px;font-size:1.1rem;background:#fffffff2;box-shadow:0 4px 15px #0000001a;font-family:Fredoka,sans-serif;transition:all .3s}.form-input:focus{outline:none;border-color:gold;box-shadow:0 6px 20px #ffd7004d;transform:scale(1.02)}.form-input:disabled{opacity:.7;cursor:not-allowed}.login-button{padding:1.2rem 2rem;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;border:4px solid white;border-radius:50px;font-size:1.3rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 6px 20px #0000004d;font-family:Fredoka,sans-serif;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem}.login-button:hover:not(:disabled){transform:scale(1.05) translateY(-3px);box-shadow:0 8px 25px #0006;background:linear-gradient(135deg,#45a049,#4caf50)}.login-button:active:not(:disabled){transform:scale(1.02)}.login-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.login-error{background:linear-gradient(135deg,#ff6b6b,#ff4757);color:#fff;padding:1rem;border-radius:20px;text-align:center;font-weight:600;font-size:1rem;box-shadow:0 4px 15px #ff47574d;animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.language-switcher-login{display:flex;justify-content:center;gap:.5rem;margin-top:2rem;background:#ffffff4d;padding:.5rem;border-radius:50px;border:3px solid rgba(255,255,255,.5)}.logout-btn{background:linear-gradient(135deg,#ff6b6b,#ff4757);border:3px solid white;color:#fff;padding:.6rem 1rem;border-radius:50px;cursor:pointer;font-size:1.2rem;transition:all .3s;box-shadow:0 4px 15px #0000004d;font-family:Fredoka,sans-serif}.logout-btn:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 6px 20px #0006}.header{text-align:center;margin-bottom:3rem;color:#fff;text-shadow:3px 3px 6px rgba(0,0,0,.3)}.header-content{margin-bottom:1.5rem}.header-actions{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap}.language-switcher{display:flex;gap:.5rem;background:#fff3;padding:.3rem;border-radius:50px;border:3px solid rgba(255,255,255,.3)}.lang-btn{background:transparent;border:none;color:#fff;padding:.6rem 1.2rem;border-radius:50px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s;font-family:Fredoka,sans-serif;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.lang-btn:hover{background:#fff3;transform:scale(1.05)}.lang-btn.active{background:#fff;color:#c44569;box-shadow:0 4px 15px #0000004d;text-shadow:none}.header h1{font-size:3rem;font-weight:700;margin-bottom:.5rem;animation:bounce 2s ease-in-out infinite;letter-spacing:2px}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.stars{font-size:1.5rem;animation:twinkle 1.5s ease-in-out infinite;letter-spacing:10px}@keyframes twinkle{0%,to{opacity:1}50%{opacity:.5}}.favorites-toggle{background:linear-gradient(135deg,gold,orange);border:4px solid white;color:#333;padding:1rem 2rem;border-radius:50px;cursor:pointer;font-size:1.2rem;font-weight:600;transition:all .3s;box-shadow:0 6px 20px #0000004d;font-family:Fredoka,sans-serif}.favorites-toggle:hover{transform:scale(1.1) translateY(-3px);box-shadow:0 8px 25px #0006}.favorites-toggle:active{transform:scale(1.05)}.options-section{background:#fffffff2;border:4px solid #FFD700;border-radius:25px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 6px 20px #00000026;display:flex;gap:2rem;flex-wrap:wrap;justify-content:center}.option-group{display:flex;flex-direction:column;gap:.8rem;align-items:center}.option-label{font-size:1.1rem;font-weight:600;color:#c44569;text-align:center;font-family:Fredoka,sans-serif}.option-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.option-btn{background:linear-gradient(135deg,#ffe5b4,gold);border:3px solid #FFA500;padding:.6rem 1.5rem;border-radius:20px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s;color:#333;font-family:Fredoka,sans-serif;box-shadow:0 3px 10px #0003}.option-btn:hover:not(:disabled){transform:scale(1.05) translateY(-2px);box-shadow:0 5px 15px #0000004d}.option-btn:disabled{opacity:.6;cursor:not-allowed}.option-btn.active{background:linear-gradient(135deg,#ff91a4,#ff6b9d);border-color:#c44569;color:#fff;box-shadow:0 4px 15px #c4456966}.input-section{display:flex;gap:1rem;margin-bottom:2.5rem;flex-wrap:wrap}.input-wrapper{flex:1;position:relative;min-width:250px}.input-icon{position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:1.5rem;z-index:1}.theme-input,.search-input{width:100%;padding:1.3rem 1.3rem 1.3rem 3.5rem;border:4px solid white;border-radius:30px;font-size:1.2rem;background:#fffffff2;box-shadow:0 6px 20px #0003;font-family:Fredoka,sans-serif;transition:all .3s}.theme-input:focus,.search-input:focus{outline:none;border-color:gold;box-shadow:0 8px 25px #ffd70066;transform:scale(1.02)}.generate-btn{padding:1.3rem 2.5rem;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;border:4px solid white;border-radius:50px;font-size:1.3rem;font-weight:600;cursor:pointer;transition:all .3s;white-space:nowrap;box-shadow:0 6px 20px #0000004d;font-family:Fredoka,sans-serif;display:flex;align-items:center;gap:.5rem}.generate-btn:hover:not(:disabled){transform:scale(1.1) translateY(-3px);box-shadow:0 8px 25px #0006;background:linear-gradient(135deg,#45a049,#4caf50)}.generate-btn:active:not(:disabled){transform:scale(1.05)}.generate-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.spinner{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.story-container,.favorite-story{background:linear-gradient(135deg,#fff9e6,#fff);border:5px solid #FFD700;border-radius:30px;padding:2.5rem;box-shadow:0 10px 40px #0003;margin-bottom:2rem;position:relative;animation:slideIn .5s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.story-decoration-top,.story-decoration-bottom{text-align:center;font-size:1.5rem;margin:1rem 0;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.story-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:3px dashed #FFD700;flex-wrap:wrap;gap:1rem}.story-header h2,.story-header h3{font-size:2rem;color:#c44569;flex:1;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.story-header h3{font-size:1.8rem}.story-actions{display:flex;gap:.8rem;flex-wrap:wrap}.favorite-btn,.speak-btn{background:linear-gradient(135deg,#ffe5b4,gold);border:3px solid #FFA500;padding:.8rem 1.5rem;border-radius:25px;cursor:pointer;font-size:1.3rem;transition:all .3s;color:#333;font-weight:600;box-shadow:0 4px 15px #0003;font-family:Fredoka,sans-serif}.favorite-btn:hover,.speak-btn:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 6px 20px #0000004d}.favorite-btn:active,.speak-btn:active{transform:scale(1.05)}.favorite-btn.active{background:linear-gradient(135deg,gold,orange);border-color:#ff8c00;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.speak-btn{display:flex;align-items:center;gap:.5rem}.speak-btn.stop{background:linear-gradient(135deg,#ff6b6b,#ff4757);border-color:#ff4757;color:#fff}.story-content{line-height:2;color:#444;font-size:1.2rem;white-space:pre-wrap;padding:1rem 0;font-weight:400}.favorites-section{background:linear-gradient(135deg,#fff9e6,#fff);border:5px solid #FFD700;border-radius:30px;padding:2.5rem;box-shadow:0 10px 40px #0003;animation:slideIn .5s ease-out}.search-section{margin-bottom:2rem}.favorites-list{display:flex;flex-direction:column;gap:1rem}.accordion-item{background:linear-gradient(135deg,#fff9e6,#fff);border:5px solid #FFD700;border-radius:30px;overflow:hidden;box-shadow:0 6px 20px #00000026;transition:all .3s ease}.accordion-item.expanded{box-shadow:0 10px 40px #0003}.accordion-header{padding:1.5rem 2rem;cursor:pointer;background:linear-gradient(135deg,#ffb6c1,#ff91a4);border-bottom:3px dashed #C44569;transition:all .3s ease;-webkit-user-select:none;user-select:none}.accordion-header:hover{background:linear-gradient(135deg,#ff91a4,#ff6b9d);transform:scale(1.01)}.accordion-header-content{display:flex;justify-content:space-between;align-items:center;gap:1rem}.accordion-header h3{font-size:1.8rem;color:#c44569;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.1);margin:0;flex:1}.accordion-icon{font-size:1.5rem;color:#c44569;transition:transform .3s ease;font-weight:700;min-width:30px;text-align:center}.accordion-item.expanded .accordion-icon{transform:rotate(0)}.accordion-item:not(.expanded) .accordion-icon{transform:rotate(-90deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height .4s ease-out,padding .4s ease-out;padding:0 2rem}.accordion-body.open{max-height:5000px;padding:2rem;transition:max-height .5s ease-in,padding .5s ease-in}.accordion-body .story-content{padding:1.5rem 0;margin-bottom:1rem}.story-actions-container{display:flex;justify-content:flex-end;padding:1rem 0;border-top:3px dashed #FFD700;margin-top:1rem}.empty-state{text-align:center;padding:4rem 2rem;color:#666}.empty-emoji{font-size:5rem;margin-bottom:1rem;animation:bounce 2s ease-in-out infinite}.empty-state p{font-size:1.5rem;margin-bottom:.5rem;color:#c44569;font-weight:500}.empty-hint{font-size:1.2rem!important;color:#888!important;font-weight:400!important}@media(max-width:768px){.app{padding:1rem}.header h1{font-size:2rem}.stars{font-size:1.2rem;letter-spacing:5px}.header-actions{flex-direction:column;gap:1rem}.language-switcher{order:2}.favorites-toggle{order:1;width:100%;max-width:300px}.lang-btn{font-size:.9rem;padding:.5rem 1rem}.input-section{flex-direction:column}.input-wrapper{width:100%}.generate-btn{width:100%;justify-content:center}.story-header{flex-direction:column;align-items:flex-start}.story-header h2,.story-header h3{font-size:1.5rem}.story-actions{width:100%;justify-content:flex-end;flex-wrap:wrap;gap:.5rem}.story-content{font-size:1.1rem}.favorite-btn,.speak-btn{font-size:1.1rem;padding:.6rem 1.2rem}.options-section{flex-direction:column;gap:1.5rem;padding:1.2rem}.option-group{width:100%}.option-buttons{width:100%;justify-content:center}.option-btn{flex:1;min-width:80px;justify-content:center}.accordion-header{padding:1.2rem 1.5rem}.accordion-header h3{font-size:1.4rem}.accordion-body{padding:0 1.5rem}.accordion-body.open{padding:1.5rem}.accordion-body .story-content{font-size:1.1rem}.login-card{padding:2rem 1.5rem}.login-header h1{font-size:2rem}.login-subtitle{font-size:1rem}.form-input{font-size:1rem;padding:.9rem .9rem .9rem 3rem}.login-button{font-size:1.1rem;padding:1rem 1.5rem}}