*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto Slab,Inter,-apple-system,BlinkMacSystemFont,serif;background:radial-gradient(ellipse at center,#1a1a2e,#16213e,#0f0f23);color:#fff;overflow:hidden}.app{width:100vw;height:100vh;position:relative}.star-canvas{width:100%!important;height:100%!important}.intro-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;text-align:center}.intro-overlay h1{font-size:clamp(2rem,5vw,4rem);margin-bottom:1rem;background:linear-gradient(45deg,#4a9eff,#ff6b9d,#c77dff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.intro-overlay p{font-size:clamp(1rem,3vw,1.5rem);opacity:.8}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:linear-gradient(135deg,#4a9eff1a,#c77dff1a,#ff6b9d1a);border:1px solid rgba(255,255,255,.2);border-radius:20px;max-width:95vw;max-height:95vh;overflow-y:auto;position:relative;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 20px 40px #00000080}.modal-close{position:absolute;top:15px;right:20px;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer;z-index:10;transition:transform .2s}.modal-close:hover{transform:scale(1.1)}.modal-inner{padding:2rem}.constellation-title{font-size:clamp(1.5rem,4vw,2.5rem);margin-bottom:1.5rem;text-align:center;background:linear-gradient(45deg,#4a9eff,#ff6b9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.media-container{margin-bottom:1.5rem;text-align:center}.modal-image,.modal-video{max-width:100%;max-height:60vh;border-radius:10px;object-fit:cover}.media-controls{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1.5rem}.media-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.5rem 1rem;border-radius:25px;cursor:pointer;transition:all .3s ease}.media-btn:hover:not(:disabled){background:#fff3;transform:translateY(-2px)}.media-btn:disabled{opacity:.5;cursor:not-allowed}.media-counter{color:#ffffffb3;font-size:.9rem}.story-text{line-height:1.6}.story-text p{font-size:clamp(.9rem,2.5vw,1.1rem);margin-bottom:1rem;opacity:.8;text-align:center;font-style:italic}.story-content{font-size:clamp(1rem,3vw,1.2rem);text-align:left;background:#ffffff0d;padding:1.5rem;border-radius:15px;border-left:4px solid #4a9eff}@media (max-width: 768px){.modal-content{margin:1rem}.modal-inner{padding:1.5rem}.media-controls{flex-wrap:wrap}}.modal-content{scroll-behavior:smooth}.modal-content::-webkit-scrollbar{width:8px}.modal-content::-webkit-scrollbar-track{background:#ffffff1a;border-radius:4px}.modal-content::-webkit-scrollbar-thumb{background:#4a9eff80;border-radius:4px}.modal-content::-webkit-scrollbar-thumb:hover{background:#4a9effb3}.mobile-instructions{position:fixed;top:20px;right:20px;z-index:1500;animation:fadeInSlide .5s ease-out}.mobile-instructions-content{background:#4a9effe6;border:1px solid rgba(255,255,255,.3);border-radius:15px;padding:1rem 1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 30px #0000004d;display:flex;align-items:center;gap:1rem;max-width:280px}.mobile-instructions-content p{margin:0;font-size:.9rem;color:#fff;font-weight:500}.mobile-instructions-content button{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.mobile-instructions-content button:hover{background:#fff3}@keyframes fadeInSlide{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}