:root { --ink: var(--brand-ink); --muted: var(--brand-muted); --line: var(--brand-border); --paper: var(--brand-white); --soft: #f1f1ed; --gold: var(--brand-amber); --gold-dark: var(--brand-amber-ink); --gold-soft: #fff7df; --blue-soft: #f4f4f0; --focus: #8b6000; font-family: var(--font-ui); }
body { font-family: var(--font-ui); -webkit-font-smoothing: antialiased; }
.auth-brand { background: #f0f0e9; }
.auth-brand::after { display: none; }
.auth-code { background: #e8e8df; border-color: var(--line); color: #33342f; }
button, input, select, textarea { font-family: var(--font-ui); }
input, select, textarea { border-color: #898980; }
button, a { transition: background-color 160ms var(--ease-ui), border-color 160ms var(--ease-ui), color 160ms var(--ease-ui); }
.button.primary { background: #151515; color: white; border-color: #151515; font-weight: 550; }
.button.primary:hover { background: #30302c; border-color: #a06c00; }
.button:active, .icon-button:active { transform: translateY(1px); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.sidebar { background: #f3f3ef; border-color: var(--line); }
.sidebar-brand-row .brand { font-family: var(--font-ui); }
.brand-wordmark { display: block; width: 120px; height: 34px; object-fit: contain; }
.sidebar-brand-row .brand-wordmark { width: 115px; height: 33px; }
.mobile-brand .brand-wordmark { width: 88px; height: 28px; }
.conversation-item { min-height: 33px; font-size: 13px; font-weight: 400; color: #3f403d; }
.conversation-row { min-height: 33px; grid-template-columns: minmax(0,1fr) 26px; }
.conversation-menu-button { width: 24px; height: 28px; }
.conversation-label > span { line-height: 1.5; }
.conversation-row.active { background: #e8e8e0; }
.conversation-row.active .conversation-item { color: #161714; font-weight: 500; }
.primary-nav .nav-link, .sidebar-project { font-size: 13px; }
.primary-nav .nav-link img, .sidebar-project > img { width: 18px; height: 18px; flex: none; }
.sidebar-project { grid-template-columns: 18px minmax(0,1fr) auto; }
.unread-dot { background: #986600; }
.response-spinner { border-color: #dad6cb; border-top-color: #9a6500; }
.topbar { background: var(--paper); }
.chat-view { width: 100%; max-width: none; }
.chat-active .main-content { padding-inline: 24px; }
.chat-view:not(.chat-home) { grid-template-rows: minmax(0,1fr) auto auto; }
.chat-view:not(.chat-home) > .messages { grid-row: 1; }
.chat-view:not(.chat-home) > .credit-notice { grid-row: 2; }
.chat-view:not(.chat-home) > .composer { grid-row: 3; }
.chat-header { position: fixed; top: 0; left: calc(var(--sidebar) + 24px); right: 72px; height: 56px; min-height: 0; z-index: 55; background: transparent; gap: 16px; pointer-events: none; }
.chat-header > * { pointer-events: auto; }
.chat-header h1 { font-size: 14px; font-weight: 500; color: #33342f; line-height: 1.4; }
.chat-header > div:first-child { overflow: hidden; }
.chat-header .ghost-indicator { font-size: 10px; }
.chat-header .share-chat { flex: none; width: 32px; height: 32px; }
.messages { width: 100%; max-width: 100%; overflow-x: hidden; padding: 18px 8px 28px 0; }
.message { max-width: 100%; }
.message.assistant { width: 100%; font-size: 15px; line-height: 1.75; }
.message.user { background: #eeeee8; font-size: 14px; line-height: 1.65; }
.message .role { font-weight: 600; color: #64645e; font-size: 10px; }
.message-content, .thinking > div { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.message.assistant .message-content { overflow: visible; }
.message.assistant .message-content pre { width: 100%; max-width: 100%; min-width: 0; margin-inline: 0; overflow-x: auto; white-space: pre; overflow-wrap: normal; word-break: normal; background: #f4f4f0; border-color: var(--line); }
.message.assistant .message-content pre code { display: block; width: max-content; min-width: 100%; white-space: pre; overflow-wrap: normal; word-break: normal; }
.message.assistant .message-content pre code, .source-preview code { font-family: var(--font-code); font-size: 12px; line-height: 1.7; }
.message.assistant .message-content :not(pre) > code { font-family: var(--font-code); font-size: .86em; }
.markdown-table-scroll { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
.message-content img, .message-content video { max-width: 100%; height: auto; }
.thinking { font-size: 12px; }
.thinking summary { font-weight: 500; }
.composer { background: #fff; border-color: #d0d0c8; box-shadow: 0 3px 16px #19190908; }
.composer:focus-within { border-color: #a17a2d; box-shadow: 0 0 0 1px #e7d8b7; }
.composer textarea { font-size: 14px; }
.composer .send-button { background: #151515; }
.chat-home .empty-chat h2 { font-family: var(--font-ui); font-size: 30px; font-weight: 450; line-height: 1.35; }
.asset-chip { background: white; border-color: var(--line); color: #30312c; }
.asset-chip:hover { border-color: #a47b23; background: #fffdf7; }
.file-row, .workspace-project-row { transition: background-color 160ms var(--ease-ui); }
.file-row:hover, .workspace-project-row:hover { background: #f1f1eb; }
.project-folder { background: #f2f2ed; color: #696956; }
#rename-chat-input { min-height: 128px; font-size: 15px; line-height: 1.7; padding: 14px; }
#modal:not(.asset-preview-dialog) { width: min(640px, calc(100vw - 32px)); }
.modal-heading h2 { font-weight: 550; }
.modal-shell { border-radius: 8px; }
.funding-pill { background: #fff7e2; color: #684500; border-color: #e9d5a0; }
body.artifact-open .chat-view { width: 100%; margin: 0; }
body.artifact-open .chat-active .main-content { padding-right: calc(min(48vw, 720px) + 24px); }
.sidebar-collapsed .chat-header { left: 76px; }
body.artifact-open .chat-header { right: calc(min(48vw, 720px) + 24px); }
@media (max-width: 1000px) {
  .chat-active .main-content { padding-inline: 16px; }
  .chat-header { position: relative; inset: auto; height: 38px; min-height: 38px; padding: 0; z-index: 10; }
  .chat-view:not(.chat-home) { grid-template-rows: auto minmax(0,1fr) auto auto; }
  .chat-view:not(.chat-home) > .messages { grid-row: 2; }
  .chat-view:not(.chat-home) > .credit-notice { grid-row: 3; }
  .chat-view:not(.chat-home) > .composer { grid-row: 4; }
  body.artifact-open .chat-header { right: auto; }
  body.artifact-open .chat-active .main-content { padding-right: 16px; }
  .artifact-panel { width:100%; min-width:0; left:0; }
  .sidebar-collapsed .chat-header { left: auto; }
  .message.assistant { font-size: 14px; }
  .messages { padding-top: 14px; }
  .conversation-item, .conversation-row { min-height: 38px; }
  .conversation-menu-button { height: 34px; }
}
@media (max-width: 600px) { .chat-active .main-content { padding-inline: 12px; } .chat-home .empty-chat h2 { font-size: 25px; } }