@import"https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap";#root{width:100vw;height:100vh}body{margin:0;font-family:Lato,sans-serif}:root{--chat-primary-color: rgba(0, 0, 0, .7);--chat-text-color: #FFFFFF;--chat-user-color: #ff0000c2;--chat-npc-color: rgba(127,210,118,255);--chat-bg-white: #FFFFFF;--infobox-heading: #ff0000c2;--chat-padding: clamp(.5rem, 2vw, 1rem);--chat-border-radius: .5rem;--chat-max-width: 35rem;--chat-animation-duration: .3s}.container{position:fixed;bottom:calc(20px + 3.5rem);left:50%;transform:translate(-50%);width:min(100%,var(--chat-max-width));margin-inline:auto;padding:var(--chat-padding);box-sizing:border-box;gap:1rem;z-index:999;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--chat-border-radius);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;transition:all var(--chat-animation-duration) ease-in-out;display:grid;grid-template-rows:1fr auto}@media screen and (max-width: 480px){.container{--chat-max-width: 25rem;padding:0}}.container-chat{display:flex;width:100%;height:100%;overflow:auto;text-align:left;scrollbar-width:thin;scrollbar-color:var(--chat-primary-color) transparent}.container-chat::-webkit-scrollbar{width:.5rem}.container-chat::-webkit-scrollbar-track{background:transparent}.container-chat::-webkit-scrollbar-thumb{background-color:var(--chat-primary-color);border-radius:var(--chat-border-radius)}.chat-Historyc{background-color:var(--chat-primary-color);border-radius:50%;aspect-ratio:1;width:3.5vw;transition:transform var(--chat-animation-duration) ease}.chat-Historyc:hover{transform:scale(1.05)}.chat-Historyo{background-color:var(--chat-primary-color);border-radius:var(--chat-border-radius);width:30vw;height:45vh;transition:transform var(--chat-animation-duration) ease}.placeholder1{color:#000;font-family:Lato,sans-serif;height:1.5rem;width:100%;padding:.5rem;border:1px solid rgba(255,255,255,.1);border-radius:var(--chat-border-radius);background:#ffffff0d;transition:all var(--chat-animation-duration) ease;font-size:clamp(14px,2vw,16px)}.placeholder1:focus{outline:none;border-color:#ffffff4d;background:var(--chat-bg-white)}.placeholder1::placeholder{color:#0009;opacity:1}@media (max-width: 768px){.container{width:95%;bottom:calc(30px + 3.5rem);border-radius:var(--chat-border-radius)}.chat-Historyc,.chat-Historyo{width:clamp(2rem,10vw,4rem)}}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,2rem)}to{opacity:1;transform:translate(-50%)}}.container{animation:fadeIn var(--chat-animation-duration) ease-out forwards}.icon{position:relative;margin-left:50px;margin-top:30px;display:flex;justify-content:space-between;width:13px;height:13px}.icon span{width:3px;height:100%;background-color:orange;border-radius:3px;content:""}@keyframes bounce{10%{transform:scaleY(.3)}30%{transform:scaleY(1)}60%{transform:scaleY(.5)}80%{transform:scaleY(.75)}to{transform:scaleY(.6)}}.span-prop{width:3px;height:100%;background-color:orange;border-radius:3px;animation:bounce 2.2s ease infinite alternate;content:""}span:nth-of-type(2){animation-delay:-2.2s}span:nth-of-type(3){animation-delay:-3.7s}.ChatBubble{position:absolute;top:1vh;left:1vw;z-index:1}.mobile-talk-button{position:fixed;bottom:20px;left:50%;transform:translate(-50%);min-width:280px;padding:15px 30px;background-color:#000000b3;color:#fff;border:2px solid rgba(255,255,255,.3);border-radius:25px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;white-space:nowrap}.mobile-talk-button:active{background-color:#000000e6;transform:translate(-50%) scale(.97);border-color:#fffc;box-shadow:0 0 0 4px #fff3}@media (hover: hover){.mobile-talk-button:hover{background-color:#000c;border-color:#ffffff80;transform:translate(-50%) translateY(-2px);box-shadow:0 4px 12px #0003}.mobile-talk-button:hover:active{background-color:#000000e6;transform:translate(-50%) scale(.97);border-color:#fffc;box-shadow:0 0 0 4px #fff3}}@media (max-width: 1023px){.mobile-talk-button{width:200px;bottom:30px;padding:12px 20px}}@media (max-width: 360px){.placeholder1{font-size:13px;padding:.4rem}.mobile-talk-button{min-width:240px;padding:10px 20px;font-size:14px}}@media (min-width: 1024px){.placeholder1{height:2rem;padding:.75rem}.mobile-talk-button{min-width:320px;padding:15px 40px;font-size:18px}}@media (min-resolution: 192dpi){.placeholder1::placeholder{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mobile-talk-button{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}.container-chat1{width:100%;height:90%;overflow:auto;margin-bottom:25px;margin-top:15px;text-align:left;display:flex;flex-direction:column}.user-message-display{display:flex;margin-bottom:-12px}.user-name-display{color:#f3a79e;padding-left:20px;margin-right:-10px;font-weight:700}.message-content{color:#fff;padding-left:15px;margin-right:50px}.npc-message-container{display:flex;justify-content:space-between;margin-left:20px}.npc-name{color:#7fd276;margin-right:-10px;font-weight:700}.feedback-container{display:flex;margin-left:7px;margin-right:20px}.feedback-image{height:17px;padding-right:10px}.container-textBox{width:100%;height:3rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding-bottom:5px;background-color:#fff}.textBox{color:#fff;width:65%;margin-left:20px;margin-top:5px;font-size:13px}.textBox input{background-color:#00000003;border-width:1px;width:100%;color:#000}.logo{align-self:end;padding-right:20px;padding-left:20px;padding-bottom:0;background-color:#fff}.voice-indicator{margin-bottom:20px}.info-wrapper{position:fixed;top:20px;right:20px;z-index:10001;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;width:40px}.info-button{width:40px;height:40px;border-radius:50%;background:#000000b3;color:#fff;border:2px solid rgba(255,255,255,.3);font-size:20px;font-weight:700;cursor:pointer;z-index:1001;display:flex;align-items:center;justify-content:center;font-style:italic;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:all .3s cubic-bezier(.34,1.56,.64,1)}.info-button:hover{background-color:#000000d9;border-color:#fffc;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.info-button:active{transform:translateY(0);box-shadow:0 2px 6px #0000001a}.info-overlay{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;background:#00000080;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:10000;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(40px);animation:slideUp .8s cubic-bezier(.22,1,.36,1) forwards;box-sizing:border-box;padding:1rem}.info-container{position:relative;width:min(100%,var(--chat-max-width));max-height:70vh;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--chat-border-radius);border:2px solid rgba(255,255,255,.1);padding:calc(var(--chat-padding) + 2rem) var(--chat-padding) var(--chat-padding);color:#fff;overflow-y:auto;opacity:0;transform:translateY(40px);animation:slideUp .8s cubic-bezier(.22,1,.36,1) .2s forwards;box-shadow:0 8px 32px #0003;z-index:10002;box-sizing:border-box;display:flex;flex-direction:column;margin:auto}.info-close-button{position:absolute;top:var(--chat-padding);right:var(--chat-padding);width:30px;height:30px;border-radius:50%;background:#ffffff1a;border:none;color:#fff;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:1}.info-close-button:hover{background:#fff3}.info-content{flex:1;overflow-y:auto;padding-right:1rem;margin-top:.5rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.info-content::-webkit-scrollbar{width:6px}.info-content::-webkit-scrollbar-track{background:transparent}.info-content::-webkit-scrollbar-thumb{background-color:#ffffff4d;border-radius:3px}.info-content h2,.info-content p{text-align:left;width:100%}.info-content h2{color:var(--infobox-heading);margin:1.5rem 0 .5rem;font-size:1.25rem}.info-content h2:first-child{margin-top:0}.info-content p{margin:.5rem 0;line-height:1.5;color:#ffffffe6}.info-content ul{margin:.5rem 0;padding-left:1.5rem}.info-content li{margin:.25rem 0;color:#ffffffe6}@keyframes slideUp{0%{opacity:0;transform:translateY(50%)}to{opacity:1;transform:translate(0)}}@media (max-width: 768px){.info-button{top:15px;right:15px;width:35px;height:35px;font-size:18px}.info-container{width:95%;padding:1.5rem;max-height:90vh;z-index:10002}.info-content h2{font-size:1.1rem}.info-content p{font-size:.95rem}}@media screen and (max-width: 480px){.info-overlay{display:flex;align-items:center;justify-content:center;padding:1rem;box-sizing:border-box}.info-container{width:100%;max-height:70vh;margin-top:1rem;padding:calc(var(--chat-padding) + 2rem) var(--chat-padding) var(--chat-padding)}.info-content{padding-right:.5rem}.info-content h2{font-size:1.1rem;margin-top:.75rem;margin-bottom:.5rem}.info-content p{font-size:.95rem;line-height:1.4;margin-bottom:1rem}}.info-overlay{display:flex;align-items:center;justify-content:center;padding:1rem;box-sizing:border-box}