/* The supplied VisuAI stays expressive while the conversation frame stays still. */
.aura[aria-hidden=true] { pointer-events: none; }
.aura > visuai-energy:focus-visible { outline: 2px solid var(--blue); outline-offset: -18px; border-radius: 50%; }
.aura-launcher { padding: 8px 19px 8px 10px; gap: 4px; min-height: 58px; }
.aura-launcher > .aura { width: 76px; height: 76px; margin: -16px -5px -16px -12px; }
.aura-launcher > span:last-child { display: grid; gap: 3px; text-align: left; }
.aura-launcher strong { font-weight: 600; font-size: .875rem; line-height: 1.4; }
.aura-launcher small { color: var(--muted); font-size: .6875rem; line-height: 1.4; }
.visuai-word-panel { align-items: center; text-align: center; padding: 34px; }
.visuai-word-panel > .aura { width: 270px; height: 270px; margin: -25px 0 -40px; }
.visuai-word-panel > strong { font-size: 3.25rem; margin: 4px 0 15px; }
.visuai-word-panel > p { font-size: 1rem; }
.planner-aura-guide { display: flex; align-items: center; gap: 5px; margin: 12px -8px 10px -15px; }
.planner-aura-guide > .aura { width: 100px; height: 100px; margin: -13px -7px -13px 0; }
.planner-aura-guide > div { min-width: 0; }
.planner-aura-guide strong { display: block; font-size: .8125rem; line-height: 1.6; font-weight: 600; }
.planner-aura-guide span:not(.aura) { display: block; font-size: .75rem; line-height: 1.7; color: var(--muted); margin-top: 5px; }

