/* Genie tab chat animations */
:root{
  --gen-primary-color:#1448f6;
  --gen-secondary-color:#8607b8;
  --gen-primary-gradient:linear-gradient(45deg,#1448f6 0%,#8607b8 100%);
  --gen-primary-btn:#1448f6;
  --gen-glow:rgba(20,72,246,.18);
  --gen-glow-strong:rgba(20,72,246,.32);
  --gen-secondary-bg:#fff;
  --gen-quinary-bg:linear-gradient(45deg,rgba(58,101,246,.1) 0%,rgba(76,59,244,.1) 100%);
  --gen-input-outline:#a6c6e2;
  --gen-card-border:#a6c6e2;
  --gen-primary-text:#111;
  --gen-secondary-text:#333;
  --gen-tertiary-text:#666;
  --gen-quaternary-text:#999;
}

.chat-stage{
  width:100%;
  max-width:1200px;
  display:flex;
  flex-direction:column;
  gap:0;
  min-height:480px;
}

.msg{
  display:flex;
  width:100%;
  margin-bottom:28px;
  overflow:hidden;
  max-height:1000px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .5s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1),max-height .45s cubic-bezier(.22,1,.36,1),margin-bottom .45s cubic-bezier(.22,1,.36,1);
}
.msg:last-child{ margin-bottom:0; }
.msg.is-visible{ opacity:1; transform:translateY(0); }
.msg.is-hiding{
  opacity:0;
  transform:translateY(-8px);
  max-height:0;
  margin-bottom:0;
  pointer-events:none;
}
.msg--user{ justify-content:flex-end; }
.msg--ai{
  justify-content:flex-start;
  transform:none !important;
}
.msg--ai.is-visible{ transform:none !important; }

.user-block{ display:flex; align-items:flex-start; gap:14px; max-width:600px; }
.user-text-col{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.msg-id{ font-size:13px; font-weight:600; color:var(--gen-tertiary-text); letter-spacing:-.01em; }
.user-bubble{
  background:var(--gen-quinary-bg);
  color:var(--gen-secondary-text);
  border-radius:24px 0 24px 24px;
  padding:14px 22px;
  font-size:15px;
  line-height:1.45;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
}
.timestamp{ font-size:13px; color:var(--gen-tertiary-text); }
.user-avatar,
.ai-avatar{
  width:44px;
  height:44px;
  border-radius:9999px;
  overflow:hidden;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 1px 4px rgba(0,0,0,.08);
}
.user-avatar{ background:#e5e7eb; }
.user-avatar img{ width:100%; height:100%; object-fit:cover; user-select:none; }

.ai-block{ display:flex; align-items:flex-start; gap:16px; max-width:820px; width:100%; }
.ai-avatar{ min-width:44px; background:var(--gen-primary-gradient); }
.ai-avatar img{ width:100%; height:100%; object-fit:contain; transform:scale(1.78); user-select:none; }
.ai-content{ display:flex; flex-direction:column; gap:8px; flex:1; min-width:0; }
.ai-id-row,
.ai-time{ font-size:13px; color:var(--gen-tertiary-text); }
.ai-id-row{ font-weight:600; }
.ai-time{ margin-top:2px; }

.typing{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--gen-quinary-bg);
  border-radius:0 24px 24px 24px;
  padding:14px 22px;
  min-height:50px;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
}
.typing-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gen-primary-btn);
  animation:typingBounce 1s infinite;
}
.typing-dot:nth-child(2){ animation-delay:150ms; }
.typing-dot:nth-child(3){ animation-delay:300ms; }

.result-card{
  background:var(--gen-quinary-bg);
  border-radius:0 24px 24px 24px;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
  opacity:0;
  transform:translateY(22px);
  will-change:transform,opacity;
}
.msg--ai.is-visible .result-card{
  opacity:1;
  transform:translateY(0);
  animation:genieSlideUp .62s cubic-bezier(.22,1,.36,1) both;
}

