:root {
            --loader-color-light: rgba(0, 0, 0, 0.2);
            --loader-color-active: rgba(0, 0, 0, 1);
        }
        :root {
            --loader-color-light: rgba(255, 255, 255, 0.2);
            --loader-color-active: rgba(255, 255, 255, 1);
        }
        .fade-in { animation: fadeIn ease 10s; -webkit-animation: fadeIn ease 10s; -moz-animation: fadeIn ease 10s; -o-animation: fadeIn ease 10s; -ms-animation: fadeIn ease 10s; }
        @keyframes fadeIn { 0% {opacity:0;} 40% {opacity:1;} }
        @-moz-keyframes fadeIn { 0% {opacity:0;} 40% {opacity:1;} }
        .loader10:before{ content: ""; position: absolute; top: 0px; left: -25px; height: 12px; width: 12px; border-radius: 12px; -webkit-animation: loader10g 3s ease-in-out infinite; animation: loader10g 3s ease-in-out infinite; }
        .loader10{ position: relative; width: 12px; height: 12px; top: 46%; left: 46%; border-radius: 12px; -webkit-animation: loader10m 3s ease-in-out infinite; animation: loader10m 3s ease-in-out infinite; }
        .loader10:after{ content: ""; position: absolute; top: 0px; left: 25px; height: 10px; width: 10px; border-radius: 10px; -webkit-animation: loader10d 3s ease-in-out infinite; animation: loader10d 3s ease-in-out infinite; }
        @-webkit-keyframes loader10g{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-active);} 50%{background-color: var(--loader-color-light);} 75%{background-color: var(--loader-color-light);} 100%{background-color: var(--loader-color-light);} }
        @keyframes loader10g{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-active);} 50%{background-color: var(--loader-color-light);} 75%{background-color: var(--loader-color-light);} 100%{background-color: var(--loader-color-light);} }
        @-webkit-keyframes loader10m{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-light);} 50%{background-color: var(--loader-color-active);} 75%{background-color: var(--loader-color-light);} 100%{background-color: var(--loader-color-light);} }
        @keyframes loader10m{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-light);} 50%{background-color: var(--loader-color-active);} 75%{background-color: var(--loader-color-light);} 100%{background-color: var(--loader-color-light);} }
        @-webkit-keyframes loader10d{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-light);} 50%{background-color: var(--loader-color-light);} 75%{background-color: var(--loader-color-active);} 100%{background-color: var(--loader-color-light);} }
        @keyframes loader10d{ 0%{background-color: var(--loader-color-light);} 25%{background-color: var(--loader-color-light);} 50%{background-color: var(--loader-color-light);} 75%{background-color: var(--loader-color-active);} 100%{background-color: var(--loader-color-light);} }
        body { font-family: "Google Sans Flex", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: semibold; }
        html, body { height: 100%; margin: 0; overflow: hidden; }
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        .message-bubble { animation: fadeIn 0.3s ease-out; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
        .input-shadow { box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04); }
        .dark .input-shadow { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(0, 0, 0, 0.2); }
        .sidebar-enter { animation: sidebarEnter 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
        @keyframes sidebarEnter { from { transform: translateX(-100%); } to { transform: translateX(0); } }
        .sidebar-exit { animation: sidebarExit 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
        @keyframes sidebarExit { from { transform: translateX(0); } to { transform: translateX(-100%); } }
        .backdrop-fade-in { animation: backdropFadeIn 0.3s ease forwards; }
        @keyframes backdropFadeIn { from { opacity: 0; } to { opacity: 1; } }
        .backdrop-fade-out { animation: backdropFadeOut 0.3s ease forwards; }
        @keyframes backdropFadeOut { from { opacity: 1; } to { opacity: 0; } }
        .agent-dropdown { animation: dropdownEnter 0.15s ease-out; transform-origin: bottom left; }
        @keyframes dropdownEnter { from { opacity: 0; transform: scale(0.95) translateY(10px); } to { opacity: 1; transform: scale(1) translateY(0); } }
        .skeleton-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
        @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
        .tab-content { display: none; }
        .tab-content.active { display: flex; flex-direction: column; }
        .terminal-content { font-family: 'Courier New', 'Fira Code', monospace; background: #1e1e1e; color: #d4d4d4; padding: 16px; border-radius: 12px; height: 100%; overflow-y: auto; font-size: 12px; }
        .terminal-line { margin-bottom: 4px; white-space: pre-wrap; word-break: break-word; border-left: 2px solid transparent; padding-left: 8px; }
        .terminal-line:hover { background: rgba(255,255,255,0.05); }
        .terminal-line.success { color: #4ec9b0; border-left-color: #4ec9b0; }
        .terminal-line.error { color: #f48771; border-left-color: #f48771; }
        .terminal-line.info { color: #9cdcfe; border-left-color: #9cdcfe; }
        .terminal-line.warning { color: #ce9178; border-left-color: #ce9178; }
        .thoughts-container { transition: all 0.2s ease; }