/* Relay: a non-modal engineering workspace above the platform's frames. */
#relay-root { --relay-cyan:#58e4f1; --relay-ink:#e5f2f7; --relay-muted:#97acbd; --relay-line:#233c4e; --relay-bg:#09131f; color:var(--relay-ink); font:14px/1.5 Inter,system-ui,-apple-system,sans-serif; position:fixed; z-index:6000; inset:0; pointer-events:none; }
#relay-root *, #relay-root *::before, #relay-root *::after { box-sizing:border-box; }
#relay-root [hidden] { display:none !important; }
.auth-locked #relay-root, .auth-pending #relay-root { visibility:hidden; }
#relay-root button, #relay-root a, #relay-root textarea, #relay-root select { font:inherit; }
#relay-root button { cursor:pointer; color:inherit; background:#112432; border:1px solid var(--relay-line); border-radius:8px; padding:8px 11px; text-transform:none; letter-spacing:normal; }
#relay-root button:hover { background:#1a3444; border-color:#458194; }
#relay-root button:disabled { opacity:.45; cursor:default; }
#relay-root :focus-visible { outline:2px solid var(--relay-cyan); outline-offset:3px; }
#relay-root a { color:var(--relay-cyan); }
.relay-launcher { pointer-events:auto; position:absolute; right:24px; bottom:42px; display:flex; align-items:center; gap:10px; padding:8px 17px 8px 8px !important; box-shadow:0 8px 35px #0008,0 0 25px #19d4e015; border-color:#366474 !important; border-radius:38px !important; background:#101f2bee !important; }
.relay-launcher .relay-robot { width:44px; height:44px; }
.relay-launch-label { display:flex; flex-direction:column; text-align:left; font-weight:650; font-size:14px; }
.relay-launch-label small { color:var(--relay-muted); font-size:10px; font-weight:400; letter-spacing:.09em; }
.relay-panel { position:absolute; pointer-events:auto; display:flex; flex-direction:column; right:24px; bottom:42px; width:460px; height:min(750px,calc(100dvh - 72px)); min-width:340px; min-height:380px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); background:var(--relay-bg); border:1px solid #355363; border-radius:16px; overflow:hidden; box-shadow:0 25px 90px #0009,0 0 30px #0cf08a09; resize:both; }
.relay-panel.relay-expanded { top:20px !important; right:20px !important; bottom:20px !important; left:auto !important; width:min(860px,calc(100vw - 40px)) !important; height:calc(100dvh - 40px) !important; }
.relay-head { flex:none; padding:14px 13px; display:flex; gap:11px; align-items:center; background:linear-gradient(125deg,#122737,#0c1825); border-bottom:1px solid var(--relay-line); cursor:grab; touch-action:none; user-select:none; }
.relay-head .relay-robot { width:47px; height:47px; flex:none; }
.relay-name { min-width:0; flex:1; }
.relay-name h2 { margin:0; font-size:18px; font-weight:650; letter-spacing:.01em; color:var(--relay-ink); }
.relay-name p { margin:1px 0 0; font-size:10px; color:var(--relay-muted); }
.relay-head-tools { display:flex; gap:4px; }
#relay-root .relay-icon { border-color:transparent; background:transparent; padding:5px 7px; font-size:19px; line-height:1.25; }
.relay-context { padding:10px 16px; background:#0d1c2a; border-bottom:1px solid var(--relay-line); font-size:11px; display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
.relay-context-label { flex:1; color:var(--relay-muted); min-width:120px; overflow-wrap:anywhere; }
#relay-root .relay-context button { font-size:10px; padding:4px 7px; }
.relay-state { padding:8px 17px 0; color:var(--relay-muted); font-size:11px; display:flex; align-items:center; gap:7px; }
.relay-state::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--relay-cyan); box-shadow:0 0 8px #58e4f166; flex:none; }
[data-state='error'] .relay-state::before { background:#ffbd80; }
.relay-log { overflow:auto; flex:1; min-height:0; padding:12px 17px 16px; scrollbar-color:#334d5e transparent; overscroll-behavior:contain; }
.relay-welcome { padding:18px 3px 12px; }
.relay-welcome .relay-eyebrow { color:var(--relay-cyan); font:10px/1.5 ui-monospace,monospace; letter-spacing:.16em; }
.relay-welcome h3 { margin:8px 0; font-size:24px; letter-spacing:-.035em; font-weight:550; line-height:1.25; }
.relay-welcome p { color:var(--relay-muted); margin:9px 0 20px; font-size:13px; }
.relay-prompts { display:grid; gap:8px; }
#relay-root .relay-prompt { background:#10222f; text-align:left; display:flex; align-items:center; gap:10px; padding:12px; font-size:12px; }
.relay-prompt span { color:var(--relay-cyan); }
.relay-message { margin:14px 0; overflow-wrap:anywhere; }
.relay-message-label { font:10px/1.5 ui-monospace,monospace; color:var(--relay-cyan); letter-spacing:.08em; margin-bottom:6px; }
.relay-message-text { white-space:pre-wrap; line-height:1.65; font-size:13px; }
.relay-message-user { background:#173041; border:1px solid #244457; padding:11px 13px; margin-left:26px; border-radius:12px 12px 3px 12px; }
.relay-message-user .relay-message-label { color:#a4bfce; }
.relay-message-user .relay-message-text { font-size:13px; }
.relay-card { border:1px solid var(--relay-line); border-radius:10px; margin:10px 0; background:#0e202d; padding:11px; font-size:12px; overflow-wrap:anywhere; }
.relay-card h4 { font-size:12px; margin:0 0 6px; color:#d3e6ee; font-weight:600; }
.relay-card p { margin:4px 0 9px; color:var(--relay-muted); }
.relay-card-actions { display:flex; gap:6px; flex-wrap:wrap; }
#relay-root .relay-card button { font-size:11px; padding:5px 9px; }
.relay-card details { margin-bottom:10px; }
.relay-card pre, .relay-inspector pre { font:11px/1.6 ui-monospace,monospace; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--relay-muted); }
.relay-composer { margin:0; padding:11px 15px 13px; border-top:1px solid var(--relay-line); background:#0d1b28; flex:none; }
#relay-root .relay-composer textarea { resize:none; display:block; width:100%; min-height:65px; max-height:130px; background:#08131e; color:var(--relay-ink); border:1px solid #304a5c; border-radius:10px; padding:11px 12px; font-size:13px; line-height:1.5; }
.relay-composer textarea::placeholder { color:#7c95a8; }
.relay-compose-tools { margin-top:8px; display:flex; gap:8px; align-items:center; }
.relay-compose-note { color:#7893a8; flex:1; font-size:10px; }
#relay-root .relay-primary { background:#64e2ee; color:#07212b; border-color:#64e2ee; font-weight:650; }
#relay-root .relay-primary:hover { background:#a0f4fa; }
.relay-error { color:#ffd4a6; background:#392a20; border:1px solid #6b5139; border-radius:8px; padding:10px; font-size:12px; margin-top:9px; }
.relay-inspector, .relay-history { overflow:auto; flex:1; min-height:0; padding:16px; overscroll-behavior:contain; }
.relay-inspector h3, .relay-history h3 { margin:10px 0; font-size:17px; }
.relay-inspector p { font-size:12px; color:var(--relay-muted); overflow-wrap:anywhere; }
.relay-inspector-toolbar { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:12px 0; }
.relay-inspector-toolbar a { font-size:12px; }
.relay-table-wrap { overflow:auto; width:100%; border:1px solid var(--relay-line); border-radius:8px; margin:10px 0; }
#relay-root table { border-collapse:collapse; width:100%; font:11px/1.5 ui-monospace,monospace; white-space:nowrap; }
#relay-root th, #relay-root td { border:1px solid #233c4e; padding:7px 9px; text-align:left; vertical-align:top; color:#cbdae5; background:transparent; }
#relay-root th { background:#142b3a; color:#abcedd; font-weight:500; position:sticky; top:0; }
.relay-data-path { font:11px/1.5 ui-monospace,monospace; color:var(--relay-muted); overflow-wrap:anywhere; }
.relay-data-item { display:flex; gap:10px; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid #233c4e; font-size:12px; }
.relay-data-item span { overflow-wrap:anywhere; }
.relay-history-entry { display:flex; align-items:center; gap:8px; margin:8px 0; }
#relay-root .relay-history-entry button:first-child { flex:1; text-align:left; overflow-wrap:anywhere; }
.relay-robot { color:var(--relay-cyan); overflow:visible; }
.relay-robot-head { transform-origin:32px 32px; animation:relay-float 5s ease-in-out infinite; }
.relay-robot-eyes { transform-origin:32px 29px; animation:relay-blink 6s infinite; }
.relay-robot-signal { transform-origin:32px 8px; }
[data-state='thinking'] .relay-robot-head { animation:relay-think 2s ease-in-out infinite; }
[data-state='running-study'] .relay-robot-signal { animation:relay-signal .9s ease-in-out infinite; }
[data-state='responding'] .relay-robot-mouth { animation:relay-talk .45s ease-in-out infinite alternate; transform-origin:32px 39px; }
[data-state='awaiting-input'] .relay-robot { color:#f6c580; }
[data-state='error'] .relay-robot { color:#ffa880; }
[data-state='stopping'] .relay-robot { color:#f6c580; }
.relay-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
@keyframes relay-float { 50% { transform:translateY(-2px); } }
@keyframes relay-blink { 0%,44%,48%,100% { transform:scaleY(1); } 46% { transform:scaleY(.12); } }
@keyframes relay-think { 50% { transform:rotate(-6deg) translateY(-2px); } }
@keyframes relay-signal { 50% { opacity:.25; transform:scale(.7); } }
@keyframes relay-talk { to { transform:scaleX(.65) scaleY(1.8); } }
@media (max-width:600px) {
 .relay-panel, .relay-panel.relay-expanded { width:100vw !important; height:100dvh !important; max-width:none; max-height:none; min-width:0; min-height:0; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important; border-radius:0; resize:none; padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom); }
 .relay-launcher { right:14px; bottom:calc(20px + env(safe-area-inset-bottom)); }
 .relay-head { cursor:default; }
 .relay-name p { font-size:9px; }
 #relay-root [data-expand] { display:none; }
 .relay-composer textarea { font-size:16px; }
 .relay-head-tools { gap:0; }
}
@media (prefers-reduced-motion:reduce) { #relay-root *, #relay-root *::before { animation:none !important; transition:none !important; } }
