:root{--bg-primary:#050508;--bg-secondary:#0a0a12;--neon-blue:#00d4ff;--neon-blue-bright:#00f0ff;--neon-blue-dark:#09c;--neon-glow:rgba(0,212,255,.4);--neon-glow-strong:rgba(0,212,255,.6);--moon-surface:linear-gradient(135deg,#1a3a4a,#0d2030 50%,#061520);--text-primary:hsla(0,0%,100%,.9);--text-secondary:hsla(0,0%,100%,.5);--text-neon:var(--neon-blue)}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%;overflow:hidden}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.stars-container{height:100%;left:0;overflow:hidden;pointer-events:none;position:fixed;top:0;width:100%}.star{animation:twinkle var(--duration,3s) ease-in-out infinite;animation-delay:var(--delay,0s);background:#fff;border-radius:50%;height:2px;opacity:0;position:absolute;width:2px}@keyframes twinkle{0%,to{opacity:.1;transform:scale(.8)}50%{opacity:.6;transform:scale(1.2)}}.app-container{flex-direction:column;min-height:100vh;min-height:100dvh;padding:2rem}.app-container,.moon-wrapper{align-items:center;display:flex;justify-content:center;position:relative}.moon-wrapper{cursor:pointer;-webkit-tap-highlight-color:transparent}.moon-glow{animation:glow-pulse 4s ease-in-out infinite;background:radial-gradient(circle,var(--neon-glow) 0,transparent 70%);filter:blur(20px);height:320px;width:320px}.moon-glow,.moon-glow-inner{border-radius:50%;pointer-events:none;position:absolute}.moon-glow-inner{animation:glow-pulse 4s ease-in-out .5s infinite;background:radial-gradient(circle,rgba(0,212,255,.2) 0,transparent 60%);filter:blur(10px);height:240px;width:240px}@keyframes glow-pulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}.moon{animation:moon-rotate 60s linear infinite,moon-breathe 6s ease-in-out infinite;background:radial-gradient(circle at 30% 30%,rgba(0,240,255,.3) 0,transparent 50%),radial-gradient(circle at 70% 60%,rgba(0,180,220,.2) 0,transparent 40%),linear-gradient(135deg,#1a4a5a,#0d2535 40%,#061825);border-radius:50%;box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff26,0 0 60px var(--neon-glow),0 0 120px #00d4ff33,0 0 200px #00d4ff1a;height:160px;position:relative;transform-style:preserve-3d;transition:box-shadow .5s cubic-bezier(.4,0,.2,1);width:160px}@keyframes moon-rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes moon-breathe{0%,to{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff26,0 0 60px var(--neon-glow),0 0 120px #00d4ff33,0 0 200px #00d4ff1a}50%{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff33,0 0 80px var(--neon-glow-strong),0 0 160px #00d4ff4d,0 0 240px #00d4ff26}}.moon:hover{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff40,0 0 100px var(--neon-glow-strong),0 0 200px #00d4ff66,0 0 300px #00d4ff33}.moon:active{animation:moon-rotate 60s linear infinite}.crater{background:radial-gradient(circle,#0096b466 0,#00648299);border-radius:50%;box-shadow:inset 1px 1px 3px #00d4ff33,inset -1px -1px 2px #0000004d;position:absolute}.crater-1{height:25px;left:20%;top:25%;width:25px}.crater-2{height:18px;left:60%;top:50%;width:18px}.crater-3{height:12px;left:45%;top:35%;width:12px}.crater-4{height:20px;left:30%;top:65%;width:20px}.crater-5{height:8px;left:55%;top:20%;width:8px}.moon.connecting{animation:moon-rotate 60s linear infinite,moon-connecting 1.5s ease-in-out infinite}@keyframes moon-connecting{0%,to{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff26,0 0 60px var(--neon-glow),0 0 120px #00d4ff33}50%{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff4d,0 0 120px var(--neon-glow-strong),0 0 240px #00d4ff66}}.moon.connected{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00ffc826,0 0 80px #00ffc84d,0 0 160px #00ffc826}.moon.speaking{animation:moon-rotate 60s linear infinite,moon-speaking .8s ease-in-out infinite}@keyframes moon-speaking{0%,to{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #64c8ff33,0 0 80px #64c8ff66,0 0 160px #64c8ff33}50%{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #64c8ff4d,0 0 120px #64c8ff80,0 0 240px #64c8ff4d}}.moon.listening{animation:moon-rotate 60s linear infinite,moon-listening 1.2s ease-in-out infinite}@keyframes moon-listening{0%,to{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff33,0 0 80px #00d4ff80,0 0 160px #00d4ff4d}50%{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #00d4ff59,0 0 140px #00d4ffb3,0 0 280px #00d4ff66}}.moon.error{box-shadow:inset -15px -10px 30px #00000080,inset 8px 8px 25px #ff666626,0 0 60px #ff66664d,0 0 120px #ff666626}.status-container{bottom:-80px;left:50%;position:absolute;text-align:center;transform:translate(-50%);width:300px}.status-text{color:var(--text-secondary);font-size:14px;font-weight:300;letter-spacing:.1em;text-transform:uppercase;transition:all .3s ease}.status-text.active{color:var(--neon-blue);text-shadow:0 0 10px var(--neon-glow)}.hint-text{font-size:12px;font-weight:300;margin-top:8px;opacity:.6}.hint-text,.logo{color:var(--text-secondary)}.logo{bottom:2rem;font-size:13px;font-weight:200;left:50%;letter-spacing:.3em;opacity:.5;position:fixed;text-transform:uppercase;transform:translate(-50%)}.logo span{color:var(--neon-blue);font-weight:400;text-shadow:0 0 10px var(--neon-glow)}.error-message{background:#ff66661a;border:1px solid hsla(0,100%,70%,.2);border-radius:8px;bottom:5rem;color:#ff9494e6;font-size:13px;left:50%;max-width:80%;padding:12px 24px;position:fixed;text-align:center;transform:translate(-50%)}.audio-ring{border:2px solid transparent;border-radius:50%;height:200px;opacity:0;pointer-events:none;position:absolute;transition:opacity .3s ease;width:200px}.audio-ring.active{animation:ring-pulse 1.5s ease-out infinite;border-color:var(--neon-blue);box-shadow:0 0 20px var(--neon-glow);opacity:1}@keyframes ring-pulse{0%{border-color:var(--neon-blue);opacity:.8;transform:scale(1)}to{border-color:transparent;opacity:0;transform:scale(1.6)}}.neon-title{animation:title-glow 3s ease-in-out infinite;color:var(--neon-blue);font-size:32px;font-weight:200;left:50%;letter-spacing:.4em;position:absolute;text-shadow:0 0 10px var(--neon-blue),0 0 20px var(--neon-blue),0 0 40px var(--neon-glow),0 0 80px var(--neon-glow);text-transform:uppercase;top:-80px;transform:translate(-50%)}@keyframes title-glow{0%,to{opacity:.9;text-shadow:0 0 10px var(--neon-blue),0 0 20px var(--neon-blue),0 0 40px var(--neon-glow),0 0 80px var(--neon-glow)}50%{opacity:1;text-shadow:0 0 15px var(--neon-blue-bright),0 0 30px var(--neon-blue),0 0 60px var(--neon-glow-strong),0 0 120px var(--neon-glow)}}@media(max-width:480px){.moon{height:140px;width:140px}.moon-glow{height:280px;width:280px}.moon-glow-inner{height:210px;width:210px}.audio-ring{height:170px;width:170px}.neon-title{font-size:26px;top:-70px}.crater-1{height:20px;width:20px}.crater-2{height:14px;width:14px}.crater-3{height:10px;width:10px}.crater-4{height:16px;width:16px}.crater-5{height:6px;width:6px}}.moon-wrapper,.neon-title,.status-container{-moz-user-select:none;user-select:none;-webkit-user-select:none}.star.blue{background:var(--neon-blue);box-shadow:0 0 4px var(--neon-glow)}