@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100vh;height:100dvh;overflow:hidden;font-family:"Press Start 2P",monospace;background:#1a1a2e;image-rendering:pixelated;touch-action:manipulation;-webkit-overflow-scrolling:touch}.canvas-container{width:100%;height:100vh;height:100dvh;position:fixed;top:0;left:0}.speech-bubble{position:fixed;top:8%;left:50%;transform:translate(-50%);z-index:100;max-width:520px;min-width:240px;pointer-events:none;animation:bubbleIn .2s steps(3)}@keyframes bubbleIn{0%{opacity:0;transform:translate(-50%) scale(.8)}to{opacity:1;transform:translate(-50%) scale(1)}}.bubble-content{background:#fffffaf2;border:4px solid #2a2a3e;padding:18px 24px;position:relative;box-shadow:5px 5px #000;pointer-events:auto}.bubble-text a{pointer-events:auto;cursor:pointer}.bubble-text{font-family:"Press Start 2P",monospace;font-size:12px;line-height:2.2;color:#1a1a2e;word-break:break-word}.bubble-dots{font-family:"Press Start 2P",monospace;font-size:12px;color:#5060e0;animation:dotsAnim .8s steps(3) infinite}@keyframes dotsAnim{0%{opacity:.3}50%{opacity:1}to{opacity:.3}}.bubble-tail{width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:12px solid #2a2a3e;margin:0 auto;position:relative}.bubble-tail:after{content:"";position:absolute;top:-15px;left:-8px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:10px solid rgba(255,255,250,.95)}.bubble-listening .bubble-content{border-color:#e05050;box-shadow:4px 4px #000,0 0 0 2px #e050504d}.bubble-listening .bubble-tail{border-top-color:#e05050}.bubble-thinking .bubble-content{border-color:#5060e0}.bubble-thinking .bubble-tail{border-top-color:#5060e0}.bubble-speaking .bubble-content{border-color:#50c0a0;box-shadow:4px 4px #000,0 0 0 2px #50c0a033}.bubble-speaking .bubble-tail{border-top-color:#50c0a0}.interaction-buttons{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:100;display:flex;gap:10px}.interaction-btn{font-family:"Press Start 2P",monospace;font-size:10px;color:#f0d040;text-shadow:2px 2px 0px #000;padding:14px;background:#000000b3;border:3px solid rgba(240,208,64,.5);cursor:pointer;letter-spacing:1px;animation:hintPulse 2s steps(2) infinite;transition:background .1s,border-color .1s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;min-width:50px;min-height:50px}.interaction-btn svg{filter:drop-shadow(2px 2px 0px #000)}.btn-label{font-size:9px;white-space:nowrap}.interaction-btn:active{background:#f0d0404d;transform:scale(.95)}.interaction-btn.btn-active{animation:none;border-color:#50c0a099;color:#50c0a0}.interaction-btn.btn-type{border-color:#64a0f080;color:#60a0f0}.interaction-btn.btn-type:active{background:#64a0f04d}.interaction-btn.btn-type-active{animation:none;border-color:#4080d0cc;color:#4080d0;background:#4080d033}.interaction-btn.btn-listening{border-color:#e0505099;color:#e05050;animation:listenPulse .8s steps(2) infinite}.typing-form{width:100%}.typing-input{width:100%;font-family:"Press Start 2P",monospace;font-size:11px;color:#1a1a2e;background:transparent;border:none;outline:none;padding:4px 0;caret-color:#4080d0}.typing-input::placeholder{color:#a0a0b0;font-size:10px}.bubble-typing .bubble-content{border-color:#4080d0;box-shadow:4px 4px #000,0 0 0 2px #4080d04d}.bubble-typing .bubble-tail{border-top-color:#4080d0}@keyframes hintPulse{0%,to{opacity:.7}50%{opacity:1}}@keyframes listenPulse{0%,to{opacity:1;border-color:#e05050cc}50%{opacity:.7;border-color:#e050504d}}@media (max-width: 768px){.speech-bubble{max-width:calc(100% - 40px);min-width:180px;top:6%}.bubble-text{font-size:9px}.interaction-buttons{bottom:calc(16px + env(safe-area-inset-bottom,0px))}.interaction-btn{font-size:8px;padding:14px 18px}}