:root{--bg-root: #0a0e1a;--bg-surface: #111827;--bg-elevated: #1a2035;--bg-hover: #1e2a42;--bg-glow: rgba(6, 182, 212, .04);--text-primary: #e8edf5;--text-secondary: #8b98b0;--text-muted: #566178;--phase-think: #f59e0b;--phase-think-bg: rgba(245, 158, 11, .08);--phase-think-border: rgba(245, 158, 11, .25);--phase-act: #3b82f6;--phase-act-bg: rgba(59, 130, 246, .08);--phase-act-border: rgba(59, 130, 246, .25);--phase-observe: #a78bfa;--phase-observe-bg: rgba(167, 139, 250, .08);--phase-observe-border: rgba(167, 139, 250, .25);--phase-evaluate: #f43f5e;--phase-evaluate-bg: rgba(244, 63, 94, .08);--phase-evaluate-border: rgba(244, 63, 94, .25);--phase-rebuild: #06b6d4;--phase-rebuild-bg: rgba(6, 182, 212, .08);--phase-rebuild-border: rgba(6, 182, 212, .25);--success: #10b981;--warning: #f59e0b;--error: #ef4444;--accent: #06b6d4;--border: rgba(255, 255, 255, .06);--border-light: rgba(255, 255, 255, .1);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--font-display: "Outfit", sans-serif;--font-mono: "JetBrains Mono", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-display);background:var(--bg-root);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 8px var(--glow-color, rgba(6, 182, 212, .3))}50%{box-shadow:0 0 20px var(--glow-color, rgba(6, 182, 212, .5))}}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes progress-stripe{0%{background-position:0 0}to{background-position:40px 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes data-flow{0%{background-position:100% 0}to{background-position:-100% 0}}@keyframes ripple{0%{transform:scale(1);opacity:1}to{transform:scale(2.5);opacity:0}}@keyframes typewriter{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-right-color:transparent}50%{border-right-color:var(--accent)}}@keyframes scale-in{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}@keyframes glow-pulse{0%,to{opacity:.4}50%{opacity:1}}@keyframes sweep{0%{left:-30%}to{left:130%}}.pipeline-stage{transition:all .4s cubic-bezier(.4,0,.2,1)}.phase-connector{position:relative}.phase-connector:after{content:"";position:absolute;left:18px;top:100%;width:2px;height:12px;background:linear-gradient(to bottom,var(--border-light),transparent)}.phase-connector:last-child:after{display:none}.thinking-scroll{scroll-behavior:smooth}.arch-node{padding:8px 14px;border-radius:var(--radius-sm);border:1px solid var(--border-light);background:var(--bg-elevated);font-size:11px;font-family:var(--font-mono);text-align:center;transition:all .3s;position:relative}.arch-node:hover{border-color:var(--accent);background:var(--bg-glow)}.arch-node.active{border-color:var(--accent);box-shadow:0 0 12px #06b6d433}.synthesis-glow{background:linear-gradient(135deg,#a78bfa0d,#06b6d40d);animation:scale-in .5s ease-out}