/* Final visual layer for Ask Ash. Keeps the chat as the working surface and
   lets the two rails read as compact supporting context. */
.live-member .ash-host.ash-chat-first .cp-root {
  gap: 14px !important;
  min-height: calc(100vh - 166px) !important;
}

.live-member .ash-host.ash-chat-first .cp-top {
  align-items: center !important;
  gap: 14px !important;
  padding: 0 2px !important;
}

.live-member .ash-host.ash-chat-first .cp-brand img {
  border: 1px solid color-mix(in srgb, var(--accent) 54%, var(--border)) !important;
  box-shadow: 0 5px 16px color-mix(in srgb, var(--accent) 13%, transparent) !important;
}

.live-member .ash-host.ash-chat-first .cp-brand h2 {
  font-size: clamp(22px, 2vw, 28px) !important;
}

.live-member .ash-host.ash-chat-first .cp-top-copy {
  max-width: 38ch !important;
  font-size: 13px !important;
}

.live-member .ash-host.ash-chat-first .cp-grid {
  grid-template-columns: minmax(220px, .62fr) minmax(0, 2.42fr) minmax(270px, .8fr) !important;
  gap: 14px !important;
  height: max(580px, calc(100svh - 292px)) !important;
  flex:none !important;
  grid-template-rows:minmax(0,1fr) !important;
  min-height: 0 !important;
}

.live-member .ash-host.ash-chat-first .cp-channels,
.live-member .ash-host.ash-chat-first .cp-state,
.live-member .ash-host.ash-chat-first .cp-chat {
  min-height:0 !important;
  border: 1px solid color-mix(in srgb, var(--border) 92%, var(--accent) 8%) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 28px rgba(45, 34, 82, .055) !important;
}

.live-member .ash-host.ash-chat-first .cp-channels,
.live-member .ash-host.ash-chat-first .cp-state {
  background: linear-gradient(180deg, color-mix(in srgb, var(--card1) 97%, var(--accent) 3%), var(--card2)) !important;
}

.live-member .ash-host.ash-chat-first .cp-chat {
  padding: clamp(18px, 2vw, 26px) !important;
  border-color: color-mix(in srgb, var(--accent) 36%, var(--border)) !important;
  background:
    radial-gradient(circle at 86% -18%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 36%),
    linear-gradient(180deg, var(--card1), color-mix(in srgb, var(--card2) 84%, var(--accent) 4%)) !important;
  box-shadow: 0 14px 34px rgba(57, 26, 116, .09) !important;
}

.live-member .ash-host.ash-chat-first .cp-channels .cp-drawer-content,
.live-member .ash-host.ash-chat-first .cp-state .cp-drawer-content {
  padding: 16px !important;
}

.live-member .ash-host.ash-chat-first .cp-section-head {
  align-items: center !important;
  gap: 10px !important;
}

.live-member .ash-host.ash-chat-first #cp-new {
  min-height: 44px !important;
  padding: 8px 10px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
}

.live-member .ash-host.ash-chat-first .cp-list {
  margin-top: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-channel {
  min-height: 56px !important;
  padding: 9px 10px !important;
  border-radius: 9px !important;
}

.live-member .ash-host.ash-chat-first .cp-channel[aria-current="true"] {
  box-shadow: inset 2px 0 0 var(--accent) !important;
}

.live-member .ash-host.ash-chat-first .cp-channel-name {
  font-size: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-watches-mini {
  padding-top: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-watch-row {
  min-height: 44px !important;
  border-radius: 8px !important;
}

.live-member .ash-host.ash-chat-first .cp-chat-top {
  gap: 12px !important;
  padding-bottom: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-chat-top h3 {
  font-size: clamp(19px, 1.8vw, 24px) !important;
}

.live-member .ash-host.ash-chat-first .cp-chat-actions button {
  min-height: 44px !important;
  border-color: var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.live-member .ash-host.ash-chat-first .cp-messages {
  flex:1 1 auto !important;
  min-height: 120px !important;
  overflow-y:auto !important;
  padding: 16px 2px 18px !important;
}

.live-member .ash-host.ash-chat-first .cp-messages .ash-message {
  max-width: min(84%, 640px) !important;
  padding: 12px 14px !important;
  border-radius: 7px 15px 15px 15px !important;
  box-shadow: 0 4px 13px rgba(29, 23, 53, .035) !important;
}

.live-member .ash-host.ash-chat-first .cp-messages .ash-message.ash-user {
  border-radius: 15px 7px 15px 15px !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--accent) 14%, transparent) !important;
}

.live-member .ash-host.ash-chat-first .cp-composer {
  flex:0 0 auto !important;
  padding: 10px 12px !important;
  border-color: color-mix(in srgb, var(--accent) 31%, var(--border)) !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--well) 92%, var(--accent) 3%) !important;
}

.live-member .ash-host.ash-chat-first #cp-input {
  min-height: 92px !important;
  padding: 10px 11px !important;
}

