:root{--border-rad-lg:15px;--medium-light-text:#fbfdff;--light-text:#fcfcfc}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Inter,sans-serif}main{background-image:url(/assets/Capture%2090-DPJRfmGC.JPG);background-size:cover;justify-content:center;align-items:center;height:100vh;display:flex}.chatbot-container{border-radius:var(--border-rad-lg);background-color:#16202c;flex-direction:column;width:660px;min-height:680px;padding:1em;display:flex}.chatbot-container>*{padding:.5em}.chatbot-header{grid-template-areas:"logo. . .""logo title.supportId""logo subtitle new-game clear-btn";column-gap:.5em;display:grid}.chatbot-header>*{margin:.11em}.logo{grid-area:logo;width:70px}.supportId{text-align:center;grid-area:supportId;font-size:16px}.clear-btn{width:100%;height:60px;color:var(--medium-light-text);grid-area:clear-btn;margin:0 auto;padding:0;font-size:18px}.new-game-btn{grid-area:new-game}.clear-btn:hover{color:#24976f;cursor:pointer;border:1px solid #24976f}.chatbot-conversation-container{min-height:450px;max-height:450px;margin:1em 0;overflow-y:scroll}.chatbot-conversation-container::-webkit-scrollbar{display:none}.chatbot-conversation-container::-moz-scrollbar{display:none}.speech{max-width:260px;color:var(--light-text);border-radius:var(--border-rad-lg);min-width:100%;margin:1em auto;padding:1em}.speech:first-child{margin-top:0}.speech-ai{background:#253b4b;border-top-left-radius:0;font-size:28px}.speech-human{background:#24976f;border-top-right-radius:0}.chatbot-input-container{font-size:28px;display:flex}input[type=text],button{border:1px solid var(--medium-light-text);background-color:#0000;border-radius:15px;padding:1em}input[type=text]{color:#f8f5f5;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0;width:100%;font-size:28px}.submit-btn{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.send-btn-icon{width:30px;display:block}h1{color:var(--light-text);grid-area:title;font-size:35px}h2,p{color:var(--medium-light-text)}h2{text-transform:uppercase;grid-area:subtitle;font-size:30px;font-weight:700}@keyframes cursor-blink{0%{opacity:0}to{opacity:1}}.blinking-cursor:after{content:"|";font-weight:700;animation:.5s steps(2,end) infinite cursor-blink;display:inline-block}