@keyframes genieSlideUp{
  from{ opacity:0; transform:translateY(22px); }
  to{ opacity:1; transform:translateY(0); }
}
.result-headline{
  font-size:15px;
  font-weight:600;
  color:var(--gen-primary-text);
  line-height:1.5;
  margin:0;
}
.result-headline strong{ color:var(--gen-primary-btn); font-weight:700; }

.findings,
.personas,
.predictions,
.scoring-list,
.actions-list{ display:flex; flex-direction:column; gap:10px; }

.audience,
.finding,
.persona,
.prediction,
.scoring-panel{
  background:var(--gen-secondary-bg);
  border:1px solid color-mix(in srgb,var(--gen-card-border) 50%,transparent);
  border-radius:14px;
  box-shadow:0 1px 2px color-mix(in srgb,var(--gen-primary-text) 4%,transparent);
}

.finding,
.persona,
.prediction{ display:flex; gap:14px; padding:14px 16px; }
.finding{ align-items:center; }
.persona,
.prediction{ align-items:flex-start; }

.finding-num,
.persona-icon,
.prediction-icon{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 4px 10px -4px color-mix(in srgb,var(--gen-primary-btn) 50%,transparent);
}
.finding-num{
  width:34px;
  height:34px;
  border-radius:11px;
  background:var(--gen-primary-gradient);
  font-size:14px;
  font-weight:800;
}
.persona-icon,
.prediction-icon{
  width:38px;
  height:38px;
  border-radius:11px;
}
.persona-icon{ background:var(--gen-primary-gradient); }
.prediction-icon{
  background:var(--accent,var(--gen-primary-btn));
  box-shadow:0 4px 10px -4px color-mix(in srgb,var(--accent,var(--gen-primary-btn)) 50%,transparent);
}
.persona-icon svg,
.prediction-icon svg,
.insight-header svg,
.actions-header svg{ width:20px; height:20px; }

.finding-content,
.persona-content,
.prediction-text{ flex:1; min-width:0; }
.finding-title,
.persona-title,
.prediction-title{
  font-size:13px;
  font-weight:700;
  color:var(--gen-primary-text);
  line-height:1.3;
}
.finding-desc,
.persona-desc,
.prediction-desc,
.scoring-note{
  font-size:12px;
  color:var(--gen-tertiary-text);
  line-height:1.45;
  margin-top:4px;
}

.insight-card,
.score-card,
.actions-card{
  background:var(--gen-primary-gradient);
  border-radius:14px;
  padding:16px 18px;
  color:#fff;
  box-shadow:0 8px 22px -10px var(--gen-glow-strong);
  position:relative;
  overflow:hidden;
}
.insight-card::before,
.score-card::before,
.actions-card::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(120% 80% at 100% 0%,rgba(255,255,255,.18),transparent 60%);
  pointer-events:none;
}
.insight-header,
.actions-header{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  margin-bottom:10px;
  position:relative;
}
.insight-body,
.score-body{
  font-size:12.5px;
  line-height:1.55;
  color:rgba(255,255,255,.92);
  margin:0;
  position:relative;
}

.chips{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:8px;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .5s ease .25s,transform .5s ease .25s;
}
.msg.is-visible .chips{ opacity:1; transform:translateY(0); }
.chip{
  display:inline-flex;
  align-items:center;
  padding:10px 22px;
  border-radius:9999px;
  border:1px solid var(--gen-input-outline);
  background:#fff;
  font-size:14px;
  font-weight:600;
  color:var(--gen-secondary-text);
  cursor:pointer;
  transition:background .2s,transform .2s,border-color .2s;
  font-family:inherit;
}
.chip:hover{
  background:var(--gen-quinary-bg);
  border-color:var(--gen-primary-btn);
  transform:translateY(-1px);
}

