:root{--primary-color: #00ff88;--secondary-color: #00cc66;--accent-color: #00ff00;--accent-2: #ff00ff;--bg-dark: #0a0e1a;--bg-darker: #000000;--text-light: #00ff88;--text-dim: #00aa55;--danger: #ff3366;--success: #00ff88;--glow: 0 0 10px var(--primary-color), 0 0 20px var(--primary-color), 0 0 30px var(--primary-color);--glow-strong: 0 0 15px var(--primary-color), 0 0 30px var(--primary-color), 0 0 45px var(--primary-color), 0 0 60px var(--primary-color)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Exo 2",Segoe UI,sans-serif;background:var(--bg-darker);color:var(--text-light);overflow:hidden;min-height:100vh}.scanlines{position:fixed;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(0,0,0,.15),rgba(0,0,0,.15) 1px,transparent 1px,transparent 2px);pointer-events:none;z-index:9999;animation:scanlineMove 8s linear infinite}@keyframes scanlineMove{0%{transform:translateY(0)}to{transform:translateY(100px)}}.matrix-bg{position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at center,#0a0e27e6,#05070f),repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,217,255,.03) 2px,rgba(0,217,255,.03) 4px);z-index:0}.matrix-bg:before{content:"";position:absolute;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(0,217,255,.1) 0%,transparent 50%);animation:pulse 4s ease-in-out infinite}.container{position:relative;z-index:1;width:100%;height:100vh;display:flex;flex-direction:column;padding:clamp(8px,2vw,20px);gap:clamp(8px,2vw,20px)}.top-bar{display:flex;justify-content:space-between;align-items:center;padding:clamp(10px,2vw,15px) clamp(15px,3vw,30px);background:#00d9ff0d;border:1px solid rgba(0,217,255,.3);border-radius:5px;box-shadow:0 0 20px #00d9ff33;position:relative}.top-bar:before{content:"";position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--primary-color),transparent);animation:borderScan 3s linear infinite}@keyframes borderScan{0%,to{opacity:0}50%{opacity:1}}.logo{display:flex;align-items:center;gap:clamp(10px,2vw,20px)}.logo-image{width:clamp(120px,30vw,300px);max-width:100%;height:auto;object-fit:contain}.arc-reactor{position:relative;width:60px;height:60px;display:flex;align-items:center;justify-content:center}.core{width:20px;height:20px;background:radial-gradient(circle,#fff 0%,var(--primary-color) 50%,var(--secondary-color) 100%);border-radius:50%;box-shadow:var(--glow-strong);animation:coreGlow 2s ease-in-out infinite}.ring{position:absolute;border:2px solid var(--primary-color);border-radius:50%;opacity:.6}.ring-1{width:30px;height:30px;animation:rotate 4s linear infinite}.ring-2{width:45px;height:45px;animation:rotate 6s linear infinite reverse}.ring-3{width:60px;height:60px;animation:rotate 8s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes coreGlow{0%,to{box-shadow:var(--glow)}50%{box-shadow:var(--glow-strong)}}.logo-text h1{font-family:Orbitron,sans-serif;font-size:clamp(18px,5vw,28px);font-weight:900;color:var(--primary-color);text-shadow:var(--glow);letter-spacing:clamp(2px,.5vw,4px)}.logo-text p{font-size:clamp(8px,1.5vw,10px);color:var(--text-dim);letter-spacing:clamp(1px,.3vw,2px);text-transform:uppercase}.status-panel{display:flex;align-items:center;gap:clamp(10px,3vw,30px)}.status-indicator{display:flex;align-items:center;gap:10px;padding:8px 15px;background:#00000080;border:1px solid var(--primary-color);border-radius:20px;font-family:Orbitron,sans-serif;font-size:clamp(10px,1.5vw,12px);text-transform:uppercase;letter-spacing:clamp(1px,.3vw,2px)}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--danger);box-shadow:0 0 10px var(--danger);animation:blink 2s ease-in-out infinite}.status-dot.connected{background:var(--success);box-shadow:0 0 10px var(--success)}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.system-info{display:flex;flex-direction:column;align-items:flex-end;font-size:10px;text-transform:uppercase;letter-spacing:1px}.system-info .value{color:var(--success);font-weight:600}.main-grid{display:grid;grid-template-columns:250px 1fr 250px;gap:clamp(10px,2vw,20px);flex:1;overflow:hidden}.side-panel{background:#00d9ff08;border:1px solid rgba(0,217,255,.2);border-radius:5px;padding:20px;display:flex;flex-direction:column;gap:20px;box-shadow:inset 0 0 20px #00d9ff1a}.panel-header{font-family:Orbitron,sans-serif;font-size:clamp(11px,2vw,14px);font-weight:700;color:var(--primary-color);text-transform:uppercase;letter-spacing:clamp(1px,.3vw,2px);padding-bottom:10px;border-bottom:1px solid rgba(0,217,255,.3);text-shadow:0 0 10px var(--primary-color)}.stats{display:flex;flex-direction:column;gap:15px}.stat-item{display:flex;flex-direction:column;gap:5px}.stat-item .label{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px}.progress-bar{width:100%;height:6px;background:#00000080;border:1px solid rgba(0,217,255,.3);border-radius:3px;overflow:hidden}.progress{height:100%;background:linear-gradient(90deg,var(--secondary-color),var(--primary-color));box-shadow:0 0 10px var(--primary-color);animation:progressPulse 2s ease-in-out infinite}@keyframes progressPulse{0%,to{opacity:1}50%{opacity:.7}}.stat-item .value{font-size:11px;color:var(--primary-color);font-weight:600;text-align:right}.radar{position:relative;width:100%;aspect-ratio:1;margin-top:auto}.radar-circle{width:100%;height:100%;border:2px solid rgba(0,217,255,.3);border-radius:50%;position:relative}.radar-circle:before,.radar-circle:after{content:"";position:absolute;border:1px solid rgba(0,217,255,.2);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}.radar-circle:before{width:70%;height:70%}.radar-circle:after{width:40%;height:40%}.radar-line{position:absolute;top:50%;left:50%;width:50%;height:2px;background:linear-gradient(90deg,var(--primary-color),transparent);transform-origin:left center;animation:radarSweep 4s linear infinite}@keyframes radarSweep{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.radar-dot{position:absolute;width:8px;height:8px;background:var(--primary-color);border-radius:50%;box-shadow:0 0 10px var(--primary-color);animation:radarPing 2s ease-in-out infinite}.dot-1{top:30%;left:60%;animation-delay:0s}.dot-2{top:60%;left:30%;animation-delay:.6s}.dot-3{top:70%;left:70%;animation-delay:1.2s}@keyframes radarPing{0%,to{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1)}}.capabilities-list{display:flex;flex-direction:column;gap:12px}.capability-item{display:flex;align-items:center;gap:clamp(8px,1.5vw,12px);padding:clamp(8px,1.5vw,10px);background:#0000004d;border:1px solid rgba(0,217,255,.2);border-radius:4px;font-size:clamp(10px,1.5vw,12px);transition:all .3s ease}.capability-item:hover{background:#00d9ff1a;border-color:var(--primary-color);box-shadow:0 0 15px #00d9ff4d;transform:translate(5px)}.cap-icon{font-size:18px}.waveform{display:flex;align-items:flex-end;justify-content:space-around;height:80px;margin-top:auto;gap:4px}.wave-bar{flex:1;background:linear-gradient(to top,var(--secondary-color),var(--primary-color));border-radius:2px;animation:waveAnimate 1s ease-in-out infinite}.wave-bar:nth-child(1){animation-delay:0s}.wave-bar:nth-child(2){animation-delay:.1s}.wave-bar:nth-child(3){animation-delay:.2s}.wave-bar:nth-child(4){animation-delay:.3s}.wave-bar:nth-child(5){animation-delay:.4s}.wave-bar:nth-child(6){animation-delay:.5s}.wave-bar:nth-child(7){animation-delay:.6s}.wave-bar:nth-child(8){animation-delay:.7s}@keyframes waveAnimate{0%,to{height:20%}50%{height:100%}}.center-content{display:flex;flex-direction:column;gap:20px;overflow:hidden}.main-interface{display:flex;flex-direction:column;align-items:center;gap:30px;padding:40px 20px;background:#00d9ff05;border:1px solid rgba(0,217,255,.2);border-radius:5px;position:relative;overflow:hidden}.main-interface:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(0,217,255,.1) 0%,transparent 50%);animation:rotate 20s linear infinite}.jarvis-core{position:relative;width:clamp(200px,50vw,300px);height:clamp(200px,50vw,300px);display:flex;align-items:center;justify-content:center}.orbit{position:absolute;border:2px solid rgba(0,217,255,.3);border-radius:50%;border-style:dashed}.orbit-1{width:60%;height:60%;animation:rotate 10s linear infinite}.orbit-2{width:80%;height:80%;animation:rotate 15s linear infinite reverse}.orbit-3{width:100%;height:100%;animation:rotate 20s linear infinite}.core-button-container{position:relative;z-index:10}.core-button{position:relative;width:clamp(120px,45%,150px);height:clamp(120px,45%,150px);min-width:120px;min-height:120px;background:radial-gradient(circle,rgba(0,217,255,.2) 0%,rgba(0,217,255,.05) 50%,transparent 100%);border:none;border-radius:50%;cursor:pointer;padding:10px;touch-action:manipulation;transition:all .3s ease}.core-button:hover{transform:scale(1.05)}.button-ring{position:absolute;top:50%;left:50%;width:93%;height:93%;border:clamp(2px,.5vw,3px) solid var(--primary-color);border-radius:50%;transform:translate(-50%,-50%);box-shadow:var(--glow);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(1.1);opacity:.7}}.button-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.button-text{font-family:Orbitron,sans-serif;font-size:clamp(14px,3vw,18px);font-weight:700;color:var(--primary-color);text-shadow:var(--glow);letter-spacing:clamp(2px,.5vw,3px)}.bracket{position:absolute;width:40px;height:40px;border:2px solid var(--primary-color);opacity:.6}.top-left{top:0;left:0;border-right:none;border-bottom:none}.top-right{top:0;right:0;border-left:none;border-bottom:none}.bottom-left{bottom:0;left:0;border-right:none;border-top:none}.bottom-right{bottom:0;right:0;border-left:none;border-top:none}.controls{display:flex;gap:15px;z-index:10}.control-btn{display:flex;align-items:center;gap:10px;padding:12px 24px;background:#00000080;border:1px solid var(--primary-color);border-radius:4px;color:var(--text-light);font-family:Orbitron,sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;cursor:pointer;transition:all .3s ease}.control-btn:hover{background:#00d9ff33;box-shadow:0 0 20px #00d9ff66;transform:translateY(-2px)}.control-btn.disconnect{border-color:var(--danger);color:var(--danger)}.control-btn.disconnect:hover{background:#f363;box-shadow:0 0 20px #f366}.terminal{flex:1;display:flex;flex-direction:column;background:#0009;border:1px solid rgba(0,217,255,.3);border-radius:5px;overflow:hidden;box-shadow:inset 0 0 20px #00d9ff1a}.terminal-header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;background:#00d9ff0d;border-bottom:1px solid rgba(0,217,255,.3);font-family:Orbitron,sans-serif;font-size:12px;font-weight:600;color:var(--primary-color);text-transform:uppercase;letter-spacing:2px}.terminal-controls{display:flex;gap:8px}.terminal-dot{width:10px;height:10px;border-radius:50%;background:#00d9ff80;box-shadow:0 0 5px var(--primary-color)}.terminal-body{flex:1;padding:15px;overflow-y:auto;font-family:Courier New,monospace;font-size:12px;line-height:1.6;color:var(--success)}.terminal-line{display:flex;gap:10px;margin-bottom:8px;animation:fadeIn .5s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.prompt{color:var(--primary-color);font-weight:700}.terminal-body::-webkit-scrollbar{width:8px}.terminal-body::-webkit-scrollbar-track{background:#00000080}.terminal-body::-webkit-scrollbar-thumb{background:#00d9ff80;border-radius:4px}.terminal-body::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}.footer{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(8px,2vw,15px);padding:clamp(10px,2vw,15px);background:#00d9ff08;border:1px solid rgba(0,217,255,.2);border-radius:5px;font-size:clamp(8px,1.5vw,10px);color:var(--text-dim);text-transform:uppercase;letter-spacing:clamp(.5px,.2vw,1px);text-align:center}.separator{color:var(--primary-color)}@media(max-width:1400px){.main-grid{grid-template-columns:minmax(180px,200px) 1fr minmax(180px,200px)}}@media(max-width:1200px){.main-grid{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.side-panel{width:100%;padding:15px;max-height:none}.left-panel{order:1}.center-content{order:2}.right-panel{order:3}.stats{flex-direction:row;gap:15px;overflow-x:auto;scrollbar-width:thin}.stat-item{min-width:100px;flex-shrink:0}.radar{display:none}.capabilities-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.waveform{display:none}.main-interface{padding:clamp(20px,4vw,40px) clamp(10px,2vw,20px)}}@media(max-width:1024px){.main-grid{gap:clamp(8px,1.5vw,15px)}.jarvis-core{width:clamp(180px,45vw,280px);height:clamp(180px,45vw,280px)}}@media(max-width:768px){.top-bar{flex-direction:column;gap:clamp(12px,3vw,15px);padding:clamp(12px,2.5vw,15px)}.logo{flex-direction:column;text-align:center}.status-panel{flex-direction:column;align-items:stretch;width:100%}.status-indicator,.system-info{justify-content:center;align-items:center}.jarvis-core{width:clamp(160px,60vw,250px);height:clamp(160px,60vw,250px)}.center-content{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2vw,15px)}.main-interface{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.controls{flex-direction:column;width:100%;gap:10px}.control-btn{width:100%;justify-content:center;padding:14px 20px;font-size:clamp(11px,2vw,12px)}}@media(max-width:640px){.logo-text h1{font-size:clamp(16px,6vw,22px)}.logo-image{width:clamp(100px,35vw,180px)}.jarvis-core{width:clamp(140px,65vw,220px);height:clamp(140px,65vw,220px)}.main-interface{padding:clamp(15px,3vw,30px) clamp(8px,1.5vw,15px);gap:clamp(15px,3vw,25px)}.terminal-body{font-size:10px;padding:10px}.separator{display:none}}@media(max-width:480px){.container{padding:clamp(6px,1.5vw,10px)}.jarvis-core{width:clamp(180px,75vw,220px);height:clamp(180px,75vw,220px)}.core-button{width:clamp(130px,50%,160px);height:clamp(130px,50%,160px)}.logo-image{width:clamp(80px,40vw,150px)}.panel-header{font-size:clamp(10px,2.5vw,12px)}.capability-item{padding:clamp(6px,1.2vw,8px);font-size:clamp(9px,2vw,11px)}.footer{flex-direction:column;gap:clamp(5px,1.5vw,8px);font-size:clamp(7px,2vw,9px)}}@media(max-width:390px){.jarvis-core{width:clamp(160px,80vw,200px);height:clamp(160px,80vw,200px)}.core-button{width:clamp(120px,55%,150px);height:clamp(120px,55%,150px)}.logo-text h1{font-size:clamp(14px,7vw,20px);letter-spacing:clamp(1px,.4vw,2px)}.button-text{font-size:clamp(12px,3.5vw,16px)}.main-interface{gap:clamp(12px,2.5vw,20px)}}@media(max-width:360px){.jarvis-core{width:clamp(150px,85vw,190px);height:clamp(150px,85vw,190px)}.core-button{width:clamp(115px,60%,145px);height:clamp(115px,60%,145px)}.button-text{font-size:clamp(11px,4vw,14px)}.container{padding:clamp(4px,1vw,8px)}}@media(max-height:500px)and (orientation:landscape){.container{padding:clamp(4px,1vw,8px);gap:clamp(5px,1vw,10px)}.top-bar{flex-direction:row;padding:clamp(8px,1.5vw,12px) clamp(12px,2vw,20px)}.jarvis-core{width:clamp(100px,30vh,180px);height:clamp(100px,30vh,180px)}.main-interface{padding:clamp(10px,2vh,20px) clamp(8px,1.5vw,15px)}.logo{flex-direction:row;gap:clamp(8px,1.5vw,15px)}.status-panel{flex-direction:row}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(max-width:768px){.scanlines{display:none}.matrix-bg:before{animation-duration:8s}.radar-line{animation-duration:6s}.orbit-1{animation-duration:15s}.orbit-2{animation-duration:20s}.orbit-3{animation-duration:25s}}@media(max-width:480px){.matrix-bg:before{animation:none}.bracket{opacity:.3}}