/* AIOS // CHAT NODE — shared cyberpunk surface */
:root {
  --chat-cy-bg: #060910;
  --chat-cy-surface: rgba(10, 16, 29, .88);
  --chat-cy-surface-2: rgba(17, 25, 43, .94);
  --chat-cy-border: rgba(0, 229, 255, .18);
  --chat-cy-cyan: #00e5ff;
  --chat-cy-violet: #9b6cff;
  --chat-cy-pink: #ff3cac;
  --chat-cy-green: #48ff9b;
}

[data-theme='light'] {
  --chat-cy-bg: #f3f6fa;
  --chat-cy-surface: rgba(255,255,255,.94);
  --chat-cy-surface-2: rgba(247,249,252,.98);
  --chat-cy-border: rgba(0,103,128,.22);
  --chat-cy-cyan: #007f99;
  --chat-cy-violet: #6542b8;
  --chat-cy-pink: #c42672;
  --chat-cy-green: #167a4b;
}

body.chat-page {
  background:
    linear-gradient(rgba(0,229,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,229,255,.022) 1px, transparent 1px),
    radial-gradient(circle at 90% 0%, rgba(155,108,255,.12), transparent 32rem),
    var(--chat-cy-bg);
  background-size: 36px 36px, 36px 36px, auto, auto;
}

[data-theme='light'] body.chat-page {
  background:
    linear-gradient(rgba(0,127,153,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,127,153,.03) 1px, transparent 1px),
    radial-gradient(circle at 90% 0%, rgba(101,66,184,.09), transparent 32rem),
    var(--chat-cy-bg);
}

.chat-page .app-header {
  background: var(--chat-cy-surface);
  border-bottom: 1px solid var(--chat-cy-border);
  box-shadow: 0 0 28px rgba(0,229,255,.06);
}

.chat-brand { display:flex; align-items:center; gap:11px; }
.chat-mark { width:30px; height:30px; display:grid; place-items:center; color:var(--chat-cy-cyan); border:1px solid var(--chat-cy-cyan); box-shadow:0 0 14px rgba(0,229,255,.28); font:700 11px var(--font-mono); }
.chat-kicker { color:var(--chat-cy-cyan); font:600 10px var(--font-mono); letter-spacing:.15em; }
.chat-title { margin:2px 0 0; font:600 16px var(--font-mono); letter-spacing:.04em; }
.chat-live { color:var(--chat-cy-green); font:600 10px var(--font-mono); letter-spacing:.08em; }
.chat-live::before { content:'●'; margin-right:6px; animation:chatPulse 1.8s ease-in-out infinite; }

.chat-page .app-sidebar {
  background: var(--chat-cy-surface);
  border-right-color: var(--chat-cy-border);
}
.chat-page .sidebar-label { color:var(--chat-cy-cyan); font-family:var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }
.chat-page .sidebar-section { border-bottom-color:var(--chat-cy-border); }
.chat-page .app-content { background:transparent; }
.chat-page .chat { background:transparent; }
.chat-page .chat-inner { max-width:900px; }

.chat-page .msg.assistant .avatar { color:var(--chat-cy-cyan); border-color:rgba(0,229,255,.35); background:rgba(0,229,255,.08); box-shadow:0 0 12px rgba(0,229,255,.12); }
.chat-page .msg.user .avatar { color:var(--chat-cy-violet); border-color:rgba(155,108,255,.35); background:rgba(155,108,255,.1); }
.chat-page .msg.assistant .bubble { background:var(--chat-cy-surface); border-color:var(--chat-cy-border); box-shadow:0 8px 26px rgba(0,0,0,.12); }
.chat-page .msg.user .bubble { background:var(--chat-cy-surface-2); border-color:rgba(155,108,255,.22); }
.chat-page .timestamp { font-family:var(--font-mono); font-size:10px; }
.chat-page .composer { background:var(--chat-cy-surface); border-top-color:var(--chat-cy-border); box-shadow:0 -10px 30px rgba(0,0,0,.12); }
.chat-page .composer textarea { border-color:var(--chat-cy-border); background:var(--chat-cy-surface-2); }
.chat-page .btn-primary { background:linear-gradient(110deg,#087c94,#673ab7); box-shadow:0 0 16px rgba(0,229,255,.16); }
.chat-page .empty-state-icon { color:var(--chat-cy-cyan); filter:drop-shadow(0 0 10px rgba(0,229,255,.22)); }
.chat-page .empty-state-title { font-family:var(--font-mono); letter-spacing:.04em; }
.chat-page .rag-inline, .chat-page .rag-analysis-inline { border-color:var(--chat-cy-border); }

@keyframes chatPulse { 50% { opacity:.35; } }
@media (max-width:760px) { .chat-live { display:none; } }

/* Collapsible route telemetry */
.chat-page .chat-status-bar {
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:6px 10px; border:1px solid var(--chat-cy-border);
  border-radius:var(--radius-sm); color:var(--chat-cy-cyan);
  background:var(--chat-cy-surface); font:10px var(--font-mono);
  letter-spacing:.04em; transition:border-color var(--transition-fast), background var(--transition-fast);
}
.chat-page .chat-status-bar:hover { border-color:var(--chat-cy-cyan); background:var(--chat-cy-surface-2); }
.chat-page .credits-modal {
  min-width:290px; padding:12px 14px; border-color:var(--chat-cy-border);
  background:var(--chat-cy-surface); box-shadow:0 14px 40px rgba(0,0,0,.24), 0 0 24px rgba(0,229,255,.08);
}
.chat-page .credits-modal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:9px; margin-bottom:3px; border-bottom:1px solid var(--chat-cy-border); }
.chat-page .credits-modal-kicker { color:var(--chat-cy-cyan); font:600 10px var(--font-mono); letter-spacing:.12em; }
.chat-page .credits-modal-close { border:0; background:transparent; color:var(--text-tertiary); font-size:20px; line-height:1; cursor:pointer; }
.chat-page .credits-modal-close:hover { color:var(--chat-cy-pink); }
.chat-page .credits-modal .credits-item { padding:7px 0; }
.chat-page .credits-modal .credits-label { font:10px var(--font-mono); letter-spacing:.08em; color:var(--text-tertiary); }
.chat-page .credits-modal .credits-value { color:var(--chat-cy-cyan); font:11px var(--font-mono); text-align:right; }
.chat-page #balance-short { font-family:var(--font-mono); }

@media (max-width:760px) {
  .chat-page .chat-status-bar { max-width:150px; overflow:hidden; white-space:nowrap; }
}