.result-card .result-headline,
.result-card .audience,
.result-card .finding,
.result-card .score-card,
.result-card .persona,
.result-card .scoring-panel,
.result-card .insight-card,
.result-card .prediction,
.result-card .actions-card{
  opacity:0;
  transform:translateY(12px);
}
.msg.is-visible .result-card .result-headline{ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 0ms forwards; }
.msg.is-visible .result-card .audience:nth-of-type(1),
.msg.is-visible .result-card .finding:nth-of-type(1),
.msg.is-visible .result-card .persona:nth-of-type(1),
.msg.is-visible .result-card .prediction:nth-of-type(1){ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 200ms forwards; }
.msg.is-visible .result-card .audience:nth-of-type(2),
.msg.is-visible .result-card .finding:nth-of-type(2),
.msg.is-visible .result-card .persona:nth-of-type(2),
.msg.is-visible .result-card .prediction:nth-of-type(2){ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 350ms forwards; }
.msg.is-visible .result-card .audience:nth-of-type(3),
.msg.is-visible .result-card .finding:nth-of-type(3),
.msg.is-visible .result-card .persona:nth-of-type(3),
.msg.is-visible .result-card .prediction:nth-of-type(3){ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 500ms forwards; }
.msg.is-visible .result-card .audience:nth-of-type(4){ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 650ms forwards; }
.msg.is-visible .result-card .score-card,
.msg.is-visible .result-card .scoring-panel,
.msg.is-visible .result-card .actions-card{ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 700ms forwards; }
.msg.is-visible .result-card .insight-card{ animation:cardIn .5s cubic-bezier(.22,1,.36,1) 900ms forwards; }

.hidden,
.genie-hidden{ display:none !important; }

/* Auto-segmentation */
.genie-chat-anim{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  color:var(--gen-primary-text);
  width:100%;
  -webkit-font-smoothing:antialiased;
}
.genie-chat-anim,
.genie-chat-anim *,
.genie-chat-anim *::before,
.genie-chat-anim *::after{ box-sizing:border-box; }
.genie-chat-anim .chat-stage{ gap:14px; min-height:460px; justify-content:flex-start; }
.genie-chat-anim .ai-block{ max-width:100%; }
.genie-chat-anim .user-bubble{ padding:10px 18px; font-size:14px; line-height:1.4; }
.genie-chat-anim .typing{ padding:10px 18px; min-height:42px; }
.genie-chat-anim .result-card{ padding:14px 16px; gap:10px; }
.genie-chat-anim .result-headline{ font-size:14px; line-height:1.4; }
.genie-chat-anim .chips{ gap:8px; margin-top:4px; }
.genie-chat-anim .chip{ padding:7px 16px; font-size:13px; }

