:root{--bg-color: #020408;--panel-color: rgba(6, 10, 18, .92);--cyan: #00f2ff;--green: #00ff9d;--danger: #ff4d4d;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--border: 1px solid rgba(0, 242, 255, .2)}body{margin:0;background-color:var(--bg-color);color:var(--text-primary);font-family:JetBrains Mono,Fira Code,monospace;overflow:hidden}.app-container{height:100vh;display:flex;flex-direction:column;position:relative;background-size:cover;background-position:center}.app-container:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,transparent,rgba(0,0,0,.8));pointer-events:none}.scanline{position:absolute;top:0;left:0;width:100%;height:4px;background:#00f2ff0d;z-index:100;pointer-events:none;animation:scan 10s linear infinite}@keyframes scan{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.tactical-header{height:64px;padding:0 1.5rem;background:var(--panel-color);border-bottom:var(--border);display:flex;align-items:center;justify-content:space-between;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10}.logo-section{display:flex;align-items:center;gap:12px;position:relative}.icon-shield{color:var(--cyan);filter:drop-shadow(0 0 8px var(--cyan))}.radar-ping{position:absolute;width:24px;height:24px;border:1px solid var(--cyan);border-radius:50%;left:-4px;animation:ping 2s cubic-bezier(0,0,.2,1) infinite}@keyframes ping{75%,to{transform:scale(2.5);opacity:0}}.version{font-size:.6rem;background:var(--cyan);color:#000;padding:1px 4px;border-radius:2px;font-weight:800}.sync-status{font-size:.7rem;color:var(--green);display:flex;align-items:center;gap:6px;padding:4px 10px;background:#00ff9d1a;border:1px solid rgba(0,255,157,.2);border-radius:20px}.chat-area{flex:1;overflow-y:auto;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem;z-index:5}.message-row{display:flex;width:100%}.message-row.user{justify-content:flex-end}.message-bubble{max-width:80%;background:#0a0f19d9;border:var(--border);padding:1.2rem;border-radius:4px;box-shadow:0 4px 20px #0006}.user .message-bubble{border-right:3px solid var(--cyan);background:#00f2ff0d}.bubble-header{display:flex;justify-content:space-between;font-size:.6rem;margin-bottom:.8rem;color:var(--cyan);letter-spacing:1px}.bubble-content{line-height:1.6;font-size:.9rem;white-space:pre-wrap}.image-frame{margin-top:1rem;border:1px solid var(--cyan);position:relative;background:#000}.image-frame img{width:100%;display:block;opacity:.9}.image-hud{position:absolute;bottom:0;width:100%;background:#000000b3;padding:4px 8px;display:flex;justify-content:space-between;font-size:.55rem;color:var(--cyan)}.loading-block{display:flex;flex-direction:column;align-items:center;padding:2rem}.loading-bars{display:flex;gap:6px;margin-bottom:10px}.loading-bars span{width:3px;height:12px;background:var(--cyan);animation:load 1s infinite ease-in-out}.loading-bars span:nth-child(2){animation-delay:.2s}.loading-bars span:nth-child(3){animation-delay:.4s}@keyframes load{0%,to{transform:scaleY(1)}50%{transform:scaleY(2)}}.loading-text{font-size:.75rem;color:var(--cyan);opacity:.8}.input-section{padding:1.2rem 1.5rem;background:var(--panel-color);border-top:var(--border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.quick-bar{display:flex;gap:8px;margin-bottom:12px}.quick-bar button{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--text-secondary);padding:4px 10px;font-size:.7rem;cursor:pointer;transition:.2s}.quick-bar button:hover{border-color:var(--cyan);color:var(--cyan)}.input-group{display:flex;background:#0006;border:1px solid var(--cyan);align-items:center}.input-prefix{padding:0 12px;color:var(--cyan)}.input-group input{flex:1;background:transparent;border:none;color:#fff;padding:12px;outline:none;font-family:inherit}.action-btn{background:var(--cyan);color:#000;border:none;padding:0 20px;height:44px;cursor:pointer;display:flex;align-items:center}.keyboard-hint{font-size:.6rem;color:var(--text-secondary);margin-top:8px;text-align:right}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.pulse{animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}
