/* NC-AI public Aya. Layout belongs only to these scoped components. */
.ncai-aya-conversation {
  width: min(1100px, calc(100% - 36px));
  min-height: calc(100svh - 88px);
  margin: 0 auto;
  padding: clamp(32px, 6vh, 68px) 0 42px;
  display: grid;
  grid-template-columns: minmax(180px, 250px) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px);
}
.ncai-aya-persona {
  position: sticky;
  top: 120px;
  align-self: start;
  /* Blend the sticky layer itself; its children cannot blend outside it. */
  mix-blend-mode: multiply;
}
.ncai-aya-surface {
  width: 100%;
  max-width: 280px;
  margin: 0 auto;
  text-align: center;
}
.ncai-aya-dialogue {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding-top: 20px;
}
.ncai-aya-surface #ayaMount { display: none; }
.ncai-aya-surface.is-ready #ayaMount { display: block; }
.ncai-aya-surface.is-ready .ncai-aya-poster { display: none; }
.ncai-aya-poster-art {
  width: 64%;
  aspect-ratio: 621 / 1024;
  margin: 22px auto 0;
  overflow: hidden;
}
.ncai-aya-poster-art img {
  display: block;
  width: 247.343%;
  max-width: none;
  height: auto;
  transform: translateX(-59.5703125%);
}
.ncai-aya-poster-name { margin-top: 12px; font-size: 20px; font-weight: 500; }
.ncai-aya-poster p { margin: 4px 0 20px; color: var(--muted); font-size: 14px; }
.ncai-aya-surface .nc-aya-agent { width: 100%; text-align: center; color: var(--ink); }
.ncai-aya-surface .nc-aya-character {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ncai-aya-surface .nc-aya-character:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; }
.ncai-aya-surface .nc-aya-canvas { display: block; width: 100%; height: auto; aspect-ratio: 1; }
.ncai-aya-surface .nc-aya-name { margin-top: 4px; font-size: 20px; font-weight: 500; }
.ncai-aya-surface .nc-aya-role { color: var(--muted); font-size: 14px; }
.ncai-aya-surface .nc-aya-status { min-height: 42px; margin: 10px 8px 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
/* Keep the approved wider layout; mobile uses its original composer spacing. */
@media (min-width: 761px) {
  .ncai-aya-dialogue .composer {
    bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    margin-bottom: 64px;
  }
  .ncai-aya-dialogue .message {
    scroll-margin-block-end: calc(184px + env(safe-area-inset-bottom, 0px));
  }
}
@media (max-width: 760px) {
  .ncai-aya-conversation {
    min-height: calc(100svh - 96px);
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    gap: 12px;
    padding-top: 12px;
  }
  .ncai-aya-persona { position: static; }
  .ncai-aya-surface { max-width: 186px; }
  .ncai-aya-dialogue { padding-top: 0; }
  .ncai-aya-surface .nc-aya-status { min-height: 21px; margin: 6px -20px 0; font-size: 13px; }
}