.audiences{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.audience{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; }
.aud-bubble{
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--c);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:12px;
  font-weight:800;
  position:relative;
  box-shadow:0 8px 18px -6px color-mix(in srgb,var(--c) 50%,transparent),inset 0 1px 0 rgba(255,255,255,.28);
}
.aud-bubble::after{
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:50%;
  border:1.5px solid var(--c);
  opacity:.22;
}
.aud-text{ min-width:0; }
.aud-title{ font-size:12.5px; font-weight:700; color:var(--gen-primary-text); line-height:1.25; }
.aud-desc{ font-size:11.5px; color:var(--gen-tertiary-text); line-height:1.3; margin-top:2px; }
.insight-headline{ font-size:13px; font-weight:700; color:#fff; margin:0 0 2px; position:relative; }

/* Data quality */
.finding-stat,
.prediction-stat{
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  gap:1px;
  border-right:1px solid color-mix(in srgb,var(--gen-card-border) 40%,transparent);
}
.finding-stat{ min-width:86px; align-items:flex-start; padding-right:16px; }
.finding-stat-num{
  font-size:26px;
  font-weight:800;
  line-height:1.05;
  letter-spacing:-.02em;
  background:var(--gen-primary-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.finding-stat-unit,
.prediction-stat-unit{
  font-size:10.5px;
  font-weight:600;
  color:var(--gen-tertiary-text);
  text-transform:lowercase;
  letter-spacing:.02em;
}
.score-card{ padding:18px 20px; }
.score-label{
  font-size:12px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78);
  margin:0 0 6px;
  position:relative;
}
.score-verdict{ color:rgba(255,218,154,.98); font-weight:700; margin-left:6px; }
.score-verdict::before{ content:'·'; color:rgba(255,255,255,.45); margin-right:6px; font-weight:400; }
.score-row{ display:flex; align-items:baseline; gap:6px; position:relative; margin-bottom:10px; }
.score-value{ font-size:36px; font-weight:800; letter-spacing:-.02em; line-height:1; }
.score-max{ font-size:16px; font-weight:500; color:rgba(255,255,255,.7); }
.score-track{
  position:relative;
  height:6px;
  background:rgba(255,255,255,.18);
  border-radius:999px;
  overflow:hidden;
  margin-bottom:12px;
}
.score-fill{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:0 !important;
  background:rgba(255,255,255,.95);
  border-radius:999px;
  transition:width .9s cubic-bezier(.22,1,.36,1);
}
.msg.is-visible .score-fill{ width:82% !important; transition-delay:1100ms; }

/* Lead scoring */
.persona-role{
  font-size:11.5px;
  font-weight:600;
  color:var(--gen-primary-btn);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-top:2px;
}
.scoring-panel{ padding:14px 16px; }
.scoring-header{
  font-size:11.5px;
  font-weight:600;
  color:var(--gen-tertiary-text);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin:0 0 10px;
}
.account-row{ display:flex; align-items:center; gap:12px; padding:8px 4px; }
.account-rank{ flex-shrink:0; width:18px; text-align:center; font-size:12px; font-weight:700; color:var(--gen-quaternary-text); }
.account-name{ flex:1; font-size:13px; font-weight:600; color:var(--gen-primary-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.account-bar-wrap{ flex-shrink:0; width:110px; }
.account-bar{ height:5px; background:color-mix(in srgb,var(--gen-primary-btn) 12%,transparent); border-radius:999px; overflow:hidden; }
.account-bar-fill{
  height:100%;
  width:0 !important;
  background:var(--gen-primary-gradient);
  border-radius:999px;
  transition:width .8s cubic-bezier(.22,1,.36,1);
}
.account-score{
  flex-shrink:0;
  width:32px;
  text-align:right;
  font-size:14px;
  font-weight:800;
  background:var(--gen-primary-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.scoring-note{ font-size:11.5px; line-height:1.5; margin:12px 0 0; }
.msg.is-visible .account-row:nth-child(1) .account-bar-fill{ width:92% !important; transition-delay:1100ms; }
.msg.is-visible .account-row:nth-child(2) .account-bar-fill{ width:87% !important; transition-delay:1200ms; }
.msg.is-visible .account-row:nth-child(3) .account-bar-fill{ width:81% !important; transition-delay:1300ms; }

/* Predictive enrichment */
.prediction-body{ flex:1; min-width:0; display:flex; align-items:center; gap:14px; }
.prediction-stat{ min-width:78px; padding-right:14px; }
.prediction-stat-num{
  font-size:20px;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.05;
  background:var(--gen-primary-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.actions-header{ margin-bottom:12px; }
.actions-list{ gap:8px; position:relative; }
.action-item{ display:flex; align-items:flex-start; gap:10px; font-size:12.5px; color:rgba(255,255,255,.92); }
.action-item.primary{ font-weight:700; color:#fff; }
.action-check{
  width:18px;
  height:18px;
  min-width:18px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}
.action-check svg{ width:12px; height:12px; }
.action-text{ display:flex; flex-direction:column; gap:2px; }
.action-name{ font-weight:700; }
.action-reason{ font-size:11.5px; font-weight:500; color:rgba(255,255,255,.78); }

@keyframes typingBounce{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-25%); animation-timing-function:cubic-bezier(0,0,.2,1); }
}
@keyframes cardIn{
  to{ opacity:1; transform:translateY(0); }
}

@media (max-width:620px){
  .audiences{ grid-template-columns:1fr; }
  .prediction-body{ align-items:flex-start; flex-direction:column; gap:8px; }
  .prediction-stat{ border-right:0; border-bottom:1px solid color-mix(in srgb,var(--gen-card-border) 40%,transparent); padding-right:0; padding-bottom:8px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}