/* Pixie.exe - standalone chat app, cute/pink counterpart to the dark iDOS
   terminal + The Council. Reuses .popup-win/.popup-tb chrome, own palette. */

#idol-win{
  width:min(680px, calc(100vw - 32px));
  height:min(690px, calc(100vh - 72px));
  border-color:#c93fa0;
  transition: transform 0.1s ease;
}
#idol-win.pixie-shake {
  animation: pixie-shake 0.4s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes pixie-shake {
  10%, 90% { margin-left: -1px; }
  20%, 80% { margin-left: 2px; }
  30%, 50%, 70% { margin-left: -4px; }
  40%, 60% { margin-left: 4px; }
}

#idol-win .popup-tb{
  background:linear-gradient(180deg,#ff8ec6,#c93fa0);
}
.idol-tb-game{
  cursor:pointer;padding:0 6px;font-size:13px;user-select:none;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,0.4));
}
.idol-tb-game:hover{filter:brightness(1.3);}

#idol-log{
  flex:1;overflow-y:auto;
  background:#1a0f1e;
  padding:12px;
  display:flex;flex-direction:column;gap:8px;
  font-family:'Share Tech Mono',monospace;font-size:11px;line-height:1.5;
}

#pixie-stage{
  height:238px;
  display:flex;
  flex-direction:column;
  min-height:0;
  background:#08040b;
  border-bottom:1px solid #3a2440;
  box-shadow:inset 0 -10px 24px rgba(201,63,160,0.08);
}
#pixie-meta{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:26px;
  padding:5px 8px;
  border-bottom:1px solid #2a1830;
  color:#ffb0d8;
  font-family:'Share Tech Mono',monospace;
  font-size:10px;
  letter-spacing:0.04em;
  text-transform:uppercase;
}
#pixie-meta b{color:#58dbff;font-weight:normal;}
#pixie-meta label{margin-left:auto;color:#7a5070;}
#pixie-expression-select{
  max-width:140px;
  background:#150c18;
  color:#ffd6ee;
  border:1px solid #7a3a8a;
  outline:none;
  font-family:'Share Tech Mono',monospace;
  font-size:10px;
  padding:2px 5px;
}
#pixie-ascii{
  flex:1;
  margin:0;
  padding:8px;
  overflow:hidden;
  color:#aab8cc;
  background:#050307;
  font-family:'Share Tech Mono','Courier New',monospace;
  font-size:2px;
  line-height:1;
  white-space:pre;
  text-align:center;
  text-shadow:0 0 5px rgba(170,184,204,0.35);
  user-select:none;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
#pixie-ascii.pixie-glitch-in{animation:pixie-ascii-glitch 0.24s steps(2,end);}
#pixie-ascii.pixie-html-art{
  text-shadow:none;
  font-weight:bold;
  line-height:.78;
  padding:8px 8px 0;
}
#pixie-ascii .pixie-art-inner{
  display:block;
  transform:translateY(14px);
}
#pixie-ascii.pixie-html-art b{font-weight:bold;}

.idol-msg{
  max-width:82%;padding:7px 10px;
  border:1px solid #3a2440;white-space:pre-wrap;word-break:break-word;
}
.idol-msg-user{
  align-self:flex-end;
  background:#2a1a3a;border-color:#7a3a8a;color:#f0d0ff;
}
.idol-msg-bot{
  align-self:flex-start;
  background:#3a1830;border-color:#c93fa0;color:#ffd6ee;
}
.idol-msg-bot.idol-typing{color:#c93fa0;font-style:italic;}
/* "thinking" indicator: three pulsing dots shown before the first token
   streams in (the bubble starts empty). Replaced by the live caret below the
   instant text begins arriving. */
.idol-msg-bot.idol-typing::after{
  content:'● ● ●';
  letter-spacing:1px;
  animation:pixie-think 1.05s ease-in-out infinite;
}
@keyframes pixie-think{0%,100%{opacity:.3}50%{opacity:.95}}
.idol-msg-bot.pixie-typing-line::after{
  content:'_';
  color:#58dbff;
  animation:pixie-caret 0.7s steps(2,end) infinite;
}
/* gentle entrance so new messages feel soft, not jumpy */
.idol-msg{animation:idol-msg-in .18s ease-out both;}
@keyframes idol-msg-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.pixie-system-bark{
  border-color:#ff4d6d;
  color:#ffd6ee;
  background:#3a1018;
}
.idol-msg-err{
  align-self:center;
  color:#ff4d6d;font-style:italic;
  border-color:transparent;background:transparent;
}

#idol-inrow{
  display:flex;
  border-top:1px solid #3a2440;
  background:#08040b;
}
.idol-prompt{
  color:#ff8ec6;font-family:'Share Tech Mono',monospace;
  font-size:12px;padding:12px 0 12px 12px;display:flex;align-items:center;
}
#idol-in{
  flex:1;
  background:transparent;border:none;
  padding:12px;color:#f0d0ff;font-family:'Share Tech Mono',monospace;
  font-size:12px;
  outline:none;
}
#idol-in::placeholder{color:#7a3a8a;}

@keyframes pixie-ascii-glitch{
  0%{clip-path:inset(10% 0 80% 0);transform:translate(-2px,1px);}
  20%{clip-path:inset(80% 0 5% 0);transform:translate(2px,-1px);}
  40%{clip-path:inset(20% 0 50% 0);transform:translate(-2px,-2px);}
  60%{clip-path:inset(50% 0 30% 0);transform:translate(1px,2px);}
  80%{clip-path:inset(5% 0 70% 0);transform:translate(-1px,-1px);}
  100%{clip-path:inset(0 0 0 0);transform:translate(0);}
}
@keyframes pixie-caret{
  50%{opacity:0;}
}