:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-surface: #334155;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--accent-blue: #3b82f6;--accent-green: #22c55e;--accent-yellow: #eab308;--accent-red: #ef4444;--border-color: #475569}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);height:100vh;overflow:hidden}#root{height:100vh;display:flex;flex-direction:column}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);min-height:44px;gap:1rem}.status-bar-left,.status-bar-right{display:flex;align-items:center;gap:.75rem}.status-bar-center{display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-badge{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:9999px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.025em}.status-pending{background:#eab30826;color:var(--accent-yellow);border:1px solid var(--accent-yellow)}.status-active{background:#22c55e26;color:var(--accent-green);border:1px solid var(--accent-green)}.status-ended{background:#64748b26;color:var(--text-muted);border:1px solid var(--text-muted)}.status-failed{background:#ef444426;color:var(--accent-red);border:1px solid var(--accent-red)}.status-detail{font-size:.8rem;color:var(--text-secondary)}.ws-indicator{font-size:.7rem;padding:.15rem .5rem;border-radius:9999px}.ws-connected{background:#22c55e1a;color:var(--accent-green);border:1px solid var(--accent-green)}.ws-disconnected{background:#ef44441a;color:var(--accent-red);border:1px solid var(--accent-red)}.app-viewer{display:flex;flex-direction:column;height:100vh}.app-main{flex:1;overflow:hidden;position:relative}.cobrowse-frame{width:100%;height:100%;background:var(--bg-primary)}.cobrowse-viewport{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.cobrowse-placeholder{text-align:center;color:var(--text-muted)}.placeholder-icon{margin-bottom:1rem;color:var(--text-muted)}.placeholder-icon svg{opacity:.5}.cobrowse-placeholder p{margin-bottom:.25rem}.placeholder-hint{font-size:.8rem;opacity:.6}.app-loading,.app-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:1rem;color:var(--text-primary)}.app-error h1{font-size:1.5rem;font-weight:600}.app-error p{color:var(--text-secondary);max-width:40rem;text-align:center}.app-error code{background:var(--bg-surface);padding:.15rem .4rem;border-radius:.25rem;font-size:.85rem;color:var(--accent-blue);word-break:break-all}.spinner{width:2rem;height:2rem;border:3px solid var(--bg-surface);border-top:3px solid var(--accent-blue);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.btn-retry,.btn-dismiss{padding:.5rem 1.5rem;border:1px solid var(--border-color);border-radius:.375rem;background:var(--bg-surface);color:var(--text-primary);cursor:pointer;font-size:.875rem;transition:background .15s}.btn-retry:hover,.btn-dismiss:hover{background:var(--border-color)}.session-ended-overlay{display:flex;align-items:center;justify-content:center;height:100vh;background:#0f172ad9;animation:fadeIn .3s ease}.session-ended-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:.75rem;padding:2rem;text-align:center;max-width:24rem}.session-ended-icon{margin-bottom:1rem;color:var(--accent-green)}.session-ended-card h2{font-size:1.25rem;margin-bottom:.5rem}.session-ended-card p{color:var(--text-secondary);margin-bottom:1.5rem;font-size:.9rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}