/* Identical brand assets and palette to the company's existing website. */
:root {
  --ink: #1a1c1e;
  --ink-soft: #3c3a35;
  --muted: #4a4a46;
  --paper: #f4f5f7;
  --paper-2: #e8e9ec;
  --card: #ffffff;
  --line: #d5d6da;
  --accent: #8c4e31;
  --accent-hover: #6e3d26;
  --green: var(--accent);
  --sans: "Source Sans 3", "Segoe UI", sans-serif;
  --serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
}
body, button, input, textarea, select { font-family: var(--sans); }
body { color: var(--ink); background: var(--paper); }
.topbar { background: var(--card); border-color: var(--line); }
.brand { display: flex; align-items: center; letter-spacing: normal; color: var(--ink); }
.brand-logo { display: block; width: 200px; height: auto; max-height: 66px; }
.live-status, .file-info, .live-info, .model-progress { color: var(--ink-soft); }
.live-scene { background: var(--paper-2); }
.message-label { color: var(--muted); }
.message.user { background: var(--paper-2); color: var(--ink); }
.assistant .message-label::before {
  content: "";
  background: transparent url("./assets/logo/logo-symbol.svg") center / contain no-repeat;
  border: 0;
  border-radius: 0;
  font-size: 0;
}
.primary-button, #live-send {
  color: #ffffff;
  background: var(--accent);
  border-color: var(--accent);
}
.primary-button:hover:not(:disabled), #live-send:hover:not(:disabled) {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}
.secondary-button, #live-add-file {
  color: var(--ink);
  background: var(--card);
  border: 1px solid var(--line);
}
.secondary-button:hover:not(:disabled), #live-add-file:hover:not(:disabled) {
  background: var(--paper-2);
}
textarea, input, select { color: var(--ink); border-color: var(--line); accent-color: var(--accent); }
.progress-ring, .conversation-thinking p::before { border-top-color: var(--accent); }
.conversation-thinking p { color: var(--muted); }
@media (max-width: 800px) { .brand-logo { width: 170px; max-height: 56px; } }
