@import"https://fonts.googleapis.com/css2?family=Google+Sans:wght@400;500;700&display=swap";:root{--bg-color: #050608;--surface-color: #1a1d26;--text-color: #ffffff;--accent-color: #ff2e51;--accent-glow: rgba(255, 46, 81, .4);--text-subtle: #8b9bb4}@property --h1{syntax: "<angle>"; inherits: true; initial-value: 340deg;}@property --s1{syntax: "<percentage>"; inherits: true; initial-value: 100%;}@property --l1{syntax: "<percentage>"; inherits: true; initial-value: 60%;}@property --h2{syntax: "<angle>"; inherits: true; initial-value: 260deg;}@property --s2{syntax: "<percentage>"; inherits: true; initial-value: 100%;}@property --l2{syntax: "<percentage>"; inherits: true; initial-value: 50%;}body{background-color:var(--bg-color);color:var(--text-color);font-family:Google Sans,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100vh;height:100dvh;margin:0;overflow:hidden}#root,.app-container{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.visual-container{flex:1;display:flex;align-items:center;justify-content:center;width:100%;min-height:250px;transition:all .5s ease;z-index:10}.loader{--h1: 345deg;--s1: 100%;--l1: 60%;--h2: 240deg;--s2: 100%;--l2: 40%;--color-one: hsl(var(--h1), var(--s1), var(--l1));--color-two: hsl(var(--h2), var(--s2), var(--l2));--color-three: hsla(var(--h1), var(--s1), var(--l1), .5);--color-four: hsla(var(--h2), var(--s2), var(--l2), .5);--color-five: hsla(var(--h1), var(--s1), var(--l1), .2);--time-animation: 2s;--size: 1.2;position:relative;border-radius:50%;transform:scale(var(--size)) translateZ(0);will-change:transform,filter;box-shadow:0 0 40px 0 var(--color-three),0 20px 50px 0 var(--color-four);transition:--h1 2s ease,--s1 2s ease,--l1 2s ease,--h2 2s ease,--s2 2s ease,--l2 2s ease,transform 1.2s cubic-bezier(.34,1.56,.64,1),filter 1.5s ease,opacity 1s ease;flex-shrink:0}.loader:before{content:"";position:absolute;top:0;left:0;width:100px;height:100px;border-radius:50%;border-top:solid 1px var(--color-one);border-bottom:solid 1px var(--color-two);background:linear-gradient(180deg,var(--color-five),var(--color-four));box-shadow:inset 0 10px 10px 0 var(--color-three),inset 0 -10px 10px 0 var(--color-four);z-index:2}.loader .box{width:100px;height:100px;background:linear-gradient(180deg,var(--color-one) 30%,var(--color-two) 70%);mask:url(#clipping);-webkit-mask:url(#clipping);z-index:1}.loader svg{position:absolute;width:0;height:0}.loader svg #clipping{filter:contrast(15);animation:roundness calc(var(--time-animation) / 2) linear infinite;will-change:transform}.loader svg #clipping polygon{filter:blur(7px)}.loader svg #clipping polygon:nth-child(1){transform-origin:75% 25%;transform:rotate(90deg)}.loader svg #clipping polygon:nth-child(2){transform-origin:50% 50%;animation:rotation var(--time-animation) linear infinite reverse}.loader svg #clipping polygon:nth-child(3){transform-origin:50% 60%;animation:rotation var(--time-animation) linear infinite;animation-delay:calc(var(--time-animation) / -3)}.loader svg #clipping polygon:nth-child(4){transform-origin:40% 40%;animation:rotation var(--time-animation) linear infinite reverse}.loader svg #clipping polygon:nth-child(5){transform-origin:40% 40%;animation:rotation var(--time-animation) linear infinite reverse;animation-delay:calc(var(--time-animation) / -2)}.loader svg #clipping polygon:nth-child(6){transform-origin:60% 40%;animation:rotation var(--time-animation) linear infinite}.loader svg #clipping polygon:nth-child(7){transform-origin:60% 40%;animation:rotation var(--time-animation) linear infinite;animation-delay:calc(var(--time-animation) / -1.5)}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes roundness{0%{filter:contrast(15)}20%{filter:contrast(3)}40%{filter:contrast(3)}60%{filter:contrast(15)}to{filter:contrast(15)}}@keyframes shake{0%,to{transform:scale(var(--size)) translate(0)}25%{transform:scale(var(--size)) translate(2px,-2px)}75%{transform:scale(var(--size)) translate(-2px,2px)}}.loader[data-state=listening]{--h1: 350deg;--s1: 100%;--l1: 60%;--h2: 240deg;--s2: 80%;--l2: 30%;--time-animation: 3s}.loader[data-state=excited]{--h1: 10deg;--s1: 100%;--l1: 65%;--h2: 280deg;--s2: 100%;--l2: 60%;--time-animation: 1s;--size: 1.4}.loader[data-state=neutral]{--h1: 340deg;--s1: 60%;--l1: 50%;--h2: 220deg;--s2: 30%;--l2: 30%;--time-animation: 5s;--size: 1.1}.loader[data-state=thinking]{--h1: 270deg;--s1: 90%;--l1: 60%;--h2: 180deg;--s2: 90%;--l2: 40%;--time-animation: 1.5s}.loader[data-state=working]{--h1: 45deg;--s1: 100%;--l1: 60%;--h2: 355deg;--s2: 100%;--l2: 55%;--time-animation: .8s}.loader[data-state=present]{--h1: 150deg;--s1: 100%;--l1: 45%;--h2: 200deg;--s2: 90%;--l2: 55%;--time-animation: 3s;--size: 1.25}.loader[data-state=error]{--h1: 0deg;--s1: 100%;--l1: 50%;--h2: 0deg;--s2: 100%;--l2: 20%;--time-animation: .4s;animation:shake .4s ease-in-out infinite}.loader.submerged{transform:scale(.1) translateY(100vh) translateZ(0);filter:blur(20px) brightness(.2);opacity:0}.status-wrapper{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:5px;opacity:0;transition:opacity 1s ease}.status-wrapper.visible{opacity:1}.status-static{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--text-subtle);font-weight:500}.status-loader{height:20px;overflow:hidden;position:relative;display:flex;align-items:center}.status-words{display:flex;flex-direction:column;transform:translateY(0)}.status-words.animating{animation:slideUpEntry .4s cubic-bezier(.2,.8,.2,1) forwards}.status-word{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--accent-color);font-weight:700;height:20px;line-height:20px;display:flex;align-items:center;white-space:nowrap}@keyframes slideUpEntry{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.chat-container{position:relative;width:600px;max-width:90vw;display:flex;flex-direction:column;gap:15px;z-index:100;margin:0 auto 40px;flex-shrink:0;background:transparent;opacity:0;transform:translateY(40px) scale(.95);filter:blur(10px);transition:opacity .8s ease,transform .8s cubic-bezier(.34,1.56,.64,1),filter .8s ease}.chat-container.visible{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}.interaction-area{display:flex;flex-direction:column;gap:15px;min-height:20px;margin-bottom:5px}.user-query{font-size:18px;color:#e8eaed;text-align:center;font-style:italic;font-weight:400;min-height:20px;opacity:.8;transition:all .5s ease}.user-highlight{color:var(--accent-color);background:transparent;text-decoration:none;font-weight:700;font-family:Courier New,Courier,monospace;display:inline-block;cursor:pointer}.ai-response{font-size:16px;color:#fff;line-height:1.6;text-align:center;background:transparent;padding:0 10px;opacity:0;transform:translateY(10px);transition:all .5s ease;display:none}.ai-response.show{opacity:1;transform:translateY(0);display:block}.ai-link{color:#fff;font-weight:400;text-decoration:none;position:relative;cursor:pointer;padding-bottom:1px;display:inline-block;transition:text-shadow .3s ease}.ai-link:after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:3px;background:var(--accent-color);mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E");mask-size:10px 3px;-webkit-mask-size:10px 3px;mask-repeat:repeat-x;-webkit-mask-repeat:repeat-x;animation:waveScroll 1s linear infinite;transform-origin:bottom;transition:all .3s ease;opacity:.8}@keyframes waveScroll{0%{-webkit-mask-position:0 0;mask-position:0 0}to{-webkit-mask-position:-10px 0;mask-position:-10px 0}}.ai-link:hover:after{animation-duration:.5s;opacity:1}.ai-link:hover{text-shadow:0 0 15px rgba(255,255,255,.5)}.cursor-comet{display:inline-block;vertical-align:middle;width:16px;height:10px;background-color:var(--accent-color);border-radius:30% 70% 70% 30%/50%;box-shadow:0 0 15px var(--accent-color),0 0 25px var(--accent-glow);position:relative;margin-left:4px;animation:pulse-comet .8s infinite alternate}.cursor-comet:before{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:35px;height:6px;background:linear-gradient(to right,transparent 0%,var(--accent-color) 100%);filter:blur(3px);opacity:.7;border-radius:10px;z-index:-1}@keyframes pulse-comet{0%{transform:scale(.95);opacity:.9}to{transform:scale(1.05);opacity:1}}.chat-input-wrapper{position:relative;display:flex;align-items:center;background:var(--surface-color);border-radius:999px;padding:8px 8px 8px 24px;border:1px solid rgba(255,255,255,.05);box-shadow:0 10px 40px #00000080;transition:all .5s cubic-bezier(.25,1,.5,1);width:100%;box-sizing:border-box}.chat-input-wrapper:focus-within{border-color:#ffffff1a;background:#20242f;transform:scale(1.02)}.chat-input-wrapper.hidden{opacity:0;pointer-events:none;height:0;padding:0;margin:0;border:none;transform:scale(.8)}input{flex:1;background:transparent;border:none;color:#fff;padding:10px 0;outline:none;font-family:inherit;font-size:16px;margin-right:10px}input::placeholder{color:var(--text-subtle)}.send-btn,.random-btn{background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.send-btn{color:var(--accent-color);width:44px;height:44px;border-radius:50%;background:#ff2e511a}.send-btn:hover{background:var(--accent-color);color:#fff;box-shadow:0 0 20px var(--accent-glow)}.random-btn{margin-right:10px;color:var(--text-subtle);padding:8px;border-radius:50%}.random-btn:hover{color:var(--accent-color);background:#ffffff1a;transform:rotate(180deg)}.action-buttons{display:flex;justify-content:space-between;width:100%;margin-top:10px;opacity:0;pointer-events:none;transition:opacity .5s ease;height:0;overflow:hidden}.action-buttons.visible{opacity:1;pointer-events:auto;height:auto;overflow:visible}.action-btn{width:60px;height:60px;border-radius:50%;background:var(--surface-color);border:1px solid rgba(255,255,255,.1);color:var(--text-subtle);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .3s cubic-bezier(.34,1.56,.64,1)}.action-btn .inner-circle{width:40px;height:40px;border-radius:50%;background:#ff2e511a;color:var(--accent-color);display:flex;align-items:center;justify-content:center;transition:all .3s ease}.action-btn svg{width:20px;height:20px}.action-btn:hover{background:#252a36;border-color:#ffffff4d;transform:scale(1.05);box-shadow:0 5px 15px #0000004d}.action-btn:hover .inner-circle{background:var(--accent-color);color:#fff;box-shadow:0 0 15px var(--accent-glow)}@media(max-width:600px){.chat-container{width:92vw;margin-bottom:20px;gap:10px}.visual-container{min-height:250px}.chat-input-wrapper{padding:6px 6px 6px 18px}input{font-size:14px;padding:12px 0}.send-btn{width:40px;height:40px}.user-query{font-size:16px}.ai-response{font-size:14px}.loader{--size: 1.6}}