/* ===== ПЛАВАЮЩИЙ ЧАТ (ЛЕНДИНГ) ===== */
#supBtn{position:fixed;right:22px;bottom:22px;z-index:300;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#41dccd,#2fb9d6);color:#03222b;display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 10px 30px rgba(62,211,197,.35);cursor:pointer;border:none}
#supBox{position:fixed;right:22px;bottom:90px;z-index:300;width:min(360px,calc(100vw - 32px));height:480px;max-height:70vh;background:#0a1728;border:1px solid rgba(151,183,214,.28);border-radius:16px;display:none;flex-direction:column;overflow:hidden}
#supBox.show{display:flex}
#supHead{padding:12px 14px;background:#0d1d33;font-weight:700;font-size:14px;display:flex;justify-content:space-between;align-items:center}
#supHead button{background:none;border:none;color:#8ea3b8;cursor:pointer;font-size:14px}
#supMsgs{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.sup-m{max-width:85%;padding:8px 10px;border-radius:12px;font-size:13px;line-height:1.45;word-break:break-word}
.sup-m.user{align-self:flex-end;background:rgba(62,211,197,.15);border:1px solid rgba(62,211,197,.35)}
.sup-m.admin{align-self:flex-start;background:#0d1d33;border:1px solid rgba(151,183,214,.2)}
.sup-m a{color:#3ed3c5}
#supFoot{display:flex;gap:8px;padding:10px;border-top:1px solid rgba(151,183,214,.14)}
#supInput{flex:1;background:rgba(5,11,21,.7);border:1px solid rgba(151,183,214,.28);border-radius:10px;padding:10px;color:#e9f1f8;font-size:13px;outline:none;resize:none;height:40px;font-family:inherit}
#supSendBtn{border:none;border-radius:10px;padding:0 14px;background:linear-gradient(135deg,#41dccd,#2fb9d6);color:#03222b;font-weight:700;cursor:pointer}
#supFileBtn{border:none;border-radius:10px;padding:0 12px;background:#0d1d33;color:#8ea3b8;cursor:pointer}
/* ===== ВКЛАДКА ПОДДЕРЖКИ (КАБИНЕТ) ===== */
.sup-card{padding:0;overflow:hidden;display:flex;flex-direction:column;height:calc(100vh - 220px);min-height:420px}
.sup-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);background:rgba(13,29,51,.5)}
.sup-ava{width:40px;height:40px;border-radius:50%;border:1px solid rgba(62,211,197,.5);object-fit:cover}
.sup-head b{display:block;font-size:14px}
.sup-head span{font-size:11.5px;color:var(--dim)}
.sup-list{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.supm{display:flex;gap:10px;max-width:75%}
.supm .m-ava{width:30px;height:30px;border-radius:50%;flex:0 0 auto;object-fit:cover;border:1px solid rgba(62,211,197,.4)}
.supm .m-bub{padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.5;word-break:break-word;white-space:pre-wrap}
.supm.admin .m-bub{background:rgba(13,29,51,.9);border:1px solid var(--line2)}
.supm.user{align-self:flex-end;flex-direction:row-reverse}
.supm.user .m-bub{background:rgba(62,211,197,.14);border:1px solid rgba(62,211,197,.35)}
.supm a{color:var(--accent)}
.sup-empty{color:var(--dim);font-size:13px;text-align:center;margin:auto}
.sup-inputrow{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);background:rgba(5,11,21,.5);align-items:center}
.sup-inputrow textarea{flex:1;background:rgba(5,11,21,.7);border:1px solid var(--line2);border-radius:10px;padding:10px 12px;color:var(--text);font-size:13.5px;outline:none;resize:none;height:42px;font-family:var(--body)}
.sup-inputrow textarea:focus{border-color:var(--accent)}
.sup-m{white-space:pre-wrap}э
#supBox{width:min(420px,calc(100vw - 32px));height:min(600px,80vh)}
.sup-text{white-space:pre-wrap;word-break:break-word}
.sup-text.collapsed{max-height:6.4em;overflow:hidden}   /* ~4 строки */
.sup-expand{border:none;background:none;color:#3ed3c5;font-size:11.5px;padding:2px 0;cursor:pointer}
/* современный тонкий скролл вместо белой полосы */
.sup-list, #supMsgs{scrollbar-width:thin;scrollbar-color:rgba(62,211,197,.35) transparent}
.sup-list::-webkit-scrollbar, #supMsgs::-webkit-scrollbar{width:6px}
.sup-list::-webkit-scrollbar-track, #supMsgs::-webkit-scrollbar-track{background:transparent}
.sup-list::-webkit-scrollbar-thumb, #supMsgs::-webkit-scrollbar-thumb{background:rgba(62,211,197,.3);border-radius:999px}
.sup-list::-webkit-scrollbar-thumb:hover, #supMsgs::-webkit-scrollbar-thumb:hover{background:rgba(62,211,197,.5)}
.sup-inputrow textarea{overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(62,211,197,.3) transparent}
.sup-inputrow textarea::-webkit-scrollbar{width:4px}
.sup-inputrow textarea::-webkit-scrollbar-thumb{background:rgba(62,211,197,.3);border-radius:999px}