@import "https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css";
@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css";
@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300;400;500;600;700&family=Outfit:wght@300;400;500;600;700;800&display=swap";
:root{--neon-cyan:#0ff;--neon-cyan-glow:#00ffff4d;--neon-purple:#a3f;--neon-purple-glow:#aa33ff4d;--neon-green:#00ff6a;--neon-green-glow:#00ff6a4d;--neon-magenta:#ff1a8c;--neon-magenta-glow:#ff1a8c4d;--neon-blue:#0080ff;--neon-blue-glow:#0080ff4d;--bg-main:#05070a;--bg-glass-card:#0a101e8c;--bg-glass-card-hover:#0f172abf;--border-cyber:1px solid #00f0ff26;--border-cyber-active:1px solid #00f0ff66;--shadow-neon-cyan:0 0 20px #00ffff40;--shadow-neon-purple:0 0 20px #aa33ff40;--font-heading:"Outfit", sans-serif;--font-code:"JetBrains Mono", "Fira Code", monospace}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--neon-cyan-glow) #0000004d;margin:0;padding:0}body{font-family:var(--font-heading);background-color:var(--bg-main);color:#f1f5f9;perspective:1200px;min-height:100vh;position:relative;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0000004d;border-radius:4px}::-webkit-scrollbar-thumb{background:var(--neon-cyan-glow);border:1px solid #00f0ff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#00f0ff66}.bg-grid-mesh{z-index:0;opacity:.55;pointer-events:none;background-image:linear-gradient(#00f0ff08 1px,#0000 1px),linear-gradient(90deg,#00f0ff08 1px,#0000 1px);background-position:50%;background-size:60px 60px;width:100%;height:100%;animation:30s linear infinite gridScroll;position:fixed;top:0;left:0;transform:rotateX(60deg)translateZ(-150px)translateY(0)}@keyframes gridScroll{0%{background-position:0 0}to{background-position:0 1000px}}.bg-aurora-glow{z-index:0;pointer-events:none;background:radial-gradient(circle at 10% 20%,#00ffff14 0%,#0000 40%),radial-gradient(circle at 90% 80%,#aa33ff14 0%,#0000 40%),radial-gradient(circle,#0080ff0d 0%,#0000 60%);width:100%;height:100%;animation:15s ease-in-out infinite alternate auroraDrift;position:fixed;top:0;left:0}@keyframes auroraDrift{0%{opacity:.8;transform:scale(1)}to{opacity:1;transform:scale(1.15)}}.app-container{z-index:1;flex-direction:column;max-width:1600px;min-height:100vh;margin:0 auto;padding:24px;display:flex;position:relative}.app-header{background:var(--bg-glass-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:var(--border-cyber);box-shadow:var(--shadow-neon-cyan);border-radius:16px;justify-content:space-between;align-items:center;margin-bottom:24px;padding:16px 24px;display:flex}.app-title-container{align-items:center;gap:16px;display:flex}.app-logo-glow{background-color:var(--neon-cyan);width:12px;height:12px;box-shadow:0 0 12px var(--neon-cyan), 0 0 24px var(--neon-cyan);border-radius:50%;animation:2s infinite pulseGlow}@keyframes pulseGlow{0%,to{opacity:.6;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}.app-title{letter-spacing:2px;background:linear-gradient(90deg, #fff, var(--neon-cyan));-webkit-text-fill-color:transparent;text-transform:uppercase;-webkit-background-clip:text;font-size:1.5rem;font-weight:800}.main-dashboard-grid{flex:1;grid-template-columns:1fr 1.3fr;gap:24px;min-height:calc(100vh - 120px);display:grid}.glass-widget{background:var(--bg-glass-card);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:var(--border-cyber);border-radius:20px;padding:24px;transition:all .3s cubic-bezier(.25,.8,.25,1);position:relative;overflow:hidden;box-shadow:0 8px 32px #0000004d,inset 0 0 20px #00f0ff05}.glass-widget:hover{border:var(--border-cyber-active);box-shadow:0 12px 40px #00f0ff1a,inset 0 0 20px #00f0ff0d}.glass-widget:before{content:"";border-top:2px solid var(--neon-cyan);border-left:2px solid var(--neon-cyan);opacity:.7;width:15px;height:15px;position:absolute;top:0;left:0}.glass-widget:after{content:"";border-bottom:2px solid var(--neon-cyan);border-right:2px solid var(--neon-cyan);opacity:.7;width:15px;height:15px;position:absolute;bottom:0;right:0}.widget-header{border-bottom:1px solid #00f0ff1a;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;display:flex}.widget-title{text-transform:uppercase;letter-spacing:2px;color:var(--neon-cyan);align-items:center;gap:8px;font-size:.9rem;font-weight:700;display:flex}.widget-subtitle{color:#f1f5f966;font-size:.75rem;font-family:var(--font-code)}.console-center-panel{flex-direction:column;gap:24px;display:flex}.hologram-display-card{flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:380px;display:flex;position:relative}.hologram-viewport{justify-content:center;align-items:center;width:250px;height:250px;margin:20px 0;display:flex;position:relative}.holo-orb{background:radial-gradient(circle at 35% 35%, #fff3, transparent 45%), radial-gradient(circle, var(--neon-cyan-glow) 10%, transparent 70%);width:120px;height:120px;box-shadow:0 0 50px var(--neon-cyan-glow), inset 0 0 30px var(--neon-cyan-glow);border:1px solid var(--neon-cyan);border-radius:50%;transition:all .6s cubic-bezier(.34,1.56,.64,1);position:absolute}.holo-ring{border:1px dashed #00f0ff66;border-radius:50%;transition:all .6s;position:absolute}.holo-ring.outer{width:200px;height:200px;animation:15s linear infinite rotateClockwise}.holo-ring.inner{border:1px dotted #b537ff66;width:160px;height:160px;animation:10s linear infinite rotateCounterClockwise}.holo-ring.horizontal{border:1px solid #00f0ff40;width:240px;height:60px;animation:8s ease-in-out infinite alternate ringOrbitX;transform:rotateX(75deg);box-shadow:0 0 15px #00f0ff1a}@keyframes ringOrbitX{0%{transform:rotateX(75deg)rotate(0)}to{transform:rotateX(75deg)rotate(360deg)}}@keyframes rotateClockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotateCounterClockwise{0%{transform:rotate(360deg)}to{transform:rotate(0)}}.holo-hud-data{font-family:var(--font-code);color:var(--neon-cyan);opacity:.65;pointer-events:none;font-size:.7rem;transition:all .5s;position:absolute}.holo-hud-data.top-left{text-align:left;top:10px;left:10px}.holo-hud-data.top-right{text-align:right;top:10px;right:10px}.holo-hud-data.bottom-left{text-align:left;bottom:10px;left:10px}.holo-hud-data.bottom-right{text-align:right;bottom:10px;right:10px}.laser-scanner-line{background:linear-gradient(90deg, transparent, var(--neon-cyan), transparent);width:100%;height:2px;box-shadow:0 0 10px var(--neon-cyan);pointer-events:none;animation:4s ease-in-out infinite laserScan;position:absolute;left:0}@keyframes laserScan{0%,to{opacity:0;top:5%}15%,85%{opacity:.8}50%{opacity:.8;top:95%}}.state-idle .holo-orb{background:radial-gradient(circle, var(--neon-cyan-glow) 10%, transparent 70%);border-color:var(--neon-cyan);box-shadow:0 0 40px var(--neon-cyan-glow);animation:4s ease-in-out infinite holoBreathe}@keyframes holoBreathe{0%,to{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}.state-listening .holo-orb{background:radial-gradient(circle, var(--neon-green-glow) 15%, transparent 70%);border-color:var(--neon-green);box-shadow:0 0 50px var(--neon-green-glow);animation:1.2s ease-in-out infinite holoListening}.state-listening .holo-ring.outer{border-color:var(--neon-green);animation:4s linear infinite rotateClockwise;transform:scale(1.1)rotate(0)}@keyframes holoListening{0%,to{transform:scale(1)}50%{transform:scale(1.15);box-shadow:0 0 60px #00ff6a80}}.state-thinking .holo-orb{background:radial-gradient(circle, var(--neon-purple-glow) 20%, transparent 60%);border-color:var(--neon-purple);box-shadow:0 0 60px var(--neon-purple-glow);border-radius:40% 60% 30% 70%/50% 60% 40% 50%;animation:.8s linear infinite holoThinking}.state-thinking .holo-ring.inner{border-color:var(--neon-magenta);animation:2s linear infinite rotateCounterClockwise;transform:scale(1.2)}@keyframes holoThinking{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.1)}to{transform:rotate(360deg)scale(1)}}.state-speaking .holo-orb{background:radial-gradient(circle, var(--neon-blue-glow) 10%, transparent 70%);border-color:var(--neon-blue);box-shadow:0 0 50px var(--neon-blue-glow), 0 0 80px #0088ff26;animation:2.5s ease-in-out infinite holoSpeaking}.state-speaking .holo-ring{animation-duration:2s!important}@keyframes holoSpeaking{0%,to{border-radius:50%;transform:scale(1)}25%{border-radius:42% 58% 70% 30%/45% 45% 55% 55%;transform:scale(1.12)rotate(45deg)}50%{border-radius:70% 30% 52% 48%/60% 40%;transform:scale(.95)rotate(90deg)}75%{border-radius:40% 60% 35% 65%/50% 65% 35% 50%;transform:scale(1.08)rotate(135deg)}}.dynamic-equalizer-stream{justify-content:center;align-items:center;gap:6px;height:40px;margin:15px 0;display:flex}.eq-bar{background:linear-gradient(to top, var(--neon-cyan), var(--neon-purple));border-radius:2px;width:4px;height:6px;transition:all .2s}.state-idle .eq-bar{height:6px}.state-listening .eq-bar{background:var(--neon-green);animation:.8s ease-in-out infinite eqListen}.state-thinking .eq-bar{background:var(--neon-purple);animation:.5s ease-in-out infinite eqThink}.state-speaking .eq-bar{background:linear-gradient(to top, var(--neon-blue), var(--neon-magenta));animation:.6s ease-in-out infinite eqSpeak}.state-listening .eq-bar:first-child{animation-delay:.1s}.state-listening .eq-bar:nth-child(2){animation-delay:.2s}.state-listening .eq-bar:nth-child(3){animation-delay:.3s}.state-listening .eq-bar:nth-child(4){animation-delay:.4s}.state-listening .eq-bar:nth-child(5){animation-delay:.3s}.state-listening .eq-bar:nth-child(6){animation-delay:.2s}.state-speaking .eq-bar:first-child{animation-delay:.15s}.state-speaking .eq-bar:nth-child(2){animation-delay:.3s}.state-speaking .eq-bar:nth-child(3){animation-delay:50ms}.state-speaking .eq-bar:nth-child(4){animation-delay:.45s}.state-speaking .eq-bar:nth-child(5){animation-delay:.2s}.state-speaking .eq-bar:nth-child(6){animation-delay:.35s}@keyframes eqListen{0%,to{height:6px}50%{height:16px}}@keyframes eqThink{0%,to{height:8px}50%{height:28px}}@keyframes eqSpeak{0%,to{height:6px}50%{height:36px}}.control-grid-layout{grid-template-columns:1fr 1fr;gap:16px;margin-top:8px;display:grid}.cyber-label{color:#f1f5f980;letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;font-size:.75rem;font-weight:700;display:block}.cyber-select{border:var(--border-cyber);width:100%;color:var(--neon-cyan);font-family:var(--font-code);cursor:pointer;background:#0a101ecc;border-radius:8px;outline:none;padding:10px 14px;font-size:.8rem;transition:all .3s}.cyber-select:focus,.cyber-select:hover{border-color:var(--neon-cyan);box-shadow:0 0 10px #00f0ff33}.cyber-select option{background:var(--bg-main);color:#fff}.cyber-slider-container{border:var(--border-cyber);background:#0a101e66;border-radius:8px;padding:12px}.cyber-slider{-webkit-appearance:none;background:#ffffff1a;border-radius:2px;outline:none;width:100%;height:4px}.cyber-slider::-webkit-slider-thumb{appearance:none;background:var(--neon-cyan);cursor:pointer;width:14px;height:14px;box-shadow:0 0 8px var(--neon-cyan);border-radius:50%;transition:transform .1s}.cyber-slider::-webkit-slider-thumb:hover{transform:scale(1.25)}.telemetry-dials-row{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px;display:grid}.dial-card{border:var(--border-cyber);text-align:center;background:#0a101e66;border-radius:12px;padding:14px;position:relative}.dial-value{font-family:var(--font-code);color:var(--neon-cyan);text-shadow:0 0 8px var(--neon-cyan-glow);margin-top:4px;font-size:1.1rem;font-weight:700}.dial-label{color:#f1f5f966;letter-spacing:1px;text-transform:uppercase;font-size:.65rem;font-weight:700}.console-stats-row{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.stat-glass-card{background:var(--bg-glass-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:var(--border-cyber);border-radius:12px;flex-direction:column;align-items:center;padding:14px;display:flex;position:relative}.stat-glow-marker{border-radius:50%;width:6px;height:6px;position:absolute;top:6px;right:6px}.stat-glow-marker.online{background-color:var(--neon-green);box-shadow:0 0 8px var(--neon-green)}.stat-title{color:#f1f5f966;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:4px;font-size:.65rem;font-weight:800}.stat-num{font-family:var(--font-code);color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan-glow);font-size:1rem;font-weight:700}.stat-num.active{color:var(--neon-green);text-shadow:0 0 10px var(--neon-green-glow)}.chat-panel-container{flex-direction:column;height:100%;display:flex}.cyber-chat-log{flex-direction:column;flex:1;gap:20px;max-height:calc(100vh - 270px);padding:12px 10px;display:flex;overflow-y:auto}.message-card{flex-direction:column;max-width:90%;animation:.4s cubic-bezier(.16,1,.3,1) forwards messageFadeIn;display:flex}@keyframes messageFadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.message-card.user{align-self:flex-end}.message-card.jarvis{align-self:flex-start}.message-header-line{font-size:.75rem;font-family:var(--font-code);align-items:center;gap:10px;margin-bottom:6px;display:flex}.message-sender{font-weight:700}.message-card.user .message-sender{color:var(--neon-blue)}.message-card.jarvis .message-sender{color:var(--neon-purple)}.message-timestamp{color:#f1f5f959}.glass-bubble{background:#0a101e66;border:1px solid #ffffff0d;border-radius:12px;padding:16px 20px;line-height:1.6;transition:all .3s;position:relative}.message-card.user .glass-bubble{background:linear-gradient(135deg,#0088ff0d 0%,#0088ff03 100%),#0a101e73;border-color:#0088ff26;border-top-right-radius:2px}.message-card.jarvis .glass-bubble{background:linear-gradient(135deg,#b537ff0d 0%,#b537ff03 100%),#0a101e73;border-color:#b537ff26;border-top-left-radius:2px}.glass-bubble:hover{box-shadow:0 4px 24px #00f0ff0d}.prompt-icon{color:var(--neon-green);margin-right:8px;font-weight:800}.message-content{color:#e2e8f0;font-size:.95rem}.generated-image-container{text-align:center;border:1px solid #00f0ff40;border-radius:12px;max-width:480px;margin:16px 0;display:inline-block;position:relative;overflow:hidden;box-shadow:0 0 25px #00f0ff26}.generated-image-container img{border-radius:10px;max-width:100%;height:auto;transition:transform .5s}.generated-image-container:hover img{transform:scale(1.02)}.bubble-action-bar{opacity:0;gap:8px;transition:all .25s;display:flex;position:absolute;top:6px;right:12px;transform:translateY(-5px)}.glass-bubble:hover .bubble-action-bar{opacity:1;transform:translateY(0)}.bubble-action-btn{color:#f1f5f966;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:.75rem;transition:all .2s}.bubble-action-btn:hover{color:var(--neon-cyan);background:#00f0ff1a}.code-block{font-family:var(--font-code);border:1px solid #00f0ff26;border-radius:8px;max-width:100%;margin-top:12px;padding:16px;font-size:.85rem;overflow-x:auto;background:#0009!important}.code-block code{text-shadow:0 0 5px #0f83;color:var(--neon-green)!important}.console-input-dock{background:var(--bg-glass-card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:var(--border-cyber);border-radius:14px;align-items:center;gap:12px;margin-top:20px;padding:6px;transition:all .3s;display:flex}.console-input-dock:focus-within{border-color:var(--neon-cyan);box-shadow:0 0 15px #00f0ff40}.console-prompt-marker{color:var(--neon-green);margin-left:12px;font-size:1.1rem;font-weight:800}.console-textbox{color:#fff;font-family:var(--font-code);background:0 0;border:none;outline:none;flex:1;padding:12px 6px;font-size:.95rem}.console-textbox::placeholder{color:#ffffff4d}.input-dock-actions{gap:8px;padding-right:6px;display:flex}.cyber-dock-btn{width:44px;height:44px;color:var(--neon-cyan);cursor:pointer;background:#00f0ff0d;border:1px solid #00f0ff33;border-radius:8px;justify-content:center;align-items:center;font-size:1.1rem;transition:all .25s;display:flex}.cyber-dock-btn:hover{border-color:var(--neon-cyan);background:#00f0ff26;transform:translateY(-2px);box-shadow:0 0 10px #00f0ff33}.cyber-dock-btn.active{background:var(--neon-green-glow);border-color:var(--neon-green);color:var(--neon-green);animation:1.5s infinite dockMicPulse}@keyframes dockMicPulse{0%,to{box-shadow:0 0 5px var(--neon-green-glow)}50%{box-shadow:0 0 15px var(--neon-green)}}.audio-hud-float{justify-content:center;gap:12px;margin-top:10px;display:flex}.audio-btn-circle{color:#fff9;cursor:pointer;background:#ffffff05;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:.95rem;transition:all .25s;display:flex}.audio-btn-circle:hover{color:var(--neon-cyan);border-color:var(--neon-cyan);background:#00f0ff1a;box-shadow:0 0 10px #00f0ff33}.audio-btn-circle.danger:hover{color:var(--danger-red);border-color:var(--danger-red);background:#ff47571a;box-shadow:0 0 10px #ff475733}.console-footer{text-align:center;color:#f1f5f94d;margin-top:20px;font-size:.75rem}.console-footer a{color:var(--neon-cyan);font-weight:600;text-decoration:none}.console-footer a:hover{text-decoration:underline}@media (max-width:992px){.main-dashboard-grid{grid-template-columns:1fr;min-height:auto}.console-center-panel{order:1}.chat-panel-container{order:2;margin-top:24px}.cyber-chat-log{max-height:500px}}@media (max-width:576px){.app-container{padding:12px}.glass-widget{padding:16px}.control-grid-layout,.telemetry-dials-row{grid-template-columns:1fr}.hologram-display-card{min-height:300px}.holo-orb{width:100px;height:100px}.holo-ring.outer{width:170px;height:170px}.holo-ring.inner{width:130px;height:130px}}
