/* livechat-v2.css — Frenzy96 game-branded Live Chat (player). 2026-06-01.
   Mounts into #modal-chat .modal. English-only. */
#modal-chat .modal.lc-root {
  --lc-bg:#080910; --lc-surface:#0b0c10; --lc-surface2:#131520; --lc-surface3:#141620;
  --lc-border:#1e2028; --lc-border2:#1a1c24;
  --lc-gold:#e8a124; --lc-gold-bg:#1f1a0d; --lc-gold-border:#3a2e0a;
  --lc-green:#2dc98a; --lc-green-bg:#0d1a10; --lc-red:#e84040; --lc-red-bg:#200f0f;
  --lc-blue:#4a8ee8; --lc-blue-bg:#0d1520;
  --lc-text:#eee; --lc-text2:#aaa; --lc-text3:#555; --lc-text4:#3a3e4d;
  background:var(--lc-bg) !important; color:var(--lc-text);
  border-radius:20px 20px 0 0; width:100% !important; max-width:100vw !important;
  padding:0 !important; box-sizing:border-box;
  display:flex !important; flex-direction:column !important; align-items:stretch !important;
  max-height:92vh !important; height:92vh !important; overflow:hidden !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

/* ── header brand banner ── */
.lc-head { position:relative; flex-shrink:0; display:flex; align-items:center; gap:11px;
  padding:12px 14px; overflow:hidden;
  background:linear-gradient(135deg,#1a0a00,#3d1500,#1a0a00); }
.lc-head__pat { position:absolute; inset:0; opacity:.03; pointer-events:none;
  background-image:repeating-linear-gradient(45deg,#fff 0 1px,transparent 1px 8px); }
.lc-head__back { position:relative; width:26px; height:26px; flex:0 0 26px; border-radius:7px;
  background:rgba(255,255,255,.1); border:none; color:#fff; display:flex; align-items:center;
  justify-content:center; cursor:pointer; }
.lc-head__back svg { width:16px; height:16px; }
.lc-head__mid { position:relative; flex:1; min-width:0; }
.lc-head__title { font-size:13px; font-weight:800; color:#fff; }
.lc-head__sub { font-size:9px; margin-top:2px; }
.lc-head__sub.on { color:var(--lc-green); } .lc-head__sub.off { color:var(--lc-text3); }
.lc-head__av { position:relative; width:30px; height:30px; flex:0 0 30px; border-radius:50%;
  background:linear-gradient(135deg,var(--lc-gold),#b97a10); display:flex; align-items:center;
  justify-content:center; font-size:15px; box-shadow:0 0 12px #e8a12466; }
.lc-head__dot { position:absolute; right:-1px; bottom:-1px; width:9px; height:9px; border-radius:50%;
  background:var(--lc-green); border:2px solid #1a0a00; }

/* ── welcome ── */
.lc-welcome { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:24px 18px; text-align:center; gap:6px; overflow-y:auto; }
.lc-welcome__emoji { font-size:48px; line-height:1; }
.lc-welcome__t { font-size:16px; font-weight:700; color:var(--lc-text); margin-top:6px; }
.lc-welcome__s { font-size:12px; color:var(--lc-text3); margin-bottom:12px; }
.lc-cats { display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; max-width:340px; }
.lc-cat { display:flex; align-items:center; gap:10px; padding:12px; border-radius:10px; cursor:pointer;
  text-align:left; border:1px solid; background:none; }
.lc-cat__ico { font-size:20px; line-height:1; flex:0 0 auto; }
.lc-cat__t { flex:1; font-size:11px; font-weight:600; color:var(--lc-text); }
.lc-cat__chev { color:var(--lc-text3); } .lc-cat__chev svg{ width:14px; height:14px; }
.lc-cat.deposit { background:var(--lc-green-bg); border-color:#1a3520; }
.lc-cat.withdrawal { background:var(--lc-red-bg); border-color:#3a1515; }
.lc-cat.bonus { background:var(--lc-gold-bg); border-color:var(--lc-gold-border); }
.lc-cat.account { background:var(--lc-blue-bg); border-color:#1a2535; }

/* ── messages ── */
.lc-msgs { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; display:flex;
  flex-direction:column; gap:8px; padding:12px; background:var(--lc-surface); }
.lc-sys { align-self:center; font-size:8px; color:var(--lc-text4); text-align:center; padding:2px 0; }
.lc-row { display:flex; gap:8px; max-width:84%; }
.lc-row.agent { align-self:flex-start; }
.lc-row.player { align-self:flex-end; flex-direction:row-reverse; }
.lc-av { width:24px; height:24px; flex:0 0 24px; border-radius:7px;
  background:linear-gradient(135deg,var(--lc-gold),#b97a10); display:flex; align-items:center;
  justify-content:center; font-size:13px; }
.lc-bub { padding:8px 11px; }
.lc-row.agent .lc-bub { background:var(--lc-surface3); border:1px solid var(--lc-border);
  border-radius:4px 12px 12px 12px; }
.lc-row.player .lc-bub { background:linear-gradient(135deg,#1f1a0d,#2a2208);
  border:1px solid var(--lc-gold-border); border-radius:12px 4px 12px 12px; }
.lc-bub__name { font-size:8px; color:var(--lc-gold); margin-bottom:3px; }
.lc-bub__txt { font-size:10px; color:#ddd; line-height:1.6; white-space:pre-wrap; word-break:break-word; }
.lc-bub__img { max-width:160px; border-radius:8px; display:block; cursor:pointer; }
.lc-bub__meta { font-size:7px; color:var(--lc-text4); margin-top:3px; display:flex; align-items:center;
  gap:3px; justify-content:flex-end; }
.lc-bub__meta svg { width:10px; height:10px; }
.lc-bub__meta .read { color:var(--lc-gold); }
.lc-typing { align-self:flex-start; display:flex; gap:8px; align-items:center; }
.lc-typing__dots { background:var(--lc-surface3); border:1px solid var(--lc-border);
  border-radius:12px; padding:9px 12px; display:flex; gap:4px; }
.lc-typing__dots span { width:6px; height:6px; border-radius:50%; background:var(--lc-text3);
  animation:lc-bounce 1.2s infinite; }
.lc-typing__dots span:nth-child(2){ animation-delay:.2s; } .lc-typing__dots span:nth-child(3){ animation-delay:.4s; }
@keyframes lc-bounce { 0%,60%,100%{ transform:translateY(0); opacity:.4; } 30%{ transform:translateY(-4px); opacity:1; } }

/* ── quick replies bar ── */
.lc-quick { flex-shrink:0; display:flex; gap:5px; overflow-x:auto; padding:6px 12px;
  background:var(--lc-surface); -webkit-overflow-scrolling:touch; }
.lc-quick::-webkit-scrollbar { display:none; }
.lc-chip { flex:0 0 auto; font-size:9px; font-weight:600; padding:6px 11px; border-radius:20px;
  background:var(--lc-surface2); border:1px solid var(--lc-border); color:var(--lc-text2);
  cursor:pointer; white-space:nowrap; }

/* ── input ── */
.lc-input { flex-shrink:0; display:flex; align-items:center; gap:8px; padding:8px 12px 12px;
  background:#0e0f14; border-top:1px solid var(--lc-border2); }
.lc-input__img { width:30px; height:30px; flex:0 0 30px; border-radius:8px; background:var(--lc-surface2);
  border:1px solid var(--lc-border); color:var(--lc-text3); display:flex; align-items:center;
  justify-content:center; cursor:pointer; } .lc-input__img svg{ width:16px; height:16px; }
.lc-input__box { flex:1; background:var(--lc-surface2); border:1px solid var(--lc-border); border-radius:10px;
  padding:8px 12px; font-size:11px; color:var(--lc-text); outline:none; }
.lc-input__box::placeholder { color:var(--lc-text4); }
.lc-input__box:focus { border-color:#e8a12460; }
.lc-input__send { width:30px; height:30px; flex:0 0 30px; border-radius:8px; background:var(--lc-gold);
  border:none; color:#0b0c10; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.lc-input__send:disabled { background:var(--lc-border); color:var(--lc-text4); cursor:not-allowed; }
.lc-input__send svg { width:16px; height:16px; }

/* ── closed state ── */
.lc-ended { flex-shrink:0; padding:14px 12px calc(14px + env(safe-area-inset-bottom,0px)); text-align:center;
  background:#0e0f14; border-top:1px solid var(--lc-border2); }
.lc-ended__t { font-size:11px; color:var(--lc-text3); margin-bottom:10px; }
.lc-stars { display:flex; gap:6px; justify-content:center; margin-bottom:12px; }
.lc-star { font-size:26px; cursor:pointer; color:var(--lc-text4); line-height:1; }
.lc-star.on { color:var(--lc-gold); }
.lc-newchat { width:100%; padding:11px; border-radius:10px; background:transparent;
  border:1px solid var(--lc-gold); color:var(--lc-gold); font-size:13px; font-weight:700; cursor:pointer; }
.lc-toast { position:fixed; left:50%; bottom:96px; transform:translateX(-50%); background:#1a1d27;
  color:#fff; font-size:12px; padding:9px 16px; border-radius:10px; z-index:100002;
  box-shadow:0 8px 24px rgba(0,0,0,.4); }