.live-member .ash-host.ash-chat-first #cp-send {
  min-width: 92px !important;
  min-height: 44px !important;
  border-radius: 9px !important;
}

.live-member .ash-host.ash-chat-first .cp-insights {
  margin-bottom: 12px !important;
}

.live-member .ash-host.ash-chat-first .ash-insights {
  gap: 9px !important;
}

.live-member .ash-host.ash-chat-first .ash-insights-section {
  padding: 12px 0 !important;
  border:0 !important;
  border-bottom:1px solid var(--border) !important;
  border-radius:0 !important;
  background:transparent !important;
}

.live-member .ash-host.ash-chat-first .ash-insights-card-head {
  grid-template-columns: 94px minmax(0, 1fr) !important;
  gap: 10px !important;
}

/* Evidence images must show the complete slab rather than a decorative crop. */
.live-member .ash-host.ash-chat-first .ash-insights-card-head img,
.live-member .ash-host.ash-chat-first .ash-insights-image-empty {
  width: 94px !important;
  height: 132px !important;
  padding: 4px !important;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--border)) !important;
  border-radius: 8px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: color-mix(in srgb, var(--well) 88%, var(--accent) 4%) !important;
}

.live-member .ash-host.ash-chat-first .ash-insights button,
.live-member .ash-host.ash-chat-first .cp-state-top #cp-state-save {
  min-height: 44px !important;
  border-radius: 8px !important;
}

.live-member .ash-host.ash-chat-first .cp-state-editor {
  min-height: 160px !important;
  border-radius: 9px !important;
}

/* The membership gate remains fully actionable while using the same quieter
   surfaces as the signed-in Ash workspace. */
.live-member .ash-upgrade-stage {
  border: 1px solid color-mix(in srgb, var(--accent) 31%, var(--border)) !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 38px rgba(45, 34, 82, .075) !important;
}

.live-member .ash-upgrade-preview {
  border: 0 !important;
  box-shadow: none !important;
}

.live-member .ash-upgrade-membership {
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border)) !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--card1), color-mix(in srgb, var(--card2) 90%, var(--accent) 4%)) !important;
  box-shadow: 0 10px 26px rgba(45, 34, 82, .055) !important;
}

.live-member .ash-upgrade-plan {
  border: 1px solid color-mix(in srgb, var(--border) 90%, var(--accent) 10%) !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--well) 94%, var(--accent) 2%) !important;
  box-shadow: 0 7px 18px rgba(45, 34, 82, .04) !important;
}

.live-member .ash-upgrade-plan.is-featured {
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent), 0 10px 24px color-mix(in srgb, var(--accent) 11%, transparent) !important;
}

.live-member .ash-upgrade-plan button,
.live-member .ash-manage-plan {
  min-height: 44px !important;
  border-radius: 8px !important;
}

@media (max-width: 1120px) {
  .live-member .ash-host.ash-chat-first .cp-grid {
    height:auto !important;
    grid-template-columns: minmax(194px, 224px) minmax(0, 1fr) !important;
  }

  .live-member .ash-host.ash-chat-first .cp-state {
    grid-column: 1 / -1 !important;
    max-height: 296px !important;
  }
}

