/* Digital Joey's portrait is an independent background, below all chat UI. */
.digital-joey { isolation:isolate; }
.digital-atmosphere {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 40%,rgba(23,95,171,.19),transparent 65%);
}
.digital-human {
  position:absolute; left:50%; top:-32vh; transform:translateX(-51%);
  width:min(145vh,128vw); height:min(145vh,128vw); z-index:0;
  pointer-events:none; opacity:0;
  mask-image:linear-gradient(to bottom,transparent 1%,#000 11%,#000 66%,transparent 98%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 1%,#000 11%,#000 66%,transparent 98%);
  transition:opacity .8s ease;
}
.digital-joey.active .digital-human { opacity:.60; }
.digital-human-canvas { display:block; width:100%; height:100%; }
.digital-human-label {
  position:absolute; left:12%; right:14%; top:81%; display:none; justify-content:space-between;
  border-top:1px solid rgba(115,192,255,.22); padding-top:13px;
  color:rgba(134,198,255,.64); font:9px/1.4 var(--mono,monospace); letter-spacing:2px;
}
.digital-joey .sec-placeholder { z-index:2; }
.digital-joey .ph-glyph { color:#8cbce3; text-shadow:0 0 28px rgba(66,155,255,.22); }
.digital-joey .ph-title { text-shadow:0 3px 30px #080b11; }
.digital-joey .ph-sub { color:#8a9cae; }
.digital-joey .chat-area {
  background:linear-gradient(135deg,rgba(11,16,24,.94),rgba(15,18,23,.88));
  border-color:rgba(124,163,191,.27);
  box-shadow:0 20px 80px rgba(0,0,0,.2),0 0 42px rgba(25,91,157,.045);
}
.digital-joey .chat-area.chat-area-expanded { background:rgba(10,15,22,.96); border-color:rgba(136,177,211,.4); }
.digital-joey .chat-quota { white-space:normal; text-align:center; line-height:1.6; overflow-wrap:anywhere; }
@media (max-width:760px) {
  .digital-atmosphere { background:radial-gradient(ellipse at 50% 36%,rgba(26,99,181,.17),transparent 68%); }
  .digital-human { top:-8vh; width:180vw; height:180vw; }
  .digital-joey.active .digital-human { opacity:.42; }
  .digital-human-label { display:none; }
  .digital-joey .ph-title { letter-spacing:3px; }
  .digital-joey .chat-area { background:rgba(9,15,23,.94); }
}
@media (prefers-reduced-motion:reduce) { .digital-human { transition:none; } }