#lc-visitor, .lc-staff { --lc-brand:#6259d9; --lc-line:#e6e8ef; --lc-text:#20243a; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
#lc-visitor *, .lc-staff * { box-sizing:border-box; }
#lc-visitor { position:fixed; left:20px; bottom:20px; z-index:2147483000; color:var(--lc-text); }
#lc-visitor [hidden], .lc-staff [hidden] { display:none!important; }
.lc-bubble { width:58px; height:58px; border:0; border-radius:50%; color:#fff; background:var(--lc-brand); box-shadow:0 8px 28px #20243a55; display:grid; place-items:center; cursor:pointer; position:relative; animation:lc-bubble-enter .5s cubic-bezier(.2,1.4,.45,1) backwards; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.lc-bubble:hover, .lc-bubble:focus-visible { background:#5148c6; transform:translateY(-3px) scale(1.06); box-shadow:0 12px 30px #20243a66; }
.lc-badge { position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 4px; border-radius:10px; display:grid; place-items:center; background:#d92d20; color:#fff; font-size:11px; font-weight:700; border:2px solid #fff; }
.lc-badge:not([hidden]) { animation:lc-badge-pulse 1.8s ease-in-out infinite; }
.lc-window { position:absolute; left:0; bottom:70px; width:min(370px,calc(100vw - 32px)); height:min(550px,calc(100vh - 110px)); background:#fff; border-radius:16px; box-shadow:0 14px 45px #20243a55; overflow:hidden; display:flex; flex-direction:column; }
.lc-window:not([hidden]) { animation:lc-window-enter .25s cubic-bezier(.2,.8,.2,1) both; transform-origin:bottom left; }
.lc-visitor-head { display:flex; justify-content:space-between; align-items:center; padding:17px 19px; background:var(--lc-brand); color:#fff; }
.lc-visitor-head strong { display:block; font-size:16px; }.lc-visitor-head small { display:block; opacity:.9; font-size:12px; }
.lc-hide { border:0; background:transparent; color:#fff; font-size:27px; line-height:1; cursor:pointer; }
.lc-visitor-content { flex:1; display:flex; flex-direction:column; min-height:0; padding:16px; }
.lc-intro { overflow:auto; }.lc-intro p { margin:0 0 12px; }.lc-create { display:grid; gap:10px; }
.lc-create label { display:grid; gap:4px; font-size:13px; font-weight:600; }
#lc-visitor input, #lc-visitor textarea, .lc-staff textarea { width:100%; padding:9px 10px; border:1px solid var(--lc-line); border-radius:8px; color:var(--lc-text); background:#fff; resize:vertical; }
#lc-visitor button[type=submit], .lc-new { border:0; border-radius:8px; padding:10px 13px; background:var(--lc-brand); color:#fff; cursor:pointer; font-weight:600; }
#lc-visitor button:disabled, .lc-staff button:disabled { opacity:.6; cursor:wait; }
.lc-chat { flex:1; display:flex; flex-direction:column; min-height:0; }.lc-topic { padding:0 0 10px; border-bottom:1px solid var(--lc-line); display:flex; flex-direction:column; align-items:flex-start; gap:3px; }
.lc-topic-title { font-size:14px; line-height:1.3; }.lc-staff-time { font-size:12px; color:#626a80; }
.lc-alerts { border:0; background:transparent; color:var(--lc-brand); font-size:12px; font-weight:600; padding:3px 0; cursor:pointer; text-align:left; }.lc-alerts:hover,.lc-alerts:focus-visible { text-decoration:underline; }
.lc-alert-hint { font-size:11px; color:#6e7485; }
.lc-messages { flex:1; overflow:auto; min-height:100px; padding:12px 3px; display:flex; flex-direction:column; gap:10px; }
.lc-message { max-width:85%; padding:9px 12px; border-radius:12px; background:#f0f1f7; overflow-wrap:anywhere; white-space:pre-wrap; display:flex; flex-direction:column; gap:3px; animation:lc-message-enter .22s ease-out both; }
.lc-message small { font-weight:700; font-size:11px; opacity:.7; }.lc-message span { font-size:14px; }
.lc-from-staff { align-self:flex-end; color:#fff; background:var(--lc-brand); }
.lc-compose, .lc-send { display:flex; gap:8px; border-top:1px solid var(--lc-line); padding-top:10px; align-items:end; }
.lc-send textarea { flex:1; }.lc-closed { padding-top:10px; }.lc-closed p { margin:0 0 8px; }
.lc-error { color:#b42318; font-size:13px; margin:8px 0 0; }.lc-visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.lc-blocked-note { margin:8px 0 0; padding:10px; border-radius:8px; color:#7a271a; background:#fef3f2; font-size:13px; }
.lc-availability-note { margin:8px 0 0; padding:10px; border-radius:8px; color:#344054; background:#f2f4f7; font-size:13px; }
.lc-staff { display:grid; grid-template-columns:minmax(240px,300px) minmax(0,1fr); height:min(690px,calc(100vh - 210px)); min-height:430px; background:#fff; color:var(--lc-text); border:1px solid var(--lc-line); border-radius:12px; overflow:hidden; }
.lc-staff-list { border-right:1px solid var(--lc-line); min-height:0; display:flex; flex-direction:column; }.lc-staff-list-head { padding:16px; border-bottom:1px solid var(--lc-line); }
.lc-tabs { display:flex; margin-top:10px; gap:6px; }.lc-tabs button { border:1px solid var(--lc-line); background:#fff; border-radius:7px; padding:5px 9px; cursor:pointer; }.lc-tabs button.active { color:#fff; border-color:var(--lc-brand); background:var(--lc-brand); }
.lc-list { overflow:auto; }.lc-list-item { width:100%; padding:12px 16px; display:grid; gap:3px; text-align:left; border:0; border-bottom:1px solid var(--lc-line); background:#fff; cursor:pointer; color:var(--lc-text); }.lc-list-item.active,.lc-list-item:hover { background:#f3f2ff; }.lc-list-item span { font-size:13px; }.lc-list-item small { opacity:.65; }.lc-empty { padding:16px; }
.lc-staff-thread { min-width:0; min-height:0; display:flex; flex-direction:column; padding:16px; }.lc-thread-head { display:flex; justify-content:space-between; align-items:start; gap:8px; border-bottom:1px solid var(--lc-line); padding-bottom:13px; }.lc-thread-head small { display:block; margin-top:3px; opacity:.65; }.lc-thread-actions { display:flex; gap:6px; }
.lc-moderation { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:10px 0; border-bottom:1px solid var(--lc-line); font-size:13px; }.lc-moderation select { width:auto; max-width:130px; }
.lc-staff .lc-messages { padding:16px 2px; }.lc-staff .lc-compose textarea { flex:1; }.lc-staff .lc-compose button { white-space:nowrap; }
@keyframes lc-bubble-enter { from { opacity:0; transform:translateY(18px) scale(.75); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes lc-window-enter { from { opacity:0; transform:translateY(12px) scale(.94); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes lc-message-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes lc-badge-pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.12); } }
@media (prefers-reduced-motion:reduce) { #lc-visitor *, .lc-staff * { animation:none!important; transition:none!important; } }
@media (max-width:650px) { #lc-visitor { left:12px; bottom:12px; }.lc-staff { grid-template-columns:1fr; height:720px; }.lc-staff-list { max-height:230px; border-right:0; border-bottom:1px solid var(--lc-line); }.lc-thread-actions { flex-wrap:wrap; justify-content:flex-end; } }
