/*-------------------------- крис -------------------------*/
[data-user-id="57"] {

/* Основной блок */
.sns {
    background: linear-gradient(180deg, #fcfcfc, #ebf1da);
    box-shadow: 0 2px 2px rgba(20, 30, 30, 0.12);
}

/* Шапка чата */
.sns chat-header {
    background: rgb(202 215 164 / 40%);
    backdrop-filter: blur(3px);
    border: 1px solid #ffffff85;
}

/* Имя пользователя */
.sns usrnm {
    color: #404040;
}

/* Статус */
.sns stts {
    color: rgb(var(--c_gnrl_2));
}

/* Сообщения */
.sns msg {
    background: #fff;
    box-shadow: 0 2px 2px rgba(12, 20, 20, 0.06);
    color: #333;
}

/* Свои сообщения (справа) */
.sns msg[right] {
    background: linear-gradient(180deg, #d7e7d5, #99a863);
}

/* Поле ввода */
.sns txtit {
    background: #ffffff87;
    backdrop-filter: blur(3px);
    border: 1px solid #ffffff85;
    box-shadow: 0 8px 20px rgb(211 221 198);
    color: #0e0e0e;
}

.sns txtit::after {
    background: linear-gradient(180deg, #d3e3ce, #a0af70);
    color: rgb(255 255 255);
}

/* Скроллбар */
.sns .chat-messages::-webkit-scrollbar-thumb {
    background: #dff3f3;
}

/* Аудио сообщения */
gs::before {
    background: #92a263;
    color: white;
}

gs:hover::before {
    background: #72785f;
}

gs::after {
    background-image: repeating-linear-gradient(to right, #92a263 0px, #383838 2px, transparent 2px, transparent 4px);
}

.sns gs span {
    color: #333;
}

/* Цитаты */
.sns msg msg_q {
    background: #ffffff29;
    border-left: 2px solid rgb(var(--c_gnrl));
    color: #585151;
}

.sns msg msg_q name_q {
    color: rgb(var(--c_gnrl));
}

/* Блокировка */
.sns .blokm:after {
    color: #e36d6d;
}

.sns blok {
    background: #ffffff;
}

/* Пересланные сообщения */
.sns .resnd {
    background: #fff!important;
}

.sns r_resend,
.sns l_resend {
    color: rgb(var(--c_gnrl_2));
}

.sns .resnd:after {
    color: rgb(155 165 126);
}

/* Кружочки */
msg[circle]::after {
    background: url("data:image/svg+xml;utf8,\
    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' transform='rotate(-90 0 0)'>\
    <circle cx='50' cy='50' r='48' fill='none' stroke='rgba(255,255,255,0.15)' stroke-width='4'/>\
    <circle cx='50' cy='50' r='48' fill='none' stroke='rgba(255,255,255,0.4)' stroke-width='3' stroke-linecap='round'\
    stroke-dasharray='302' stroke-dashoffset='0'>\
    <animate attributeName='stroke-dashoffset' values='302;0' dur='10s' repeatCount='indefinite'/>\
    </circle></svg>") center/contain no-repeat;
}

msg[circle]::before {
    color: #555;
    background: white;
}

/* Индикатор спойлера */
.spoiler-indicator {
    background: rgb(255, 255, 255, 1);
    color: #333;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.spoiler-indicator::after {
    background: #1a1a1a;
    color: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

msg[left][circle]:hover .spoiler-indicator {
    background: #f1f1f1;
}

/* === ТЕМНАЯ ТЕМА === */
.dark .sns {
    background: linear-gradient(180deg, #31353e, #24272e);
}

.dark .sns chat-header {
    background: rgb(36 39 46 / 30%);
    backdrop-filter: blur(3px);
    border: 1px solid #28282885;
}

.dark .sns usrnm {
    color: rgba(255, 255, 255, 0.9);
}

.dark .sns stts {
    color: rgba(var(--c_lightbrown), 0.9);
}

.dark .sns msg {
    background: #393d46;
    color: rgba(255, 255, 255, 0.85);
}

.dark .sns msg[right] {
    background: linear-gradient(180deg, #3b4b5c, #25282f);
}

.dark .sns txtit {
    background: #33363c82;
    backdrop-filter: blur(3px);
    border: 1px solid #5c5c5c85;
    color: #f1f1f1;
    box-shadow: 0 8px 20px rgb(29 31 36);
}

.dark txtit::after {
    background: linear-gradient(180deg, rgb(var(--dark_c_darkgray)), rgb(var(--dark_c_gnrl)));
    color: rgb(255, 255, 255, 0.9);
}

.dark .sns .chat-messages::-webkit-scrollbar-thumb {
    background: rgb(var(--c_lightbrown));
}

.dark gs::before {
    background: rgb(var(--dark_c_gnrl));
}

.dark gs:hover::before {
    background: rgb(var(--dark_c_gnrl_2));
}

.dark gs::after {
    background-image: repeating-linear-gradient(to right, rgb(var(--c_lightbrown)) 0px, rgb(var(--dark_c_gnrl)) 2px, transparent 2px, transparent 4px);
}

.dark .sns gs span {
    color: rgb(255, 255, 255, 0.8);
}

.dark .sns msg msg_q {
    background: rgb(var(--dark_c_lightgray) / 50%);
    border-left-color: rgb(var(--c_lightbrown));
    color: #fff;
}

.dark .sns msg msg_q name_q {
    color: rgb(var(--c_lightbrown));
}

.dark .sns blok {
    background: rgb(var(--dark_c_lightgray));
    color: rgb(255, 255, 255, 0.8);
}

.dark .sns .resnd {
    background: rgb(var(--dark_c_lightgray)) !important;
}

.dark .sns r_resend,
.dark .sns l_resend {
    color: rgb(var(--c_lightbrown));
}

.dark .sns .resnd:after {
    color: rgba(var(--dark_c_gnrl), 0.8);
}

.dark msg[circle]::before {
    color: #f1f1f1;
    background: #444;
}

} 
/* === крис конец === */


/*-------------------------- вернон -------------------------*/
[data-user-id="37"] {


/* Основной блок - теперь с картинкой фона */
.sns {
    background: url('https://i.pinimg.com/originals/47/26/b5/4726b59f06c9fed1d2a0c1da6df5b136.gif') center repeat;
}

/* Шапка чата */
.sns chat-header {
    background: rgb(255 200 50 / 70%);
    backdrop-filter: blur(5px);
    border: 2px solid #ff00ff;
}

/* Имя пользователя */
.sns usrnm {
    color: #ff1493;
    font-size: 14px;
}

/* Статус */
.sns stts {
    color: #00ffff;
    text-shadow: 0 0 3px black;
}

/* Сообщения */
.sns msg {
    background: #ffff00;
    box-shadow: 5px 5px 0 rgba(255, 0, 0, 0.5);
    color: #0000ff;
    border: 1px solid red;
}

/* Свои сообщения (справа) */
.sns msg[right] {
    background: linear-gradient(45deg, #ff0000, #ff8800, #ffff00);
    color: white;
}

/* Поле ввода */
.sns txtit {
    background: rgba(0, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    border: 3px dashed #ff00ff;
    box-shadow: 0 0 20px rgb(255, 255, 0);
    color: #ff0000;
    font-weight: bold;
}

.sns txtit::after {
    background: linear-gradient(135deg, #ff0000, #00ff00, #0000ff);
    color: black;
    font-weight: bold;
}

/* Скроллбар */
.sns .chat-messages::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, red, orange, yellow, green, blue, indigo, violet);
    border-radius: 10px;
}

/* Аудио сообщения */
gs::before {
    background: #ff00ff;
    color: #00ff00;
    box-shadow: 0 0 10px cyan;
}

gs:hover::before {
    background: #00ff00;
    color: #ff00ff;
}

gs::after {
    background-image: repeating-linear-gradient(to right, #ff0000 0px, #00ff00 2px, #0000ff 2px, #ffff00 4px);
}

.sns gs span {
    color: #ffaa00;
    background: rgba(0,0,0,0.5);
    padding: 3px;
}

/* Цитаты */
.sns msg msg_q {
    background: rgba(255, 192, 203, 0.8);
    border-left: 5px solid #ff00ff;
    color: #800080;
    font-style: italic;
}

.sns msg msg_q name_q {
    color: #ff4500;
    text-transform: uppercase;
}

/* Блокировка */
.sns .blokm:after {
    color: #ff0000;
    font-size: 20px;
}

.sns blok {
    background: #ffa500;
    color: #00008b;
    border: 2px dotted white;
}

/* Пересланные сообщения */
.sns .resnd {
    background: #ff69b4 !important;
    border-radius: 5px;
}

.sns r_resend,
.sns l_resend {
    color: #ffd700;
    font-weight: bold;
}

.sns .resnd:after {
    color: #00ff00;
    font-size: 15px;
}

/* Кружочки */

msg[circle]::before {
    color: #ffff00;
    background: #8a2be2;
    border: 2px solid cyan;
}

/* Индикатор спойлера */
.spoiler-indicator {
    background: rgb(255, 0, 255);
    color: #ffff00;
    box-shadow: 0 0 15px rgb(0, 255, 255);
    border: 1px solid white;
}

.spoiler-indicator::after {
    background: #000000;
    color: #ffaa00;
    box-shadow: 0 0 10px red;
}

msg[left][circle]:hover .spoiler-indicator {
    background: #00ff00;
    transform: scale(1.5);
}

/* === ТЕМНАЯ ТЕМА (тоже изменена для теста) === */
.dark .sns {
    background: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=400&h=600&fit=crop') center/cover no-repeat;
}

.dark .sns chat-header {
    background: rgb(128 0 128 / 70%);
    backdrop-filter: blur(5px);
    border: 2px solid #ffaa00;
}

.dark .sns usrnm {
    color: #ffaa00;
    text-shadow: 0 0 5px black;
}

.dark .sns stts {
    color: #00ffff;
}

.dark .sns msg {
    background: #800080;
    color: #ffff00;
    border: 2px solid cyan;
}

.dark .sns msg[right] {
    background: linear-gradient(180deg, #006400, #228b22, #32cd32);
    color: white;
}

.dark .sns txtit {
    background: rgba(75, 0, 130, 0.9);
    backdrop-filter: blur(8px);
    border: 2px solid #ffd700;
    color: #ffffff;
    box-shadow: 0 0 30px rgb(255, 215, 0);
}

.dark txtit::after {
    background: linear-gradient(180deg, #ff0000, #ffd700);
    color: black;
}

.dark .sns .chat-messages::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, purple, pink);
}

.dark gs::before {
    background: #ff4500;
}

.dark gs:hover::before {
    background: #ff69b4;
}

.dark gs::after {
    background-image: repeating-linear-gradient(to right, #ffaa00 0px, #ff4500 2px, #ff1493 2px, #ff00ff 4px);
}

.dark .sns gs span {
    color: rgb(255, 255, 0);
    background: rgba(128, 0, 128, 0.5);
}

.dark .sns msg msg_q {
    background: rgba(255, 255, 0, 0.3);
    border-left-color: #ff00ff;
    color: #ffffff;
}

.dark .sns msg msg_q name_q {
    color: #ffaa00;
}

.dark .sns blok {
    background: #4b0082;
    color: #ffffff;
}

.dark .sns .resnd {
    background: #8b008b !important;
}

.dark .sns r_resend,
.dark .sns l_resend {
    color: #ffaa00;
}

.dark .sns .resnd:after {
    color: #00ff7f;
}

.dark msg[circle]::before {
    color: #000000;
    background: #7fff00;
    border: 2px solid magenta;
}

} 
/* === end вернон === */