@media (min-width:1121px) {
  .live-member .ash-host.ash-chat-first .cp-state,
  .live-member .ash-host.ash-chat-first .cp-channels { min-height:0 !important; overflow:auto !important; }
  .live-member .ash-host.ash-chat-first .cp-state .cp-drawer,
  .live-member .ash-host.ash-chat-first .cp-channels .cp-drawer { min-height:0 !important; height:100%; }
}

@media (max-width: 720px) {
  .live-member .ash-host.ash-chat-first .cp-top {
    align-items: flex-start !important;
  }

  .live-member .ash-host.ash-chat-first .cp-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    min-height: 0 !important;
  }

  .live-member .ash-host.ash-chat-first .cp-chat {
    order: 0;
    padding: 16px 14px !important;
  }

  .live-member .ash-host.ash-chat-first .cp-channels { order: 1; }
  .live-member .ash-host.ash-chat-first .cp-state {
    order: 2;
    grid-column: auto !important;
    max-height: 280px !important;
  }

  .live-member .ash-host.ash-chat-first .cp-messages {
    min-height: min(280px, 37svh) !important;
    max-height: 52svh !important;
  }

  .live-member .ash-host.ash-chat-first #cp-input { min-height: 96px !important; }

  .live-member .ash-host.ash-chat-first .cp-drawer > summary,
  .live-member .ash-host.ash-chat-first .cp-chat-actions button,
  .live-member .ash-host.ash-chat-first #cp-new,
  .live-member .ash-host.ash-chat-first #cp-send,
  .live-member .ash-host.ash-chat-first .ash-insights button,
  .live-member .ash-host.ash-chat-first .cp-state-top #cp-state-save {
    min-height: 44px !important;
  }
}

/* Ask Ash compact workspace: chat owns the canvas; supporting material opens
   deliberately from the always-visible controls above it. */
.live-member .ash-host.ash-chat-first .cp-root {
  gap: 8px !important;
  min-height: 0 !important;
}

.live-member .ash-host.ash-chat-first .cp-top {
  min-height: 48px;
}

.live-member .ash-host.ash-chat-first .cp-top-copy {
  font-size: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  height: clamp(560px, calc(100svh - 228px), 720px) !important;
  min-height: 0 !important;
  gap: 0 !important;
}

.live-member .ash-host.ash-chat-first .cp-chat {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-height: 0 !important;
  padding: clamp(14px, 1.8vw, 22px) !important;
}

.live-member .ash-host.ash-chat-first .cp-channels,
.live-member .ash-host.ash-chat-first .cp-state {
  position: absolute !important;
  z-index: 20 !important;
  top: 0 !important;
  bottom: auto !important;
  display: block !important;
  width: min(360px, calc(100vw - 28px)) !important;
  max-height: min(680px, calc(100svh - 32px)) !important;
  padding: 0 !important;
  overflow: auto !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  background: var(--panel) !important;
  box-shadow: 0 18px 46px rgba(24, 18, 50, .22) !important;
}

.live-member .ash-host.ash-chat-first .cp-channels { left: 0 !important; right: auto !important; }
.live-member .ash-host.ash-chat-first .cp-state { right: 0 !important; left: auto !important; }
.live-member .ash-host.ash-chat-first .cp-channels[hidden],
.live-member .ash-host.ash-chat-first .cp-state[hidden] { display: none !important; }

.live-member .ash-host.ash-chat-first .cp-channels .cp-drawer-content,
.live-member .ash-host.ash-chat-first .cp-state .cp-drawer-content {
  display: flex !important;
  min-height: 0 !important;
  padding: 14px !important;
}

.live-member .ash-host.ash-chat-first .cp-panel-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.live-member .ash-host.ash-chat-first .cp-panel-titlebar h3 {
  margin: 0;
  font-size: 16px;
}

.live-member .ash-host.ash-chat-first .cp-panel-close,
.live-member .ash-host.ash-chat-first .cp-chat-actions button,
.live-member .ash-host.ash-chat-first .cp-actions-menu summary,
.live-member .ash-host.ash-chat-first #cp-new,
.live-member .ash-host.ash-chat-first #cp-send {
  min-height: 44px !important;
  border-radius: 8px !important;
}

