/* Brainier AI: approved smiling mascot, responsive wordmark, no opaque image box. */
.brainier-brand {
  display: inline-flex;
  align-items: center;
  gap: .32em;
  flex: 0 0 auto;
  max-width: 100%;
  vertical-align: middle;
  color: inherit;
  font: 800 1em/1.15 Arial, Helvetica, sans-serif;
  letter-spacing: -.035em;
  text-transform: none;
  white-space: nowrap;
}
.brainier-brand-icon {
  display: inline-block;
  width: 1.75em;
  height: 1.75em;
  flex: 0 0 1.75em;
  vertical-align: middle;
  background: url('/static/img/brainier/brainier-chat-button.png?v=20260721-1') center / 128% no-repeat;
}
.brainier-brand .brainier-brand-wordmark {
  display: inline-block;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  white-space: nowrap;
}
.brainier-brand .brainier-brand-ai {
  position: relative;
  top: -.78em;
  margin-left: .1em;
  color: #eb398f;
  font-size: .42em;
  line-height: 0;
  font-weight: 800;
  letter-spacing: -.015em;
  vertical-align: baseline;
}
.menu-container .brainier-brand--nav { font-size: 1.2rem; color: #fff; }
.menu-container .brainier-brand--nav .brainier-brand-ai,
.brainier-widget .brainier-brand-ai { color: #ff91cb; }
.brainier-brand-icon--wallet { width: 20px; height: 20px; flex-basis: 20px; }
.brainier-marketing-intro { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem 1.2rem; margin: 1.1rem 0; }
.brainier-marketing-intro p { margin: 0; font-size: .95rem; color: inherit; }
.brainier-brand--marketing { font-size: 1.65rem; }
.brainier-brand--onboarding { font-size: 1.45rem; }
.brainier-intro-tagline { display: inline-block; margin-left: .75rem; vertical-align: middle; }
.brainier-intro-identity { margin: 0 2rem .75rem 0; }
.brainier-hero .brainier-hero-copy { flex: 1 1 300px; min-width: 0; color: #080b4a; }
.brainier-hero .brainier-balance { flex: 0 0 auto; }
.brainier-hero .brainier-brand--hero { font-size: clamp(1.7rem, 3.5vw, 2.5rem); color: #080b4a; }
.brainier-hero .brainier-expert-role { margin-bottom: .2rem; font-weight: 600; }
.brainier-brand--empty { font-size: 2rem; margin-bottom: .8rem; color: #080b4a; }
.brainier-widget .brainier-brand--widget { font-size: 1.35rem; color: #fff; overflow: visible; }
.brainier-widget .brainier-widget-heading { flex: 1 1 auto; }
.brainier-widget .brainier-widget-title-line { overflow: visible; }
.brainier-widget .brainier-expert-role { font-size: .72rem; }
.brainier-widget .brainier-toggle-ai {
  position: absolute; top: 4px; left: 42px; z-index: 3;
  padding: 2px 4px; border: 1px solid #ff91cb; border-radius: 6px;
  background: #17112d; color: #ff91cb; font: 800 10px/1 Arial, sans-serif;
  letter-spacing: 0; pointer-events: none;
}
.brainier-brand--action { font-size: 1.06em; margin-left: .15rem; }
.xray-brainier-btn, .portfolio-beta-brainier, .strategy-brainier {
  display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .3rem;
}
@media (max-width: 520px) {
  .brainier-marketing-intro { gap: .45rem; }
  .brainier-marketing-intro p { width: 100%; font-size: .88rem; }
  .brainier-intro-tagline { display: block; margin: .35rem 0 0; }
  .brainier-hero .brainier-brand--hero { font-size: 1.7rem; }
  .brainier-widget .brainier-brand--widget { font-size: 1.2rem; }
}

/* The wordmark now includes the mascot, so the header has two columns. */
.brainier-widget .brainier-widget-panel > header {
  grid-template-columns: minmax(0, 1fr) 32px;
}
.brainier-widget .brainier-widget-toggle::after { display: none !important; }
.menu-container .brainier-brand--nav .brainier-brand-ai { font-size: .5em; }
.brainier-marketing-intro .brainier-brand { color: #080b4a; }
.brainier-hero .brainier-hero-copy > p { text-align: left; }

@media (max-width: 520px) {
  .brainier-widget.brainier-widget--public.is-open .brainier-widget-panel {
    position: fixed;
    left: 8px;
    right: 8px;
    bottom: 10px;
    width: auto;
  }
}