.intro-page{width:100%;height:100vh;background:linear-gradient(135deg,#ffeef8,#ffe0f0,#ffcce5);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.highlight{color:#0ff;font-size:larger}.intro-content{text-align:center;z-index:10;animation:fadeInUp 1s ease-out}.intro-title{font-size:2.5rem;color:#ff1493;margin-bottom:2rem;text-shadow:4px 4px 0px rgba(255,20,147,.5);font-weight:400;line-height:1.5}@media (max-width: 767px){.intro-title{font-size:1rem;text-shadow:1px 1px 0px rgba(255,20,147,.5)}}.intro-subtitle{font-size:1rem;color:#ff69b4;margin-bottom:3rem;font-weight:400;line-height:1.8}.start-button{padding:20px 40px;font-size:1rem;background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff;border:4px solid #fff;border-radius:0;cursor:pointer;box-shadow:8px 8px #0003;transition:all .1s ease;font-family:"Press Start 2P",cursive;font-weight:400}.start-button:hover{transform:translate(-4px,-4px);box-shadow:12px 12px #0000004d}.start-button:active{transform:translate(0);box-shadow:4px 4px #0003}.hearts-background{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;overflow:hidden}.heart{position:absolute;width:32px;height:32px;opacity:.7;animation:floatUp 5s ease-in infinite;top:100%;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.heart:before,.heart:after{content:"";position:absolute}.heart:before{width:4px;height:4px;box-shadow:8px 0 #ff69b4,12px 0 #ff69b4,20px 0 #ff69b4,24px 0 #ff69b4,4px 4px #ff69b4,8px 4px #ff1493,12px 4px #ff1493,16px 4px #ff69b4,20px 4px #ff1493,24px 4px #ff1493,28px 4px #ff69b4,4px 8px #ff69b4,8px 8px #ff1493,12px 8px #ff1493,16px 8px #ff1493,20px 8px #ff1493,24px 8px #ff1493,28px 8px #ff69b4,4px 12px #ff69b4,8px 12px #ff1493,12px 12px #ff1493,16px 12px #ff1493,20px 12px #ff1493,24px 12px #ff1493,28px 12px #ff69b4,8px 16px #ff69b4,12px 16px #ff1493,16px 16px #ff1493,20px 16px #ff1493,24px 16px #ff69b4,12px 20px #ff69b4,16px 20px #ff1493,20px 20px #ff69b4,16px 24px #ff69b4}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.path-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0}.story-page{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:10;transform-style:preserve-3d;transition:transform .8s ease-in-out,opacity .8s ease-in-out;backface-visibility:hidden}.story-card{display:flex;background:#fffffff2;border-radius:0;border:8px solid #ff69b4;box-shadow:12px 12px #0000004d;max-width:1200px;width:90%;max-height:70vh;height:70vh;overflow:hidden;gap:0}.story-image-container{flex:1;min-width:0;max-height:70vh;display:flex;align-items:center;justify-content:center;background:#f8f8f8;border-right:4px solid #ff69b4;overflow:hidden}.story-image{width:100%;height:100%;object-fit:contain;max-height:100%}.story-text-container{flex:1;padding:60px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative}.story-text{font-size:.9rem;line-height:2;color:#333;font-weight:400;margin:0}.page-indicator{position:absolute;bottom:30px;font-size:.7rem;color:#ff69b4;font-weight:400}.page-active{transform:rotateY(0);opacity:1}.page-exit-forward{transform:rotateY(180deg);opacity:0}.page-enter-forward,.page-exit-backward{transform:rotateY(-180deg);opacity:0}.page-enter-backward{transform:rotateY(180deg);opacity:0}@media (max-width: 768px){.story-card{flex-direction:column;max-height:85vh}.story-image-container{height:40%}.story-text-container{padding:40px 30px}.story-text{font-size:.6rem;line-height:2}}.nav-button{position:fixed;top:50%;transform:translateY(-50%);width:60px;height:60px;border-radius:0;background:#ff69b4;border:4px solid #fff;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .1s ease;box-shadow:6px 6px #0000004d;z-index:20}@media (max-width: 767){.nav-button{width:60px;height:60px}}.nav-button:hover:not(:disabled){background:#ff1493;transform:translateY(-50%) translate(-3px,-3px);box-shadow:9px 9px #0000004d}.nav-button:active:not(:disabled){transform:translateY(-50%) translate(0);box-shadow:3px 3px #0000004d}.nav-button:disabled{opacity:.3;cursor:not-allowed}.nav-button-prev{left:30px}.nav-button-next{right:30px}.nav-button svg{width:28px;height:28px}@media (max-width: 768px){.nav-button{width:50px;height:50px}.nav-button-prev{left:15px}.nav-button-next{right:15px}.nav-button svg{width:24px;height:24px}}.finale-page{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:10;animation:fadeIn 1.5s ease-out}.finale-content{text-align:center;z-index:10;padding:60px;background:#fffffff2;border-radius:0;border:8px solid #ff69b4;box-shadow:12px 12px #0000004d;max-width:800px;position:relative}.finale-message{font-size:1.5rem;color:#ff1493;margin:0;font-weight:400;line-height:2;text-shadow:4px 4px 0px rgba(255,20,147,.3)}@media (max-width: 767px){.finale-message{font-size:1rem;text-shadow:1px 1px 0px rgba(255,20,147,.5)}}.finale-hearts{position:fixed;width:100%;height:100%;top:0;left:0;pointer-events:none;overflow:hidden;z-index:5}.finale-heart{position:absolute;width:32px;height:32px;opacity:.7;animation:floatUp 5s ease-in infinite;top:100%;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.finale-heart:before{content:"";position:absolute;width:4px;height:4px;box-shadow:8px 0 #ff69b4,12px 0 #ff69b4,20px 0 #ff69b4,24px 0 #ff69b4,4px 4px #ff69b4,8px 4px #ff1493,12px 4px #ff1493,16px 4px #ff69b4,20px 4px #ff1493,24px 4px #ff1493,28px 4px #ff69b4,4px 8px #ff69b4,8px 8px #ff1493,12px 8px #ff1493,16px 8px #ff1493,20px 8px #ff1493,24px 8px #ff1493,28px 8px #ff69b4,4px 12px #ff69b4,8px 12px #ff1493,12px 12px #ff1493,16px 12px #ff1493,20px 12px #ff1493,24px 12px #ff1493,28px 12px #ff69b4,8px 16px #ff69b4,12px 16px #ff1493,16px 16px #ff1493,20px 16px #ff1493,24px 16px #ff69b4,12px 20px #ff69b4,16px 20px #ff1493,20px 20px #ff69b4,16px 24px #ff69b4}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes floatUp{0%{top:100%;opacity:.7;transform:translate(0) rotate(0)}50%{opacity:.9}to{top:-10%;opacity:0;transform:translate(50px) rotate(0)}}@media (max-width: 768px){.finale-message{font-size:1rem;line-height:2}.finale-content{padding:40px 20px;max-width:90%}}.storybook{position:relative;width:100%;height:100vh;overflow:hidden;background:linear-gradient(135deg,#ffeef8,#ffe0f0)}.storybook-container{position:relative;width:100%;height:100%;perspective:2000px}.music-controls{position:fixed;bottom:30px;right:30px;z-index:30}.music-button{padding:12px 24px;font-size:.6rem;background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff;border:3px solid #fff;border-radius:0;cursor:pointer;box-shadow:6px 6px #0003;transition:all .1s ease;font-family:"Press Start 2P",cursive;font-weight:400}.music-button:hover{transform:translate(-3px,-3px);box-shadow:9px 9px #0000004d}.music-button:active{transform:translate(0);box-shadow:3px 3px #0003}@media (max-width: 768px){.music-controls{bottom:20px;right:20px}.music-button{padding:10px 20px;font-size:.5rem}}.App{width:100%;height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Press Start 2P",cursive;overflow:hidden;height:100vh}#root,.App{width:100%;height:100vh}