.live-member .ash-host.ash-chat-first .cp-panel-close {
  width: auto;
  padding: 7px 10px;
  font-size: 13px;
}

.live-member .ash-host.ash-chat-first .cp-chat-top {
  align-items: flex-start !important;
  gap: 10px !important;
  padding-bottom: 9px !important;
}

.live-member .ash-host.ash-chat-first .cp-chat-actions {
  flex: 0 1 auto;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.live-member .ash-host.ash-chat-first .cp-chat-actions button {
  padding: 7px 10px !important;
  font-size: 13px !important;
}

.live-member .ash-host.ash-chat-first .cp-actions-menu {
  position: relative;
  min-width: 84px;
}

.live-member .ash-host.ash-chat-first .cp-actions-menu summary {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--body);
  cursor: pointer;
  font-size: 13px;
  list-style: none;
  background: var(--well);
}

.live-member .ash-host.ash-chat-first .cp-actions-menu summary::-webkit-details-marker { display: none; }

.live-member .ash-host.ash-chat-first .cp-actions-popover {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  right: 0;
  display: grid;
  gap: 6px;
  min-width: 128px;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 12px 30px rgba(24, 18, 50, .18);
}

.live-member .ash-host.ash-chat-first .cp-actions-popover button {
  width: 100%;
}

.live-member .ash-host.ash-chat-first #cp-new {
  width: auto !important;
  min-width: 92px !important;
}

.live-member .ash-host.ash-chat-first .cp-messages {
  min-height: 0 !important;
  padding-block: 8px 12px !important;
}

.live-member .ash-host.ash-chat-first #cp-input {
  box-sizing: border-box !important;
  min-height: 48px !important;
  max-height: 120px !important;
  height: 48px;
  overflow-y: hidden;
  resize: none !important;
  font: inherit !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}

.live-member .ash-host.ash-chat-first .cp-composer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 8px;
  padding: 9px 11px !important;
}

.live-member .ash-host.ash-chat-first #cp-input { grid-column: 1; grid-row: 1; }

.live-member .ash-host.ash-chat-first .cp-compose-row {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
}

.live-member .ash-host.ash-chat-first .cp-compose-row .muted { display: none; }

.live-member .ash-host.ash-chat-first #cp-send {
  width: auto !important;
  min-width: 76px !important;
  height: 48px;
  padding-inline: 12px !important;
}

.live-member .ash-host.ash-chat-first .cp-legal {
  grid-column: 1 / -1;
  margin: 0 !important;
  font-size: 9px !important;
  line-height: 1.3 !important;
}

.live-member .ash-host.ash-chat-first .cp-state-editor {
  min-height: 160px !important;
  font-family: inherit !important;
}

.live-member .ash-host.ash-chat-first .cp-insights[hidden] { display: none !important; }

@media (max-width: 720px) {
  .live-member .ash-host.ash-chat-first .cp-top-copy { display: none; }

  .live-member .ash-host.ash-chat-first .cp-grid {
    display: grid !important;
    height: max(470px, calc(100svh - 254px)) !important;
  }

  .live-member .ash-host.ash-chat-first .cp-chat {
    order: initial !important;
    padding: 14px 12px !important;
  }

  .live-member .ash-host.ash-chat-first .cp-channels,
  .live-member .ash-host.ash-chat-first .cp-state {
    inset: 0 !important;
    width: auto !important;
    max-height: calc(100svh - 24px) !important;
  }

  .live-member .ash-host.ash-chat-first .cp-messages {
    min-height: 0 !important;
    max-height: none !important;
  }

  .live-member .ash-host.ash-chat-first .cp-chat-top {
    flex-direction: column;
  }

  .live-member .ash-host.ash-chat-first .cp-chat-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    gap: 6px;
  }

  .live-member .ash-host.ash-chat-first .cp-chat-actions button { width: 100%; }
  .live-member .ash-host.ash-chat-first .cp-actions-menu { grid-column: 1 / -1; width: 100%; }
  .live-member .ash-host.ash-chat-first .cp-actions-popover { left: 0; right: auto; width: calc(100% - 16px); }

  .live-member .ash-host.ash-chat-first #cp-input { min-height: 48px !important; }
}