/* Keep the composer tray on the same surface as its input. */
body.dark-mode .main-content .input-tools,
body.dark-mode .main-content .input-toolbar {
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}

body.dark-mode .main-content .quick-model-trigger,
body.dark-mode .main-content .input-tools .tool-btn {
  background: transparent;
  border: 0;
  color: #d8d9e1;
  box-shadow: none;
}

body.dark-mode .main-content .quick-model-trigger:hover,
body.dark-mode .main-content .input-tools .tool-btn:hover {
  background: rgba(255, 255, 255, 0.07);
}

body.dark-mode .main-content .quick-model-trigger i {
  background: transparent;
  box-shadow: none;
}

#send-btn { color: #ffffff; }
#send-btn .submit-btn-icon { color: inherit; }
body.dark-mode #send-btn::after { display: none; }
body.dark-mode .main-content #send-btn {
  background: #f4f4f6;
  color: #202126;
  box-shadow: none;
}
body.dark-mode .main-content #send-btn:disabled {
  background: #484a54;
  color: #d5d6de;
}
body.dark-mode .main-content #send-btn.is-streaming {
  background: #f4f4f6;
  color: #202126;
}

#chat-container .welcome-home {
  width: 100%;
  max-width: 1120px;
  padding: clamp(20px, 4vh, 40px) 24px 24px;
  gap: 16px;
  overflow: visible;
  background: transparent;
  box-shadow: none;
  border: 0;
  font-family: 'Geist', 'Inter', sans-serif;
}

#chat-container .welcome-home::before { display: none; }
.welcome-home .welcome-hero { gap: 10px; }
#chat-container .welcome-home .welcome-title {
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.18;
  letter-spacing: -0.035em;
  font-weight: 500;
  background: none;
  color: var(--conversation-ink);
  -webkit-text-fill-color: currentColor;
  overflow-wrap: anywhere;
}

.welcome-home .welcome-hello {
  display: inline-block;
  padding: 0 0.12em 0.1em 0;
  font-family: 'Snell Roundhand', 'Apple Chancery', 'URW Chancery L', cursive;
  font-style: italic;
  font-weight: 500;
  letter-spacing: -0.035em;
  background: none;
  color: #249bd3;
  -webkit-text-fill-color: currentColor;
  animation: hello-write 1.5s cubic-bezier(.22,.61,.36,1) both;
}

body.dark-mode .welcome-home .welcome-hello {
  color: #87ceeb;
}

.welcome-home .welcome-person {
  font-family: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.025em;
  display: inline-block;
  animation: welcome-arrive 800ms 350ms both;
}

#chat-container .welcome-home .welcome-subtitle {
  font-size: clamp(14px, 1.5vw, 16px);
  line-height: 1.5;
  color: var(--conversation-muted);
  letter-spacing: -0.025em;
}

#chat-container .welcome-home .welcome-model-row {
  width: fit-content;
  max-width: 100%;
  padding: 0;
  margin-top: 8px;
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 12px;
  color: var(--conversation-muted);
}

.welcome-home .welcome-model-name {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid rgba(36, 155, 211, 0.3);
  border-radius: 10px;
}

body.dark-mode .welcome-home .welcome-model-name {
  border-color: rgba(135, 206, 235, 0.28);
}

.welcome-home .welcome-model-name::before {
  content: '';
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: #249bd3;
  clip-path: polygon(50% 0, 63% 37%, 100% 50%, 63% 63%, 50% 100%, 37% 63%, 0 50%, 37% 37%);
}

body.dark-mode .welcome-home .welcome-model-name::before {
  background: #87ceeb;
}

#chat-container .welcome-home .welcome-actions-label {
  margin-top: 14px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--conversation-muted);
}

#chat-container .welcome-home .welcome-actions {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

#chat-container .welcome-home .welcome-action {
  min-width: 0;
  min-height: 120px;
  padding: 16px;
  border: 0;
  border-radius: 16px;
  background: #f5f5f7;
  box-shadow: none;
  align-content: start;
  gap: 10px;
  cursor: pointer;
  transition: background 180ms, transform 180ms;
  animation: welcome-arrive 700ms 150ms backwards;
}

body.dark-mode #chat-container .welcome-home .welcome-action { background: #26272c; }
#chat-container .welcome-home .welcome-action:hover {
  background: #ededf1;
  transform: translateY(-3px);
}
body.dark-mode #chat-container .welcome-home .welcome-action:hover { background: #303137; }
.welcome-home .welcome-action-icon { color: #8184bc; font-size: 17px; margin-bottom: 3px; }
body.dark-mode .welcome-home .welcome-action-icon { color: #b1b8df; }
#chat-container .welcome-home .welcome-action-title { color: var(--conversation-ink); font-size: 14px; font-weight: 550; }
#chat-container .welcome-home .welcome-action-desc { color: var(--conversation-muted); line-height: 1.5; font-size: 12px; }
#chat-container .welcome-home .welcome-action:focus-visible { outline: 2px solid #929bc7; outline-offset: 4px; }

#chat-container .welcome-home .pro-upsell-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px 0;
  margin: 14px 0 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.welcome-home .pro-upsell-card h3 { color: var(--conversation-ink); font-size: 14px; font-weight: 500; }
.welcome-home .pro-upsell-card p { color: var(--conversation-muted); font-size: 12px; margin: 6px 0 0; }
#chat-container .welcome-home .pro-upsell-card .workspace-action-btn {
  flex-shrink: 0;
  background: var(--conversation-bubble);
  color: var(--conversation-ink);
  border: 0;
  box-shadow: none;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: 12px;
}

@keyframes hello-write {
  from { clip-path: inset(0 100% 0 0); transform: translateY(8px); opacity: 0; }
  20% { opacity: 1; }
  to { clip-path: inset(0 0 0 0); transform: translateY(0); opacity: 1; }
}
@keyframes welcome-arrive {
  from { opacity: 0; transform: translateY(10px); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@media (max-width: 1000px) {
  #chat-container .welcome-home .welcome-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  #chat-container .welcome-home { padding: 24px 0; gap: 18px; }
  #chat-container .welcome-home .welcome-actions { gap: 10px; }
  #chat-container .welcome-home .welcome-action { padding: 14px; min-height: 116px; }
  #chat-container .welcome-home .welcome-model-row { flex-wrap: wrap; gap: 6px; }
  #chat-container .welcome-home .pro-upsell-card { align-items: flex-start; flex-direction: column; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #chat-container .welcome-home,
  #chat-container .welcome-home * { animation: none; transition: none; }
}
