@import "https://fonts.googleapis.com/css2?family=Righteous&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap";:root{--bg-color:#f4eedf;--primary:#266367;--secondary:#df5f3e;--accent:#e3b12f;--text-main:#333;--font-heading:"Righteous", cursive;--font-body:"Space Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-color);color:var(--text-main);background-image:radial-gradient(var(--accent) 2px, transparent 2px), radial-gradient(var(--secondary) 2px, transparent 2px);background-position:0 0,30px 30px;background-size:60px 60px;background-attachment:fixed;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.retro-container{border:15px solid var(--primary);width:100%;max-width:900px;height:85vh;box-shadow:10px 10px 0 var(--secondary), 20px 20px 0 var(--accent), inset 0 0 20px #0000001a;background-color:#fffaf0;border-radius:40px;flex-direction:column;display:flex;position:relative;overflow:hidden}.retro-container:after{content:" ";z-index:2;pointer-events:none;background:linear-gradient(#12101000 50%,#0000000d 50%) 0 0/100% 4px,linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f) 0 0/6px 100%;display:block;position:absolute;inset:0}.header{background-color:var(--primary);color:#fffaf0;text-align:center;font-family:var(--font-heading);letter-spacing:2px;border-bottom:5px solid var(--secondary);justify-content:space-between;align-items:center;padding:20px;font-size:2.5rem;display:flex}.chat-window{z-index:1;background-color:#fffaf0;flex-direction:column;flex:1;gap:20px;padding:30px;display:flex;overflow-y:auto}.message{border-radius:20px;max-width:80%;padding:15px 20px;font-size:1.1rem;line-height:1.5;animation:.3s cubic-bezier(.175,.885,.32,1.275) forwards popIn;position:relative}@keyframes popIn{0%{opacity:0;transform:scale(.9)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.message.user{background-color:var(--secondary);color:#fff;box-shadow:4px 4px 0 var(--accent);border-bottom-right-radius:0;align-self:flex-end}.message.bot{color:var(--text-main);box-shadow:4px 4px 0 var(--primary);background-color:#e0e0e0;border-bottom-left-radius:0;align-self:flex-start}.message img{border:4px solid var(--primary);border-radius:10px;max-width:100%;margin-top:10px}.input-area{background-color:var(--accent);border-top:5px solid var(--primary);z-index:1;align-items:center;gap:15px;padding:20px;display:flex}.input-field{border:4px solid var(--primary);font-family:var(--font-body);background-color:#fffaf0;border-radius:15px;outline:none;flex:1;padding:15px;font-size:1.1rem;transition:all .2s}.input-field:focus{box-shadow:4px 4px 0 var(--secondary);transform:translateY(-2px)}.send-btn{background-color:var(--primary);color:#fff;font-family:var(--font-heading);cursor:pointer;box-shadow:4px 4px 0 var(--secondary);border:none;border-radius:15px;padding:15px 30px;font-size:1.2rem;transition:all .2s}.send-btn:hover{box-shadow:6px 6px 0 var(--secondary);transform:translateY(-2px)}.send-btn:active{box-shadow:0px 0px 0 var(--secondary);transform:translateY(2px)}.toggle-container{font-family:var(--font-heading);color:var(--primary);align-items:center;gap:10px;font-size:1.2rem;display:flex}.switch{width:60px;height:34px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:var(--primary);border:3px solid #fffaf0;border-radius:34px;transition:all .4s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:22px;height:22px;transition:all .4s;position:absolute;bottom:3px;left:4px}input:checked+.slider{background-color:var(--secondary)}input:checked+.slider:before{transform:translate(24px)}.loading-dots{align-items:center;gap:5px;height:20px;display:flex}.dot{background-color:var(--primary);border-radius:50%;width:10px;height:10px;animation:.5s infinite alternate bounce}.dot:nth-child(2){animation-delay:.1s}.dot:nth-child(3){animation-delay:.2s}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-10px)}}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{border-left:3px solid var(--primary);background:#fffaf0}::-webkit-scrollbar-thumb{background:var(--secondary);border:3px solid #fffaf0;border-radius:6px}