:root {
  --bg: #0b1020;
  --panel: #121a33;
  --text: #e6ecff;
  --muted: #a8b3cf;
  --accent: #6aa0ff;
  --ok: #4ade80;
  --bad: #fb7185;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica Neue, Arial, "Apple Color Emoji", "Segoe UI Emoji"; color: var(--text); background: radial-gradient(1200px 800px at 10% 0%, #111b38, #0b1020); }
.container { max-width: 900px; margin: 0 auto; padding: 24px; display: flex; flex-direction: column; gap: 16px; }
header h1 { margin: 0 0 6px 0; font-size: 28px; }
header p { margin: 0; color: var(--muted); }
.session { display: flex; gap: 8px; align-items: center; }
.session input { flex: 1; padding: 10px 12px; border-radius: 10px; border: 1px solid #273055; background: #0f1530; color: var(--text); }
.session button { padding: 10px 12px; border-radius: 10px; background: var(--accent); border: none; color: white; cursor: pointer; }
.status { color: var(--muted); font-size: 14px; }
.controls { display: flex; gap: 8px; }
.controls button { padding: 8px 12px; border-radius: 10px; background: #1a2448; border: 1px solid #273055; color: var(--text); cursor: pointer; }
.messages { background: rgba(9, 14, 35, 0.6); border: 1px solid #273055; border-radius: 14px; min-height: 300px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.bubble { padding: 10px 12px; border-radius: 12px; max-width: 75%; white-space: pre-wrap; }
.bubble.user { align-self: flex-end; background: #2b355f; border: 1px solid #36407a; }
.bubble.bot { align-self: flex-start; background: #15204a; border: 1px solid #273055; }
.bubble .meta { font-size: 12px; color: var(--muted); margin-top: 6px; }
.composer { display: flex; gap: 8px; }
.composer input { flex: 1; padding: 10px 12px; border-radius: 10px; border: 1px solid #273055; background: #0f1530; color: var(--text); }
.composer button { padding: 10px 12px; border-radius: 10px; background: var(--accent); border: none; color: white; cursor: pointer; }
button:disabled, input:disabled { opacity: 0.6; cursor: not-allowed; }