html[data-education-chat=true], html[data-education-chat=true] body { overflow: hidden; overscroll-behavior: none; }
.app-shell.assistant-active {
  position: fixed;
  inset: var(--education-chat-top, 0px) 0 auto;
  height: var(--education-chat-height, 100dvh);
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.assistant-active .site-header { position: relative; top: 0; flex: 0 0 auto; }
.assistant-active .main-shell { flex: 1 1 0; min-height: 0; display: flex; overflow: hidden; }
.assistant-active .chat-main { width: 100%; height: 100%; min-height: 0; max-width: 1200px; padding: 20px 26px; display: flex; flex-direction: column; animation: none; }
.assistant-active .assistant-page {
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  padding: 0 27px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border-radius: 26px;
}
.assistant-active .assistant-heading { display: grid; grid-template-columns: 32px 86px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 96px; padding: 8px 0; }
.assistant-heading .chat-back { min-width: 32px; min-height: 36px; width: 32px; padding: 6px; }
.assistant-active .assistant-heading > .aura { width: 86px; height: 86px; margin: -11px 0; }
.assistant-title { min-width: 0; }
.assistant-active .assistant-heading h1 { font-size: 1.3rem; font-weight: 550; line-height: 1.3; letter-spacing: -.04em; }
.assistant-active .assistant-heading p { height: 1.65em; line-height: 1.65; font-size: .75rem; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.assistant-tools { display: flex; align-items: center; gap: 8px; }
.assistant-tools .secondary-button { padding: 10px 12px; font-size: .75rem; min-height: 40px; border-radius: 12px; background: var(--surface); gap: 7px; }
.assistant-active .chat-thread {
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 22px 9px 20px;
  overscroll-behavior: contain;
  overflow-anchor: none;
  scrollbar-gutter: stable;
  scroll-behavior: auto;
}
.assistant-active .chat-thread:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; border-radius: 10px; }
.assistant-active .assistant-planning-link { margin: 0 0 22px; padding: 15px 18px; gap: 15px; flex-direction: row; align-items: center; }
.assistant-planning-link > div { display: grid; gap: 4px; }
.assistant-planning-link strong { font-size: .8125rem; font-weight: 600; }
.assistant-planning-link span { font-size: .75rem; }
.assistant-planning-link .text-button { display: flex; align-items: center; gap: 7px; font-size: .75rem; flex-shrink: 0; }
.assistant-active .chat-welcome { height: auto; min-height: 100%; padding: 0 12px 18px; justify-content: center; }
.assistant-active .chat-welcome > .aura { width: 220px; height: 220px; flex-shrink: 0; margin: -38px 0 -37px; }
.assistant-active .chat-welcome h2 { max-width: 580px; font-size: clamp(1.65rem, 2.9vw, 2.2rem); font-weight: 500; line-height: 1.18; }
.assistant-active .chat-welcome > p { font-size: .9375rem; line-height: 1.75; margin: 15px 0 23px; }
.assistant-active .chat-welcome > small { color: var(--muted); font-size: .6875rem; line-height: 1.6; margin-top: 19px; }
.assistant-active .starter-prompts { gap: 10px; max-width: 620px; }
.assistant-active .starter-prompts > button { padding: 14px 15px; font-size: .8125rem; gap: 10px; min-height: 52px; }
.starter-prompts > button > svg:last-child { margin-left: auto; }
.chat-opening-status { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; height: 100%; min-height: 110px; font-size: .875rem; }
.assistant-active .chat-message { gap: 12px; margin: 9px 0 27px; animation: none; }
.assistant-message-mark { display: grid; place-items: center; width: 29px; height: 29px; flex-shrink: 0; margin-top: 6px; border: 1px solid #678fff40; border-radius: 10px; background: var(--pale); color: var(--primary); font-size: .75rem; font-weight: 600; }
.assistant-active .chat-message.assistant > div { max-width: calc(100% - 43px); }
.assistant-active .chat-message.user > div { max-width: 82%; }
.assistant-active .chat-message > div { font-size: .9375rem; line-height: 1.9; }
.assistant-active .chat-recommendations { margin: 8px 0 20px 41px; }
.assistant-active .quick-replies { margin: 14px 0 0 41px; padding-bottom: 4px; gap: 8px; }
.assistant-active .quick-replies button { padding: 9px 13px; text-align: left; font-size: .75rem; }
.chat-error { margin: 16px 0; }
.assistant-active .chat-compose { padding: 13px 0 max(14px, env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: transparent; }
.assistant-active .chat-compose form { min-height: 70px; padding: 8px 11px; border-radius: 19px; align-items: center; gap: 10px; }
.assistant-active .chat-compose textarea { height: 52px; min-height: 52px; max-height: 52px; overflow-y: auto; flex: 1 1 0; min-width: 0; padding: 13px 8px; line-height: 1.6; }
.assistant-active .chat-compose > p { margin-top: 8px; font-size: .6875rem; line-height: 1.5; }
.assistant-active .chat-compose .send-button { flex-shrink: 0; }
.assistant-active .modal { max-height: calc(var(--education-chat-height, 100dvh) - 36px); }
.chat-context-form { display: grid; gap: 19px; padding-top: 22px; }
.chat-context-form > .primary-button { justify-self: start; }

@media (max-width: 1000px) {
  .assistant-active .assistant-heading { grid-template-columns: 32px 78px minmax(0, 1fr); gap: 0 7px; padding: 5px 0 12px; }
  .assistant-active .assistant-heading > .aura { width: 78px; height: 78px; margin: -5px 0; }
  .assistant-tools { grid-column: 1/-1; justify-content: flex-end; gap: 9px; }
  .assistant-tools .secondary-button { min-height: 36px; padding: 8px 11px; }
  .assistant-active .chat-welcome > .aura { width: 180px; height: 180px; margin-block: -25px -33px; }
}
@media (max-width: 700px) {
  .assistant-active .chat-main { padding: 12px 10px 10px; }
  .assistant-active .assistant-page { padding: 0 16px; border-radius: 21px; }
  .assistant-active .assistant-heading { grid-template-columns: 29px 60px minmax(0, 1fr); min-height: 0; gap: 0 5px; padding-bottom: 10px; }
  .assistant-active .assistant-heading > .aura { width: 70px; height: 70px; margin: -5px -5px; }
  .assistant-active .assistant-heading h1 { font-size: 1.05rem; }
  .assistant-active .assistant-heading p { font-size: .625rem; margin-top: 5px; }
  .assistant-tools { justify-content: stretch; gap: 8px; }
  .assistant-tools .secondary-button { flex: 1; font-size: .6875rem; min-height: 35px; padding: 8px 7px; }
  .assistant-tools .secondary-button svg { width: 15px; height: 15px; }
  .assistant-active .chat-thread { padding: 15px 1px 17px; }
  .assistant-active .chat-welcome { padding: 0 2px 16px; }
  .assistant-active .chat-welcome > .aura { width: 160px; height: 160px; margin: -26px 0 -26px; }
  .assistant-active .chat-welcome h2 { font-size: 1.6rem; max-width: 350px; }
  .assistant-active .chat-welcome > p { font-size: .8125rem; line-height: 1.75; margin: 12px 0 19px; }
  .assistant-active .chat-welcome > p br { display: none; }
  .assistant-active .starter-prompts { gap: 8px; }
  .assistant-active .starter-prompts > button { font-size: .6875rem; line-height: 1.6; padding: 11px 10px; gap: 7px; }
  .starter-prompts > button > svg { width: 14px; height: 14px; }
  .starter-prompts > button > svg:last-child { display: none; }
  .assistant-active .chat-welcome > small { font-size: .625rem; margin-top: 16px; }
  .assistant-active .assistant-planning-link { flex-direction: column; align-items: flex-start; gap: 8px; padding: 13px; }
  .assistant-active .chat-message { gap: 9px; margin-bottom: 23px; }
  .assistant-active .chat-message > div { font-size: .9375rem; }
  .assistant-message-mark { width: 25px; height: 25px; border-radius: 9px; font-size: .6875rem; }
  .assistant-active .chat-message.assistant > div { max-width: calc(100% - 34px); }
  .assistant-active .chat-message.user > div { max-width: 86%; padding: 12px 15px; }
  .assistant-active .chat-recommendations, .assistant-active .quick-replies { margin-left: 0; }
  .assistant-active .quick-replies button { font-size: .6875rem; }
  .assistant-active .chat-compose { padding-top: 10px; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .assistant-active .chat-compose form { min-height: 61px; padding: 5px 8px; gap: 5px; border-radius: 17px; }
  .assistant-active .chat-compose textarea { height: 49px; min-height: 49px; max-height: 49px; font-size: 1rem; padding: 11px 5px; }
  .assistant-active .chat-compose > p { font-size: .5625rem; margin-top: 6px; }
  .aura-launcher { min-height: 55px; padding-right: 15px; }
  .aura-launcher > .aura { width: 69px; height: 69px; margin: -15px -5px -15px -9px; }
  .visuai-word-panel > .aura { width: 250px; height: 250px; margin-top: -25px; }
  .visuai-word-panel > strong { font-size: 2.8rem; }
}
/* Recover space when a mobile keyboard or a short landscape viewport is present. */
[data-education-chat-compact=true] .assistant-active .site-header { display: none; }
[data-education-chat-compact=true] .assistant-active .chat-main { padding: 4px; }
[data-education-chat-compact=true] .assistant-active .assistant-page { border-radius: 14px; }
[data-education-chat-compact=true] .assistant-active .assistant-heading { grid-template-columns: 29px 52px minmax(0, 1fr) auto; padding: 3px 0; min-height: 54px; }
[data-education-chat-compact=true] .assistant-heading > .aura { width: 60px; height: 60px; margin: -8px -4px; }
[data-education-chat-compact=true] .assistant-title h1 { font-size: .9375rem; }
[data-education-chat-compact=true] .assistant-title p { display: none; }
[data-education-chat-compact=true] .assistant-tools { grid-column: auto; gap: 4px; }
[data-education-chat-compact=true] .assistant-tools span { display: none; }
[data-education-chat-compact=true] .assistant-tools .secondary-button { padding: 7px; min-width: 31px; min-height: 31px; }
[data-education-chat-compact=true] .assistant-active .chat-compose { padding-block: 5px; }
[data-education-chat-compact=true] .chat-compose > p { display: none; }
