.header{height:50px;width:100%;background:linear-gradient(180deg,#1a5276,#2980b9);display:flex;align-items:center;justify-content:space-between;padding:0 15px;position:fixed;top:0;left:0;z-index:100}.header-time{font-size:24px;font-weight:700;color:#fff}.header-logo{height:35px;font-size:20px;font-weight:700;color:#fff;display:flex;align-items:center}.avatar-container{height:330px;width:100%;display:flex;align-items:center;justify-content:center;position:relative;margin-top:50px;background:linear-gradient(180deg,#87ceeb,#98d8ef,#b0e2f5);overflow:hidden}.avatar-svg{width:320px;height:320px;transition:transform .3s ease}.avatar-svg.idle{animation:float 4s ease-in-out infinite}.avatar-svg.idle .waving-hand{animation:wave 1s ease-in-out infinite;transform-origin:175px 180px}.avatar-svg.idle .hair-left-long{animation:hair-flow-left 3s ease-in-out infinite}.avatar-svg.idle .hair-right-long{animation:hair-flow-right 3s ease-in-out infinite}.avatar-svg.connecting{animation:pulse-connect 1s ease-in-out infinite}.avatar-svg.ready{animation:breathe 3s ease-in-out infinite}.avatar-svg.listening{animation:listening-pulse 1.5s ease-in-out infinite}.avatar-svg.listening .eyebrow-left{transform:translateY(-4px) rotate(-3deg)}.avatar-svg.listening .eyebrow-right{transform:translateY(-4px) rotate(3deg)}.avatar-svg.speaking{animation:speaking-energy .3s ease-in-out infinite}.avatar-svg.error{animation:shake .5s ease-out;filter:grayscale(.3) brightness(.9)}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(.5deg)}}@keyframes wave{0%,to{transform:rotate(0)}25%{transform:rotate(25deg)}75%{transform:rotate(-15deg)}}@keyframes hair-flow-left{0%,to{transform:rotate(0) translate(0)}50%{transform:rotate(1deg) translate(2px)}}@keyframes hair-flow-right{0%,to{transform:rotate(0) translate(0)}50%{transform:rotate(-1deg) translate(-2px)}}@keyframes pulse-connect{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.03);opacity:.85}}@keyframes breathe{0%,to{transform:scale(1) translateY(0)}50%{transform:scale(1.015) translateY(-2px)}}@keyframes listening-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}@keyframes speaking-energy{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.mouth-group,.mouth{transition:all .05s ease-out}.face{transition:transform .2s ease}.eyes{transition:all .15s ease}.iris,.pupil,.eye-shine{transition:all .08s ease-out}.eyebrow-left,.eyebrow-right{transition:transform .2s ease}.hair-front,.bang-left,.bang-right{transition:transform .3s ease}.state-indicator{position:absolute;bottom:10px;left:50%;transform:translate(-50%);padding:5px 14px;border-radius:16px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;opacity:0;transition:opacity .3s ease}.state-indicator.listening{background:#4caf50e6;color:#fff;opacity:1;display:flex;align-items:center;gap:6px}.state-indicator.listening:before{content:"Ascolto"}.pulse-dot{width:6px;height:6px;background:#fff;border-radius:50%;animation:pulse-dot 1s ease-in-out infinite}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}.btn-mic{width:80px;height:80px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.btn-mic .icon{font-size:32px;color:#fff;-webkit-user-select:none;user-select:none}.btn-mic.unmuted{background:#4caf50;box-shadow:0 4px 12px #4caf5066}.btn-mic.unmuted:hover{background:#5cbf60;box-shadow:0 6px 16px #4caf5080}.btn-mic.unmuted:active{transform:scale(.95)}.btn-mic.muted{background:#757575;box-shadow:0 4px 12px #75757566}.btn-mic.muted:hover{background:#888}.btn-mic.muted:active{transform:scale(.95)}.btn-mic.disabled{background:#424242;opacity:.5;cursor:not-allowed;pointer-events:none;box-shadow:none}.status-message{width:300px;text-align:center;font-size:16px;font-weight:600;color:#aaa;text-transform:uppercase;letter-spacing:1px;line-height:1.3;padding:0 10px;flex-shrink:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.btn-conversation{width:80px;height:80px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.btn-conversation .icon{font-size:32px;color:#fff;-webkit-user-select:none;user-select:none}.btn-conversation.start{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea66}.btn-conversation.start:hover{background:linear-gradient(135deg,#7c8ff0,#8a5bb5);box-shadow:0 6px 16px #667eea80}.btn-conversation.start:active{transform:scale(.95)}.btn-conversation.stop{background:linear-gradient(135deg,#4caf50,#388e3c);box-shadow:0 4px 12px #4caf5066}.btn-conversation.stop:hover{background:linear-gradient(135deg,#5cbf60,#43a047);box-shadow:0 6px 16px #4caf5080}.btn-conversation.stop:active{transform:scale(.95)}.footer{height:100px;width:100%;position:fixed;bottom:0;left:0;background:#000;display:flex;align-items:center;justify-content:space-between;padding:0 10px;z-index:100}.app{width:480px;height:480px;position:relative;overflow:hidden;background:#000;box-shadow:0 0 20px #00000080;border:2px solid #333}*{margin:0;padding:0;box-sizing:border-box}body{width:100vw;height:100vh;overflow:hidden;margin:0;padding:0;display:flex;align-items:center;justify-content:center;background:#1a1a1a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100%;height:100%}.app{width:480px;height:480px;position:relative;overflow:hidden;background:#000}