/* A quiet home screen; the conversation keeps its bottom-anchored composer. */
body.is-empty .app-shell {
  grid-template-rows: auto minmax(0, 1fr) auto minmax(0, 1.15fr);
}
body.is-empty .topbar { border-bottom-color: transparent; }
body.is-empty #brandButton { visibility: hidden; }
body.is-empty .page {
  display: flex;
  align-items: end;
  justify-content: center;
  padding: 24px 0 36px;
  scrollbar-gutter: auto;
}
.hero { min-height: 0; padding: 0; width: 100%; }
.hero-logo {
  display: block;
  width: clamp(200px, 23vw, 280px);
  max-width: 80%;
  height: auto;
  margin: 0 auto;
}
body.is-empty .composer-dock { border-top: 0; padding-top: 0; }
body.is-empty .memory-status[data-state="ready"],
body.is-empty .mobile-memory-toggle { display: none !important; }
.composer-wrap { width: min(760px, 100%); }
.composer {
  grid-template-columns: minmax(0, 1fr) 44px;
  gap: 10px 12px;
  padding: 14px 14px 12px 20px;
  border: 1px solid #dededb;
  border-radius: 22px;
  box-shadow: 0 4px 20px rgba(25, 25, 25, .045);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.composer:focus-within {
  border-color: #d49793;
  box-shadow: 0 4px 24px rgba(25, 25, 25, .05), 0 0 0 3px rgba(226, 35, 26, .045);
}
.composer textarea {
  grid-column: 1 / -1;
  grid-row: 1;
  min-height: 44px;
  padding: 8px 0;
  font-size: 16px;
  line-height: 1.65;
}
.composer textarea::placeholder { color: #81817e; }
.composer .answer-mode-select {
  grid-column: 1;
  grid-row: 2;
  justify-self: start;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid #ececea;
  border-radius: 12px;
  background: #f8f8f7;
  color: #52524f;
  font-size: 13px;
  cursor: pointer;
}
.composer .send-button {
  grid-column: 2;
  grid-row: 2;
  width: 44px;
  height: 44px;
  border-radius: 14px;
}
.composer-meta { padding-top: 10px; color: #777772; font-size: 11px; }
.composer-meta { display: none; }
.ephemeral-note { margin: 10px 4px 0; text-align: center; }
.topbar .ghost-button { font-size: 13px; }
.history-panel { background: #f8f8f6; }
.history-panel .side-panel-header,
.history-toolbar { background: transparent; border-bottom-color: transparent; }
.history-panel .side-panel-header { padding: 20px 18px 12px; }
.history-toolbar { padding: 8px 14px 14px; gap: 10px; }
.history-new {
  min-height: 44px;
  background: #fff;
  color: var(--ink);
  border-color: #e3e3df;
  font-weight: 600;
}
.history-new:hover { background: #eeeeea; }
.history-search { min-height: 40px; background: transparent; border-color: #e3e3df; }
.history-row { border-radius: 12px; }
.icon-button:focus-visible, .brand:focus-visible, .history-new:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 3px;
}
@media (max-width: 900px) {
  body.is-empty .app-shell {
    grid-template-rows: auto minmax(0, 1fr) auto minmax(0, 1.1fr);
  }
  body.is-empty .page { padding: 16px 12px 28px; }
  .hero { padding: 0; }
  .hero-logo { width: clamp(200px, 35vw, 260px); margin: 0 auto; }
  .composer-dock { padding-inline: 12px; }
  .composer { padding: 10px 10px 10px 14px; gap: 6px 8px; border-radius: 20px; }
  .composer .answer-mode-select { font-size: 16px; padding-inline: 6px; }
  .composer-meta { font-size: 10px; padding-top: 8px; }
  .ephemeral-note { font-size: 11px; }
  body.keyboard-open.is-empty .app-shell { grid-template-rows: auto minmax(0, 1fr) auto; }
  body.keyboard-open.is-empty .page { padding-block: 6px; }
  body.keyboard-open.is-empty .hero-logo { width: 144px; }
}
@media (max-height: 500px) {
  body.is-empty .app-shell { grid-template-rows: auto minmax(0, 1fr) auto; }
  body.is-empty .page { padding-block: 8px; }
  .hero-logo { display: block; width: 144px; }
  .composer { padding-block: 6px; gap: 2px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .composer, .send-button, .ghost-button, .hero, .side-panel { transition: none; }
}

/* One navigation drawer on every screen size. */
.sidebar-actions { display: grid; gap: 4px; padding: 12px; border-top: 1px solid var(--line); }
.sidebar-actions .ghost-button { min-height: 44px; text-align: left; font-size: 14px; }
.private-mode-help { margin: 6px 8px; color: var(--muted); font-size: 11px; line-height: 1.7; }
#historyClose { display: grid; min-width: 44px; min-height: 44px; font-size: 12px; }
#historyToggle { min-width: 44px; min-height: 44px; }
.context-clear-wrap[hidden] { display: none !important; }

/* Compact label outside; explanation only inside the keyboard-accessible picker. */
.mode-picker { grid-column: 1; grid-row: 2; position: relative; justify-self: start; min-width: 0; }
.mode-picker-trigger {
  display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px;
  border: 1px solid rgba(226, 35, 26, .16); border-radius: 12px;
  background: var(--red-soft); color: var(--red); font-size: 13px; font-weight: 750; cursor: pointer;
}
.mode-picker-trigger:hover { border-color: var(--red); }
.mode-picker-trigger:disabled { opacity: .5; cursor: wait; }
.mode-icon { flex-shrink: 0; }
.mode-chevron { margin-left: 3px; }
.mode-picker-options {
  position: absolute; bottom: calc(100% + 10px); left: 0; z-index: 60;
  width: min(340px, calc(100vw - 58px)); max-height: min(230px, 45dvh); overflow-y: auto;
  padding: 6px; border: 1px solid var(--line); border-radius: 16px; background: var(--white);
  box-shadow: 0 12px 36px #0002;
}
.mode-picker-options button {
  display: grid; gap: 5px; width: 100%; min-height: 64px; padding: 12px;
  border: 0; border-radius: 10px; background: transparent; color: var(--ink); cursor: pointer; text-align: left;
}
.mode-picker-options.opens-down { top: calc(100% + 10px); bottom: auto; }
.mode-picker-options button strong { color: var(--red); font-size: 13px; }
.mode-picker-options button span { color: var(--muted); font-size: 12px; line-height: 1.6; }
.mode-picker-options button[aria-selected="true"] { background: var(--red-soft); }
.mode-picker-trigger:focus-visible, .mode-picker-options button:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }

/* Unsaved conversations have a true dark surface, not an inverted page/image. */
body.ephemeral {
  --ink: #eeeef0; --muted: #b4b4bd; --subtle: #9595a0; --line: #34343b;
  --surface: #1a1a20; --white: #17171c; --red-soft: #321d20; --red-dark: #ff8279;
  background: #101014; color: var(--ink); color-scheme: dark;
}
body.ephemeral .app-shell, body.ephemeral .page { background: #101014; }
body.ephemeral .topbar, body.ephemeral .composer-dock { background: #101014; border-color: #292930; }
body.ephemeral.is-empty .topbar { border-bottom-color: transparent; }
body.ephemeral .side-panel { background: #17171c; }
body.ephemeral .composer { background: #1c1c23; border-color: #50505b; box-shadow: 0 8px 30px #0003; }
body.ephemeral .composer:focus-within { border-color: #a46668; }
body.ephemeral .composer textarea { color: #f3f3f5; }
body.ephemeral .composer textarea::placeholder { color: #a1a1ab; }
body.ephemeral .ghost-button, body.ephemeral .history-open, body.ephemeral .history-search { color: var(--ink); }
body.ephemeral .ghost-button:hover, body.ephemeral .history-row:hover, body.ephemeral .history-row.active { background: #27272f; }
body.ephemeral .history-new, body.ephemeral .history-search, body.ephemeral .icon-button { background: #222229; border-color: var(--line); color: var(--ink); }
body.ephemeral .history-new:hover { background: #303039; }
body.ephemeral .mode-picker-trigger, body.ephemeral .mode-picker-options strong { color: #ff8279; }
body.ephemeral .mode-picker-trigger { border-color: #63363a; }
body.ephemeral .mode-badge { background: #24242d; color: #d4d4dc; border-color: #50505b; }
body.ephemeral .context-clear-button { background: #291c20; border-color: #63363a; color: #ff8279; }
body.ephemeral .context-clear-help { background: #222229; color: #dddde4; border-color: #63363a; }
body.ephemeral :is(.memory-status, .dialog-box, .dialog-input, .tutorial-panel, .tutorial-demo,
  .ask-input, .ask-inline-form, .history-menu, .fast-wait-sources, .fast-wait-card, .follow-up-bubble,
  .source-card, .report-activity, .report-section, .report-toc button, .normal-workflow button, .turn-stop) {
  background: #202027; color: var(--ink); border-color: var(--line);
}
body.ephemeral .memory-status:is([data-state="required"], [data-state="error"]) { background: #331e24; border-color: #9c4d58; }
body.ephemeral .user-bubble { background: #2d2024; border-color: #583138; color: #eeeef0; }
body.ephemeral .answer-body { background-color: #202027; background-image: none; border-color: #49404a; color: #eeeef0; box-shadow: none; }
body.ephemeral .answer-body::before { background: #704a50; }
body.ephemeral .answer-note { background: transparent; border-color: var(--line); }
body.ephemeral :is(.answer-table-scroll, .answer-callout, .entity-legend, .abstain-card) { background: #272730; color: var(--ink); border-color: #45454f; }
body.ephemeral .answer-table thead th { background: #32323c; }
body.ephemeral .answer-table :is(th, td) { border-color: #45454f; }
body.ephemeral :is(.sources-label, .answer-followups-title, .answer-image figcaption, .abstain-card p) { color: var(--muted); }
body.ephemeral .entity--honeywell { color: #ff9a91; }
body.ephemeral :is(.fast-wait, .fast-wait-question, .fast-wait-note, .fast-wait-card p, .fast-wait-delay,
  .source-quote, .source-meta, .answer-note, .report-activity > summary, .report-activity .report-excerpt,
  .report-source small, .normal-workflow small) { color: var(--muted); }
body.ephemeral :is(.source-link, .fast-wait-card a, .report-activity h4, .scope-clock) { color: #ff9a91; }
body.ephemeral .fast-wait-steps li { background: #292930; color: var(--muted); }
body.ephemeral .fast-wait-steps [aria-current="step"] { background: #3b252a; color: #ffaca4; }
body.ephemeral .source-book { background: #29252a; box-shadow: 3px 4px 0 #38333a, 5px 7px 0 #222; }
body.ephemeral .source-paper { background: #26232a; color: var(--ink); }

/* First visit only: the genuine logo settles into the home position. */
.entrance { position: fixed; inset: 0; z-index: 110; background: #fff; display: grid; place-items: center; }
.entrance-logo { width: clamp(270px, 46vw, 520px); max-width: 85vw; height: auto; will-change: transform; }
.entrance-status { position: absolute; top: calc(50% + 90px); margin: 0; color: #868680; font-size: 12px; letter-spacing: .04em; }
.entrance-status span { display: inline-block; animation: entrance-pulse 1s ease-in-out infinite alternate; }
.entrance.is-settling { background: transparent; transition: background .5s; pointer-events: none; }
.entrance.is-settling .entrance-status { opacity: 0; transition: opacity .15s; }
body.is-entering .hero-logo { opacity: 0; }
body.is-entering .composer-dock { visibility: hidden; }
body.entrance-complete.is-empty .composer-dock { animation: entrance-input .35s ease-out both; }
@keyframes entrance-pulse { to { opacity: .25; } }
@keyframes entrance-input { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .entrance, .entrance-status, .entrance-status span, body.entrance-complete.is-empty .composer-dock { animation: none; transition: none; }
}