/* Home layout only. The conversation composer and tea stall keep their own layout. */
body.home-input-first { --home-accent: #1f3a5c; --home-highlight: #2a63a4; --home-soft: #eaf1fa; --home-line: #bed0e6; }
body.home-input-first #welcomePanel { padding-bottom: 28px; }
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .hero-card.home-welcome {
  padding: 18px 2px 20px !important; margin: 0 !important; border: 0 !important;
  border-radius: 0 !important; background: none !important; box-shadow: none !important; min-height: 0 !important;
}
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .home-welcome::before { display: none !important; }
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .home-welcome .hero-layout { display: block !important; min-height: 0 !important; }
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .home-welcome :is(.welcome-art, .hero-badge, .hero-pill) { display: none !important; }
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .home-welcome h3 {
  max-width: none !important; margin: 0 0 8px !important; color: #172b46 !important;
  font-size: 32px !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 1.35 !important;
}
html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .home-welcome p {
  max-width: none !important; margin: 0 !important; color: #607188 !important; font-size: 18px !important; font-weight: 500 !important; line-height: 1.7 !important;
}
body.home-input-first #welcomePanel > .composer-wrap {
  position: static !important; inset: auto !important; width: 100% !important; max-width: none !important;
  margin: 0 0 15px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
}
body.home-input-first #welcomePanel .composer-card {
  margin: 0 !important; padding: 0 !important; max-width: none !important; border: 0 !important;
  background: transparent !important; box-shadow: none !important; overflow: visible !important;
}
body.home-input-first #welcomePanel .composer-input-shell {
  padding: 19px 20px 14px !important; border: 1px solid #c4d1e0 !important; border-radius: 16px !important;
  background: #fff !important; box-shadow: 0 3px 14px #1f3a5c06 !important; transition: border-color .16s, box-shadow .16s;
}
body.home-input-first #welcomePanel .composer-input-shell:focus-within {
  border-color: var(--home-highlight) !important; box-shadow: 0 0 0 3px #2a63a412, 0 4px 20px #1f3a5c08 !important;
}
body.home-input-first #welcomePanel #composerInput {
  min-height: 82px !important; padding: 0 !important; font-size: 16px !important; line-height: 24px !important;
  background: transparent !important; border: 0 !important; outline: none !important; box-shadow: none !important;
}
body.home-input-first #welcomePanel #composerInput::placeholder { color: #66788f; font: inherit !important; }
body.home-input-first #desktopReasoningControl,
body.home-input-first .composer-wrap #imageWorkbenchToggleBtn,
body.home-input-first #desktopSettingsReasoningControl { display: none !important; }
body.home-input-first .quick-panel { padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; overflow: visible !important; }
body.home-input-first .quick-panel > .quick-panel-head { display: none !important; }
body.home-input-first #quickCards { display: block !important; max-height: none !important; overflow: visible !important; }
body.home-input-first .home-instructions { display: flex; align-items: stretch; gap: 12px; min-width: 0; margin-bottom: 28px; }
body.home-input-first .home-instruction-scroll {
  display: flex; flex: 1 1 0; align-items: stretch; gap: 8px; min-width: 0;
  overflow-x: auto; overflow-y: hidden; padding: 2px 1px; overscroll-behavior-x: contain; scrollbar-width: none; cursor: grab; user-select: none;
}
body.home-input-first .home-instruction-scroll .quick-card-main { cursor: grab !important; }
body.home-input-first .home-instruction-scroll.is-dragging,
body.home-input-first .home-instruction-scroll.is-dragging * { cursor: grabbing !important; }
body.home-input-first .home-instruction-scroll::-webkit-scrollbar { display: none; width: 0; height: 0; }
body.home-input-first .home-instruction-add { flex: 0 0 auto; padding-block: 2px; padding-inline-start: 10px; box-shadow: -12px 0 12px -8px #f6f9fd; }
body.home-input-first #quickCards .home-instructions .quick-card {
  display: flex !important; flex-direction: row !important; flex: 0 0 auto !important; align-items: center !important; min-width: 0 !important; width: auto !important;
  min-height: 38px !important; height: 38px !important; padding: 0 !important; border: 1px solid #e0e6ef !important;
  border-radius: 10px !important; background: #fff !important; box-shadow: none !important; overflow: visible !important;
  transition: border-color .15s, background-color .15s;
}
body.home-input-first #quickCards .home-instructions .quick-card::before,
body.home-input-first #quickCards .home-instructions .quick-card::after { display: none !important; }
body.home-input-first #quickCards .home-instructions .quick-card-main {
  display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important;
  position: static !important; inset: auto !important; transform: none !important; margin: 0 !important; gap: 0 !important;
  width: auto !important; min-width: 0 !important; min-height: 36px !important; height: 36px !important; flex: 0 0 auto !important;
  padding: 0 13px !important; text-align: left !important; border-radius: 9px !important; background: none !important;
}
body.home-input-first #quickCards .home-instructions .quick-card-head { display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; white-space: nowrap; gap: 7px; }
body.home-input-first #quickCards .home-instructions strong {
  display: block; max-width: 17em; overflow: hidden; text-overflow: ellipsis;
  font-size: 14px !important; line-height: 22px !important; font-weight: 500 !important; color: #52647c !important;
}
html[dir="rtl"] .home-instruction-nav svg { transform: scaleX(-1); }
body.home-input-first #quickCards .home-instructions .quick-card-desc,
body.home-input-first #quickCards .home-instruction-scroll .quick-card-icon { display: none !important; }
body.home-input-first #quickCards .home-instruction-add .quick-card { background: var(--home-soft) !important; border-color: var(--home-line) !important; border-style: dashed !important; }
body.home-input-first #quickCards .home-instruction-add strong { color: var(--home-accent) !important; font-weight: 600 !important; }
body.home-input-first #quickCards .home-instruction-add .quick-card-icon { display: flex !important; width: 17px !important; height: 22px !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; transform: none !important; color: var(--home-highlight) !important; }
body.home-input-first #quickCards .home-instruction-add .quick-card-icon svg { width: 17px; height: 17px; }
body.home-input-first #quickCards .home-instructions .quick-card:hover { border-color: var(--home-line) !important; background: #f5f8fc !important; transform: none !important; }
body.home-input-first #quickCards .home-instructions .quick-card.is-selected,
body.home-input-first #quickCards .home-instructions .quick-card.is-selected:hover {
  border-color: var(--home-accent) !important; background: var(--home-accent) !important; box-shadow: none !important;
}
body.home-input-first #quickCards .home-instructions .quick-card.is-selected strong { color: #fff !important; font-weight: 600 !important; }
body.home-input-first #quickCards .home-instructions .quick-card-actions { position: static !important; inset: auto !important; transform: none !important; display: flex !important; align-items: center; padding-right: 3px; gap: 0; }
body.home-input-first #quickCards .home-instructions .quick-card-custom .quick-card-main { padding-right: 7px !important; }
body.home-input-first #quickCards .home-command-more {
  display: grid; place-items: center; width: 30px; height: 30px; margin: 0; padding: 0;
  border: 0; border-radius: 7px; background: transparent; color: #7c8ba0; font-size: 22px; line-height: 1; cursor: pointer;
}
body.home-input-first #quickCards .home-command-more:hover,
body.home-input-first #quickCards .home-command-more[aria-expanded="true"] { color: var(--home-accent); background: #dce7f4; }
body.home-input-first #quickCards .home-command-more svg { display: block; width: 16px; height: 16px; }
body.home-input-first #quickCards .is-selected .home-command-more { color: #e5edf8; }
body.home-input-first #quickCards .is-selected .home-command-more:is(:hover, [aria-expanded="true"]) { color: #fff; background: #ffffff24; }
body.home-input-first #quickCards .home-instructions .quick-card,
body.home-input-first #quickCards .home-instructions .quick-card:focus-within { outline: none !important; box-shadow: none !important; }
body.home-input-first #quickCards .home-instructions .quick-card-main { outline: none !important; box-shadow: none !important; }
body.home-input-first #quickCards .home-instructions .quick-card-main:focus-visible { outline: 2px solid var(--home-highlight) !important; outline-offset: -3px !important; }
body.home-input-first #quickCards .home-instructions .is-selected .quick-card-main:focus-visible { outline-color: #c4d7ee !important; }
body.home-input-first .home-command-menu.is-open {
  display: grid !important; position: fixed !important; inset: auto; margin: 0 !important; padding: 5px !important;
  min-width: 150px; border: 1px solid #dce4ee; border-radius: 12px; background: white;
  box-shadow: 0 8px 30px #1f3a5c24 !important; overflow: visible; z-index: 1000;
  justify-content: stretch !important; align-items: stretch !important; gap: 2px !important; transform: none !important;
}
body.home-input-first #quickCards .home-command-menu button {
  display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; width: 100% !important; height: 40px !important;
  min-width: 0 !important; min-height: 40px !important; padding: 8px 12px !important; border: 0 !important; border-radius: 7px !important; background: white !important; color: #354b65 !important; font-size: 14px !important; cursor: pointer;
}
body.home-input-first #quickCards .home-command-menu .message-action-icon { display: flex; width: 16px; height: 16px; }
body.home-input-first #quickCards .home-command-menu .message-action-icon svg { width: 16px; height: 16px; }
body.home-input-first #quickCards .home-command-menu button:is(:hover, :focus, :active) { transform: none !important; }
body.home-input-first #quickCards .home-command-menu button:hover { background: var(--home-soft) !important; }
body.home-input-first #quickCards .home-command-menu .quick-card-delete { color: #b34b51 !important; }
body.home-input-first #quickCards .home-command-menu .quick-card-delete:hover { background: #fdf0f0 !important; }
body.home-input-first #quickCards :is(.home-command-more, .home-command-menu button, .home-instructions .quick-card-main):focus-visible {
  outline: 2px solid var(--home-highlight); outline-offset: -2px; box-shadow: none;
}
body.home-input-first .home-feature-panel {
  padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
body.home-input-first .home-feature-heading { margin-bottom: 14px; font-size: 18px; line-height: 26px; font-weight: 700; color: #263d59; }
/* Cap the grid at four rows; new feature cards naturally scroll within it. */
body.home-input-first #quickCards .home-feature-cards {
  --feature-row-height: 84px; --feature-row-gap: 10px;
  grid-auto-rows: var(--feature-row-height); row-gap: var(--feature-row-gap);
  max-height: calc(var(--feature-row-height) * 4 + var(--feature-row-gap) * 3 + 4px) !important;
  overflow-y: auto !important; overflow-x: hidden !important; overscroll-behavior-y: contain;
  scrollbar-width: thin; scrollbar-color: #c0cede transparent;
}
@media (max-width: 1050px) {
  body.home-input-first #quickCards .home-feature-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Keep the 84px cards and their decoration; give the two description lines room. */
body.home-input-first #quickCards .home-feature-cards .quick-card { padding: 6px 16px !important; }
body.home-input-first #quickCards .home-feature-cards .quick-card-main { position: static !important; justify-content: center !important; gap: 2px !important; }
body.home-input-first #quickCards .home-feature-cards .quick-card-head { align-items: center !important; min-height: 30px !important; margin: 0 !important; }
body.home-input-first #quickCards .home-feature-cards .quick-card-desc {
  margin: 0 !important; font-size: 13px !important; line-height: 1.4 !important;
  min-height: 36.4px !important; max-height: 36.4px !important;
}
body.home-input-first .home-instruction-viewport { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; }
body.home-input-first .home-instruction-viewport .home-instruction-scroll { width: 100%; }
body.home-input-first .home-instruction-nav {
  position: absolute; z-index: 2; top: 5px; display: grid; place-items: center; width: 28px; height: 32px;
  padding: 0; border: 1px solid #d5e0ee; border-radius: 8px; background: #f8fbff; color: #52647c; cursor: pointer;
  box-shadow: 0 0 10px 7px #f6f9fd;
}
body.home-input-first .home-instruction-nav[data-scroll-direction="-1"] { left: 1px; }
body.home-input-first .home-instruction-nav[data-scroll-direction="1"] { right: 1px; }
html[dir="rtl"] body.home-input-first .home-instruction-nav[data-scroll-direction="-1"] { right: 1px; left: auto; }
html[dir="rtl"] body.home-input-first .home-instruction-nav[data-scroll-direction="1"] { left: 1px; right: auto; }
body.home-input-first .home-instruction-nav[hidden] { display: none; }
body.home-input-first .home-instruction-nav svg { width: 16px; height: 16px; }
body.home-input-first .home-instruction-nav:hover { color: #1f3a5c; background: #eaf1fa; }
body.home-input-first .home-speech-collapse { margin-left: auto; padding: 3px 9px; border: 0; border-radius: 6px; background: #eaf1fa; color: #2a63a4; font-size: 12px; cursor: pointer; }

@media (max-height: 850px) {
  html:not(.ai-local-tea-stall) body.home-input-first #welcomePanel .hero-card.home-welcome { padding-top: 6px !important; padding-bottom: 12px !important; }
  body.home-input-first .home-instructions { margin-bottom: 16px; }
}

/* A new draft is already usable; do not replace its heading with a restore line. */
html.akai-restoring-draft:not(.ai-local-tea-stall) body.home-input-first .header-copy h2 { font-size: 24px !important; }
html.akai-restoring-draft:not(.ai-local-tea-stall) body.home-input-first .header-copy h2::after { display: none !important; content: none !important; }

/* Show a conversation-shaped placeholder while a saved thread is restored. */
body.home-input-first .thread-loading-state:not(.error) {
  width: 100%; max-width: 900px; min-width: 0; align-self: stretch; margin: 0 auto; padding: 12px 16px;
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
  color: #64748b; text-align: left; font-size: 13px; font-weight: 400;
}
html.akai-restoring-thread:not(.ai-local-tea-stall) body.home-input-first.app-restoring .workspace-scroll::before,
body.home-input-first .thread-loading-state:not(.error)::before {
  content: ""; display: block; width: 100%; max-width: 900px; height: 150px; margin: 20px auto;
  border-radius: 12px;
  background: linear-gradient(#e4ebf5, #e4ebf5) right top / 38% 38px no-repeat,
    linear-gradient(#e4ebf5, #e4ebf5) left 68px / 70% 18px no-repeat,
    linear-gradient(#e4ebf5, #e4ebf5) left 100px / 58% 18px no-repeat,
    linear-gradient(#e4ebf5, #e4ebf5) left 132px / 40% 18px no-repeat;
}