/* Вигляд компонента «персонаж + бульбашка» (CastUI). Бульбашка — як у Малька (peek-діалог):
   біла, товстий темний контур, «друкарська» тінь; ім'я — пігулкою в кольорі персонажа.
   Кольори через змінні, тож компонент живе і в темній, і в світлій темі застосунку. */
.cast-line{--cast-ink:#1a1418;--cast-paper:#fff;--cast-text:#16141d;--cast-char:104px;
  display:flex;align-items:flex-end;gap:10px;max-width:100%;}
.cast-line.cast-right{flex-direction:row-reverse;}
.cast-line.cast-sm{--cast-char:58px;align-items:center;gap:8px;}
.cast-line.cast-lg{--cast-char:156px;}
.cast-char{flex:none;width:var(--cast-char);aspect-ratio:200/240;}
.cast-sm .cast-char{aspect-ratio:1;border-radius:50%;overflow:hidden;background:color-mix(in srgb, var(--cast-accent) 22%, transparent);border:2.5px solid var(--cast-ink);}
.cast-char svg{width:100%;height:100%;display:block;}
.cast-bubble{position:relative;min-width:0;flex:0 1 auto;max-width:min(420px,100%);background:var(--cast-paper);color:var(--cast-text);
  border:3px solid var(--cast-ink);border-radius:18px;padding:9px 14px 11px;box-shadow:4px 4px 0 var(--cast-ink);margin-bottom:calc(var(--cast-char) * .38);
  font-family:'Manrope',system-ui,sans-serif;font-weight:700;font-size:15px;line-height:1.42;cursor:default;overflow-wrap:anywhere;}
.cast-sm .cast-bubble{margin-bottom:0;font-size:13.5px;padding:7px 12px 9px;border-radius:14px;box-shadow:3px 3px 0 var(--cast-ink);}
.cast-lg .cast-bubble{font-size:16.5px;}
/* хвостик бульбашки — до персонажа */
.cast-bubble::before,.cast-bubble::after{content:"";position:absolute;bottom:14px;border-style:solid;}
.cast-left .cast-bubble::before{left:-16px;border-width:9px 16px 9px 0;border-color:transparent var(--cast-ink) transparent transparent;}
.cast-left .cast-bubble::after{left:-10px;bottom:17px;border-width:6px 11px 6px 0;border-color:transparent var(--cast-paper) transparent transparent;}
.cast-right .cast-bubble::before{right:-16px;border-width:9px 0 9px 16px;border-color:transparent transparent transparent var(--cast-ink);}
.cast-right .cast-bubble::after{right:-10px;bottom:17px;border-width:6px 0 6px 11px;border-color:transparent transparent transparent var(--cast-paper);}
.cast-sm .cast-bubble::before,.cast-sm .cast-bubble::after{bottom:auto;top:50%;margin-top:-9px;}
.cast-sm .cast-bubble::after{margin-top:-6px;}
.cast-name{display:inline-block;margin:-2px 0 4px -2px;padding:1px 9px 2px;border-radius:999px;background:var(--cast-accent);color:#fff;
  font-family:'Golos Text','Manrope',sans-serif;font-weight:900;font-size:12px;letter-spacing:.2px;text-shadow:0 1px 0 rgba(0,0,0,.35);border:2px solid var(--cast-ink);}
.cast-sm .cast-name{font-size:11px;padding:0 7px 1px;margin-bottom:2px;}
.cast-text{white-space:pre-wrap;min-height:1.42em;}
.cast-line.typing .cast-bubble{cursor:pointer;}
.cast-line.typing .cast-text::after{content:"▍";animation:cast-caret .7s steps(1) infinite;margin-left:1px;opacity:.6;}
@keyframes cast-caret{50%{opacity:0}}
@media (prefers-reduced-motion: reduce){ .cast-line svg.mk-char *{animation:none!important;} }
