/* тело документа */

body {color:#000000; background:#005db559; font:12px Verdana; }
/* выравнивание */
input, select {vertical-align:middle; margin:0px;}
img {vertical-align:middle; border:0px;}

/* ссылки  */
a,a:active{color:#ff0000; font: bold 15px Verdana; text-decoration: none;}
a:hover{text-decoration: underline;}

/* таблицы */
table { border:1px #7897BB solid; border-collapse:collapse;}
td {color:#d77d31 ; background-color:#f3f3f3; font: 12px Verdana; padding:4px; border:1px #7897BB solid; }



/* кнопки, текстовые поля и селекторы */
input, select, textarea {margin-bottom: 2px; padding:4px 4px; border:1px #4169E1 solid;font-weight:bolder; border-radius:5px;background: linear-gradient(to top left, #4169E1,#4169E1);}
button, input, select, textarea {margin-bottom: 7px;}
input[type=checkbox] {vertical-align:middle;width:18px; height:18px; border:0px;box-shadow: 2px 2px 2px #000080;}
input[type=button], input[type=submit] {cursor:pointer;font: 12px Georgia; font-weight:bolder; padding:5px 7px; color:#000000; border-radius:7px;  border: 1px solid #000000;  background: linear-gradient(to bottom, #4169E1,#4169E1);}
input[type=button]:hover, input[type=submit]:hover { background: linear-gradient(to bottom,#B45F04 , #B45F04);}
input[type=button]::-moz-focus-inner, input[type=submit]::-moz-focus-inner {border:0; padding:0;} /* FF fix padding */
.text1 {color: #000000; font: 14px Georgia; font-weight:bolder; background: #FFFFFF; border: 1px solid #000000; ;border-radius: 7px; box-shadow: 0px 0px 3px #FF9800; width:97px; height:26px; cursor: pointer;}
.text2 {color: #000000; font: 15px Georgia; font-weight:bolder; background: #ff8400a3, #9e9e9e;border:0px; border-radius: 7px; border: 1px solid #730400; width:80px; height:26px; cursor: pointer;}
.text3 {color: #000000; font: 14px Georgia; font-weight:bolder; background: #ff980091; border: 0px solid #000000; border-radius: 7px; box-shadow: 0px 0px 3px #000000; width:73px; cursor: pointer;}
.text4 {color: #000000; font: 14px Georgia; font-weight:bolder; background: #ffe397; border: 1px solid #841100 ;border-radius: 7px; box-shadow: 0px 0px 3px #000000;width:83px; height:21px;}






/* иконка выбора файла для загрузки */
.file {vertical-align:middle; display:inline-block; overflow:hidden; width:16px; height:16px; background-image:url(//mpchat.com/blank/img/image.png);}
.file input {cursor:pointer; width:16px; height:16px;	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}

/* стиль заголовка таблицы .title */
.title   {color:white; background-color:#78; font-weight:bold;}
.title a {color:white;}
.title a:active {color:white;}
.title a:hover {color:white;}
.low {color:gray; font: normal 11px Verdana;} 

/* стиль никлиста в фрейме участников для #id=users */
#users table {border:15px;background: #-;border-radius:8px;}
#users td {border:15px; }
#users a { font: normal 15px Verdana; }
#users td {border:2px;background: url(''); }

/* стиль выводимого смайла */
.sm {cursor:pointer;
height: auto; 
    width: auto; 
        max-width: 150px; 
    max-height: 150px;}

/* STYLESATOR */
.chat-body {
	background-image:url("/img/фон000.png");
        background-repeat: no-repeat;
        background-position: auto 20%;
        background-size: cover;
        background-attachment: fixed;

}


.info-body{background-image:url("/img/фон000.png");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        background-attachment: fixed;}
.admin-body {

       background-image:url("/img/фон000.png"); 
       
}

.gb-body { background:url("/img/фон000.png"); }
.adm-body { background:url("/img/фон000.png"); }
.smile-body { background:url("/img/фон000.png"); }
.post-body { background:url("/img/фон000.png"); }
.gallery-body { background:url("/img/фон000.png"); }
.love-body { background:url("/img/фон000.png"); }
.clan-body {background: url("/img/фон000.png"); }
.forum-body { background:url("---"); }
.shop-body {background:url("/img/фон000.png");

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
.set-body { background:url("/img/фон000.png"); }
}
.turn:hover {
    -moz-transform: rotate(360deg); /* Для Firefox */
    -ms-transform: rotate(360deg); /* Для IE */
    -webkit-transform: rotate(360deg); /* Для Safari, Chrome, iOS */
    -o-transform: rotate(360deg); /* Для Opera */
    transform: rotate(360deg);
-webkit-transition:all 2000ms;   
-moz-transition:all 2000ms;
-o-transition:all 2000ms;
transition:all 2000ms;  
}
.tablo_sb {
   background-color: #00BFFF;
   border: none;
   color: #00BFFF;
   padding: 3px;
   border-radius: 36px;
}
.chatu_sb {
   background-color: rgba(0,127,255,0.7);
   border: none;
   color: #00BFFF;
}
::-webkit-scrollbar {
  width: 8px;
  
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 10px #d77d31;
  border-radius: 8px;
  background: #00BFFF;
  margin: 5px 0;
}

::-webkit-scrollbar-thumb {
  background: #c0c0c0;
  border-radius: 8px;  
  box-shadow: inset 0 0 5px #0000ff;
}
::-webkit-scrollbar-thumb:hover { box-shadow: inset 0 0 10px #151414; }

::-webkit-scrollbar-button:hover { box-shadow: inset 0 0 3px #8a078a; background: pink;}


/* стиль админка  для #id=adm-body */
.adm-body table {color: #080889; font: 13px Verdana; background: #cfcfcf;font-weight:bold; border-radius : 5px; padding-left:3px; padding-right:3px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA; cursor: hand; }
.adm-body td { color: #080889; font: 13px Verdana; background: #cfcfcf;font-weight:bold; border-radius : 5px; padding-left:3px; padding-right:3px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA; cursor: hand; }
.adm-body textarea { background:#cfcfcf; color:#080889; cursor: pointer; font-family:Verdana; font-weight:bolder; }
.adm-body .text {color:#080889;background-color:#cfcfcf;border-radius : 5px; padding-left:0px; padding-right:0px; padding-top:4px; padding-bottom:1px;  box-shadow: 0 0 2px #20B2AA; border: 1px solid #20B2AA;font-weight:bold; cursor: hand; }
.adm-body select {color: #080889;border-radius : 5px; padding-left:2px; padding-right:1px; padding-top:3px; padding-bottom:1px;  box-shadow: 0 0 2px #20B2AA; border: 1px solid #20B2AA;font-weight:bold; cursor: hand; }

/* стиль настройки для #id=set-body */
.set-body table {color: #000000; font: 14px Arial Black; background: #D8B1BF; border-radius : 5px; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #B55489; border: 1px solid #131313; cursor: hand; }
.set-body td { color: #000000; font: 13px Arial Black; background: #F5F5DC; border-radius : 5px; padding-left:5px; padding-right:13px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #B55489; border: 1px solid #131313; cursor: hand; }
.set-body .text {background-color:#CAC4B0;color:#000000;cursor: pointer;font-family:Verdana;font-weight:bold;}
.set-body textarea {background-color:#CAC4B0;color:#000000;cursor: pointer;font-family:Verdana;font-weight:bold;}
.set-body a { color: #000000; font: bold 14px Arial Black; }

/* стиль магазин для #id=shop-body */
.shop-body table {color: #1c1c1c; font: 12px Verdana;font-weight:bolder;  background: #cfcfcf; border-radius : 6px; padding-left:6px; padding-right:6px; padding-top:6px; padding-bottom:6px;  box-shadow: 0 0 6px #20B2AA; border: 2px solid #20B2AA; cursor: hand;}
.shop-body td { color: #1c1c1c; font: 11px Verdana; font-weight:bolder; background: #cfcfcf; border-radius : 6px; padding-left:6px; padding-right:6px; padding-top:6px; padding-bottom:6px;  box-shadow: 0 0 6px #20B2AA; border: 2px solid #20B2AA; cursor: hand;}
.shop-body a { color: #1с1с1с; font: bold 14px Arial Black; }
.shop-body .text { color: #1с1с1с; font: 13px Arial Black; background: #cfcfcf; border-radius : 5px; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA; cursor: hand; }
.shop-body select { color: #1с1с1с; font: 13px Verdana; background: #cfcfcf; border-radius : 5px; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA; cursor: hand; }


/* ползунки */
::-webkit-scrollbar {width: 10px; height: 10px;}
::-webkit-scrollbar-track-piece {background-color: transparent;}
::-webkit-scrollbar-thumb:vertical:hover {background-color: #aaaaaa;} 
::-webkit-scrollbar-thumb:vertical:active {background-color: #aaaaaa;} 
::-webkit-scrollbar-thumb:vertical {height: 8px; background-color:#B0C4DE; border-radius:7px;} 
::-webkit-scrollbar-thumb:horizontal {width: 8px; background-color:#B0C4DE;}

/* стиль смайлы для #id=smile-body */
.smile-body table {color: #0000ff; font: 14px Verdana; background: #cfcfcf; border-radius : 5px; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA;font-weight:bolder; cursor: hand; }
.smile-body td { color: #0000ff; font: 14px Verdana; background: #cfcfcf; border-radius : 5px; padding-left:5px; padding-right:13px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA;font-weight:bolder; cursor: hand; }
.smile-body select { color: #0000ff; font: 14px Arial Black; background: #cfcfcf; border-radius : 5px; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;  box-shadow: 0 0 5px #20B2AA; border: 1px solid #20B2AA; width:220px; height:30px;cursor: hand; }
.smile-body textarea { background:#cfcfcf; color:#0000ff; cursor: pointer; font-family:Verdana; font-weight:bolder;}
.smile-body a,a:active{color:#0000ff; font: bold 14px Verdana; font-weight:bolder; text-decoration: none;}
.smile-body a:hover{color:#cd0000; font: bold 14px Verdana; font-weight:bolder; text-decoration: underline;}


/* ===== ОСНОВНЫЕ БЛОКИ ===== */
#leftdiv, #usersdiv, #privatdiv, #fastsmile, #bottomdiv, #topdiv {
    background: rgba(255, 255, 255, 0.20) !important;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(0, 40, 80, 0.12);
}

/* ===== ГОРИЗОНТАЛЬНЫЙ ЛЕЙАУТ НИКЛИСТА ===== */
/* Ячейка с ником — flex-контейнер для иконок в ряд */
#usersdiv tr[id^="!"] td:nth-child(2) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 3px !important;
    background: transparent !important;
    border: none !important;
    padding: 3px 2px !important;
}

/* Ник на всю ширину */
#usersdiv tr[id^="!"] td:nth-child(2) .nl-nick {
    width: 100% !important;
    text-align: center !important;
}


	
	/* Иконки в одну строку */
#usersdiv tr[id^="!"] td:nth-child(2) .nl-icons {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 100% !important;
}

/* Графический ник — десктоп 120px */
#usersdiv .gnick-img {
    max-width: 160px !important;
    max-height: 60px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
}

/* Статусная иконка справа (правая ячейка td:nth-child(3)) — 45px */
#usersdiv tr[id^="!"] td:nth-child(3) img {
    width: 37px !important;
    height: 37px !important;
    object-fit: contain !important;
    vertical-align: middle !important;
}

/* Иконки в блоке .nl-icons (пол, клан, анкета, статус ICQ, игнор, love/кольца) — 25px */
#usersdiv tr[id^="!"] td:nth-child(2) .nl-icons img {
    width: 25px !important;
    height: 25px !important;
    object-fit: contain !important;
    vertical-align: middle !important;
}

/* Убираем лишние фоны у ячеек никлиста */
#usersdiv tr[id^="!"] td,
#usersdiv tr[id] td[colspan],
#usersdiv tr[id] td[colspan] p {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Таблица никлиста — без фона и фиксированного layout */
#usersdiv table {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    table-layout: auto !important;
}


@media (max-width: 600px) {

    /* ===== ЛЕВЫЙ ФРЕЙМ ===== */
    #leftdiv {
        left: 0 !important;
        right: 0 !important;
        top: 36px !important;
        bottom: 40px !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 4px 0 4px 4px !important;
        transition: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        position: absolute !important;
    }


    /* Никлист открыт — сужаем справа */
    #leftdiv.users-open {
        right: 170px !important;
    }
    /* Смайлы открыты — сужаем слева */
    #leftdiv.smiles-open {
        left: 50px !important;
    }
    /* Обе открыты — сужаем с обеих сторон */
    #leftdiv.smiles-open.users-open {
        left: 50px !important;
        right: 170px !important;
    }
	
	   /* ===== ВЕРХНЯЯ И НИЖНЯЯ ПАНЕЛИ ===== */
    #topdiv, #bottomdiv {
        border-radius: 0 !important;
    }
    #topdiv { 
        height: 36px !important; 
        line-height: 36px !important; 
        padding: 0 4px !important; 
    }
    #bottomdiv { 
        height: 40px !important; 
        padding: 3px 4px !important; 
    }

   /* ===== ЭЛЕМЕНТЫ ВВОДА ===== */
    #bottomdiv input, #bottomdiv select, #bottomdiv button, .mp_record {
        height: 28px !important;
        min-height: 28px !important;
        max-height: 28px !important;
        line-height: 28px !important;
        padding: 0 6px !important;
        font-size: 11px !important;
        margin: 0 1px !important;
    }

    #bottomdiv input[type="text"], 
    #bottomdiv input[type="text1"], 
    #bottomdiv select {
        font-size: 11px !important;
        padding: 0 4px !important;
    }

    #bottomdiv input[type="button"][value="В"],
    #bottomdiv input[type="button"][value="Ж"],
    #bottomdiv input[type="button"][value="М"] {
        width: 26px !important;
        min-width: 26px !important;
        max-width: 26px !important;
        padding: 0 !important;
        font-size: 10px !important;
    }

    .mp_record { 
        width: 28px !important; 
        min-width: 28px !important; 
        max-width: 28px !important; 
        font-size: 13px !important;
        padding: 0 !important;
    }

    /* ===== МЕНЮ ===== */
    .ocean-btn {
        font-size: 10px !important;
        padding: 0 6px !important;
        height: 26px !important;
        min-height: 26px !important;
        max-height: 26px !important;
        line-height: 26px !important;
        gap: 3px;
    }
    .menu-icon { font-size: 13px; }

    .ocean-child { 
        min-width: 160px; 
        left: 0;
        transform: none;
    }
    .ocean-child a {
        height: 28px !important;
        min-height: 28px !important;
        max-height: 28px !important;
        line-height: 28px !important;
        padding: 0 10px !important;
        font-size: 11px !important;
        margin-bottom: 3px;
        border-radius: 20px !important;
    }
    .ocean-child a img { width: 16px; height: 16px; }

    #topdiv .center-menu { 
        margin: 0 2px; 
        gap: 2px; 
    }
    .ocean-icon-btn { 
        width: 28px; 
        height: 28px; 
        font-size: 14px; 
    }


  /* ===== РАДИО / ПЛЕЕРЫ ===== */
    #usersdiv iframe,
    #usersdiv audio,
    #usersdiv object,
    #usersdiv embed {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        box-sizing: border-box !important;
    }

    #usersdiv iframe[width],
    #usersdiv object[width],
    #usersdiv embed[width] {
        width: 100% !important;
        max-width: 100% !important;
    }

    #usersdiv div[id^="vplayer"] {
        max-width: 100% !important;
        width: 100% !important;
        overflow: hidden !important;
    }
    #usersdiv div[id^="vplayer"] iframe,
    #usersdiv div[id^="vplayer"] object,
    #usersdiv div[id^="vplayer"] embed,
    #usersdiv div[id^="vplayer"] > * {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }

    #usersdiv iframe[src*="radio.html"] {
        width: 100% !important;
        max-width: 100% !important;
        height: 160px !important;
    }

    #usersdiv table {
        max-width: 100% !important;
    }
    #usersdiv td {
        max-width: 100% !important;
        overflow: visible !important;
        word-break: break-word !important;
    }

    /* ===== ОБЁРТКА ДЛЯ IFRAME ПЛЕЕРА ===== */
    #usersdiv .radio-wrap {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        position: relative !important;
    }
    #usersdiv .radio-wrap iframe {
        transform-origin: top left !important;
        border: none !important;
        display: block !important;
    }


/* Масштабируем плеер под ширину никлиста */
    /* 360px: никлист 140px → scale(0.5) */
    @media (max-width: 360px) {
        #usersdiv .radio-wrap iframe[width] {
            transform: scale(0.5) !important;
            width: 280px !important;
            height: 200px !important;
        }
        #usersdiv .radio-wrap {
            height: 100px !important;
        }
    }

    /* 480px: никлист 160px → scale(0.57) */
    @media (min-width: 361px) and (max-width: 480px) {
        #usersdiv .radio-wrap iframe[width] {
            transform: scale(0.57) !important;
            width: 280px !important;
            height: 200px !important;
        }
        #usersdiv .radio-wrap {
            height: 114px !important;
        }
    }
	
	   /* 680px: никлист 170px → scale(0.6) */
    @media (min-width: 481px) and (max-width: 680px) {
        #usersdiv .radio-wrap iframe[width] {
            transform: scale(0.6) !important;
            width: 280px !important;
            height: 200px !important;
        }
        #usersdiv .radio-wrap {
            height: 120px !important;
        }
    }
	
	
	   /* ===== НИКЛИСТ — МОБИЛЬНЫЙ ===== */
    #usersdiv table {
        font-size: 10px !important;
        width: 100% !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        table-layout: auto !important;
    }
    #usersdiv td {
        padding: 2px 1px !important;
        font-size: 10px !important;
        line-height: 1.2;
        vertical-align: middle;
        background: transparent !important;
        border: none !important;
    }
    #usersdiv img {
        max-width: 100%;
        height: auto;
        vertical-align: middle;
    }
    #usersdiv a {
        font-size: 10px !important;
        word-break: break-all;
    }

    /* Графические ники — мобильный: уменьшены чтобы не обрезались */
    #usersdiv .gnick-img {
        max-width: 100px !important;
        max-height: 40px !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain;
    }
	
	    /* Графические ники в чате — уменьшаем на мобильном */
    #leftdiv .gnick-img {
        max-width: 130px !important;
        max-height: 50px !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
    }
}

   /* ===== МОБИЛЬНЫЕ РАЗМЕРЫ ИКОНОК В НИКЛИСТЕ ===== */
    /* Иконка привата (первая ячейка) — 36px мобильный */
       #usersdiv tr[id^="!"] td:first-child img {
        width: 25px !important;
        height: 25px !important;
        max-width: none !important;
    }
	
	/* ===== НИЖНЯЯ ПАНЕЛЬ — МОБИЛЬНАЯ (все элементы в 1 строку) ===== */
@media (max-width: 680px) {

    #bottomdiv {
        height: 40px !important;
        padding: 4px 4px !important;
        overflow: hidden !important;
        display: flex;
        align-items: center;
    }

    #bottomdiv form {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        margin: 0 !important;
        gap: 2px;
    }
    /* Поле ника — компактное */
    #bottomdiv input[name="tonick"] {
        width: 50px !important;
        min-width: 50px !important;
        padding: 0 2px !important;
        font-size: 10px !important;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Кнопки В, Ж, М — компактные круглые */
    #bottomdiv input[type="button"][value="В"],
    #bottomdiv input[type="button"][value="Ж"],
    #bottomdiv input[type="button"][value="М"] {
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        padding: 0 !important;
        font-size: 9px !important;
        border-radius: 50% !important;
    }

    #bottomdiv input, 
    #bottomdiv select, 
    #bottomdiv button {
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
        line-height: 30px !important;
        padding: 0 4px !important;
        font-size: 11px !important;
        margin: 0 !important;
        flex-shrink: 0;
    }

    /* Селектор cmd — компактный */
        #bottomdiv select[name="cmd"] {
        width: auto !important;
        min-width: 52px !important;
        max-width: 64px !important;
    }

    /* Селектор действий — компактный */
    #bottomdiv select[name="ddd"] {
        width: auto !important;
        min-width: 60px !important;
        max-width: 75px !important;
    }

    /* Поле ввода — растягивается */
    #bottomdiv input[name="text0"] {
        flex: 1 1 auto !important;
        min-width: 40px !important;
        width: auto !important;
        height: 30px !important;
    }

    /* Кнопка ОК — компактная */
        #bottomdiv input[type="submit"] {
        width: 23px !important;
        min-width: 23px !important;
        padding: 0px !important;
        text-align: center;
    }

    /* Иконки — квадратные, компактные */
    #bottomdiv button.mp_record,
    #bottomdiv button[type="button"] {
        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;
        padding: 0 !important;
        font-size: 14px !important;
    }
	
	   /* Разделители */
    #usersdiv tr[id] td[colspan] p,
    #usersdiv tr[id] td[colspan] {
        font-size: 11px !important;
        padding: 2px 0 !important;
        margin: 0 !important;
        line-height: 1.2;
        background: transparent !important;
        border: none !important;
    }

    #usersdiv tr[id] td[colspan] img {
        max-width: 50% !important;
        height: auto !important;
    }

    /* Иконки в .nl-icons (пол, клан, анкета, статус ICQ, игнор, love/кольца) — 26px мобильный */
            #usersdiv tr[id^="!"] td:nth-child(2) .nl-icons img {
        width: 20px !important;
        height: 20px !important;
        max-width: none !important;
    }
	
/* ===== ВСЕ ЭЛЕМЕНТЫ НИЖНЕГО ДИВА — ПК (увеличенные) ===== */
#bottomdiv input, #bottomdiv select, #bottomdiv .mp_record, #bottomdiv button {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    vertical-align: middle !important;
    margin: 0 3px !important;
}



/* Поле ввода сообщения — растянуто максимально */
#bottomdiv input[name="text0"] {
    flex: 1 1 auto !important;
    min-width: 200px !important;
    width: auto !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 16px !important;
    font-size: 14px !important;
}

/* Поле ника — увеличено */
#bottomdiv input[name="tonick"] {
    width: 85px !important;
    min-width: 85px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 8px !important;
    font-size: 13px !important;
    text-align: center;
}

/* Селектор cmd — увеличен */
#bottomdiv select[name="cmd"] {
    width: auto !important;
    min-width: 110px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 28px 0 12px !important;
    font-size: 13px !important;
}

/* Селектор действий — увеличен */
#bottomdiv select[name="ddd"] {
    width: auto !important;
    min-width: 100px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 28px 0 12px !important;
    font-size: 13px !important;
}

/* Кнопка ОК — увеличена */
#bottomdiv input[type="submit"] {
    width: 50px !important;
    min-width: 50px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: center;
}

/* Форма в нижнем диве — flex для растягивания */
#bottomdiv form {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    gap: 4px;
}

/* ===== ФИКС КОНТЕНТА В ЛЕВОМ ДИВЕ НА МОБИЛЬНОМ ===== */
@media (max-width: 600px) {
    #leftdiv table {
        max-width: 100% !important;
        word-break: break-word !important;
    }
    #leftdiv img {
        max-width: 100% !important;
        height: auto !important;
    }
    #leftdiv td {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
	

/* ===== НИЖНЯЯ ПАНЕЛЬ — ПК (увеличенная) ===== */
#bottomdiv {
    height: 56px !important;
    padding: 6px 10px !important;
    border-radius: 20px 20px 0 0;
    background: rgba(0, 80, 120, 0.15) !important;
    border-bottom: none;
    display: flex;
    align-items: center;
    overflow: hidden !important;
}

/* ===== ВЕРХНЯЯ ПАНЕЛЬ ===== */
#topdiv {
    height: 40px !important;
    line-height: 40px !important;
    border-radius: 0 0 20px 20px;
    background: rgba(0, 60, 100, 0.10) !important;
    padding: 0 10px !important;
    border-top: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#topdiv .left-icons { flex-shrink: 0; width: 40px; }
#topdiv .center-menu {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: center;
    flex: 1;
    margin: 0 10px;
}
#topdiv .right-icons { flex-shrink: 0; width: 40px; }


/* ===== МЕНЮ (верхняя панель) ===== */
.ocean-dropdown {
    position: relative;
    display: inline-block;
    z-index: 100;
    padding-bottom: 4px;
    margin-bottom: -4px;
}
.ocean-btn {
    background: linear-gradient(145deg, rgba(255,255,255,0.5), rgba(200,240,255,0.4)) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.7) !important;
    border-radius: 40px !important;
    padding: 0 16px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    font-size: 13px !important;
    font-weight: 600;
    color: #0b4a5a !important;
    text-shadow: 0 1px 2px rgba(255,255,255,0.5);
    box-shadow: 0 4px 16px rgba(0, 80, 120, 0.12), inset 0 1px 0 rgba(255,255,255,0.8);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.2px;
    white-space: nowrap;
}
.ocean-btn:hover {
    transform: translateY(-2px) scale(1.03);
    background: linear-gradient(145deg, rgba(255,255,255,0.7), rgba(180,240,255,0.55)) !important;
    box-shadow: 0 8px 28px rgba(26, 188, 156, 0.25), inset 0 1px 0 rgba(255,255,255,0.9);
    border-color: rgba(26, 188, 156, 0.5) !important;
    color: #0e6655 !important;
}
.menu-icon { font-size: 16px; line-height: 1; filter: drop-shadow(0 1px 1px rgba(0,0,0,0.1)); }

.ocean-child {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 180px;
    padding: 0;
    margin: 0;
    background: transparent !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
}
.ocean-dropdown:hover .ocean-child {
    display: block;
    opacity: 1;
    pointer-events: auto;
}
.ocean-child a {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    padding: 0 14px !important;
    margin-bottom: 4px;
    color: #fff !important;
    font-weight: 600;
    font-size: 12px !important;
    text-decoration: none;
    border-radius: 30px !important;
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 15px rgba(79, 172, 254, 0.4), inset 0 1px 0 rgba(255,255,255,0.3);
    transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
}
.ocean-child a::after {
    content: '';
    position: absolute;
    top: -50%; left: -50%;
    width: 200%; height: 200%;
    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.25) 50%, transparent 70%);
    transform: translateX(-100%) rotate(25deg);
    transition: transform 0.6s ease;
}
.ocean-child a:hover::after {
    transform: translateX(100%) rotate(25deg);
}
.ocean-child a:last-child { margin-bottom: 0; }
.ocean-child a img {
    width: 18px; height: 18px;
    object-fit: contain;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.2));
    transition: all 0.25s ease;
    flex-shrink: 0;
    border-radius: 3px;
}
.ocean-child a:hover {
    background: linear-gradient(135deg, #00c6fb 0%, #005bea 100%) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.6);
    transform: translateX(8px) scale(1.03);
    box-shadow: 0 8px 25px rgba(0, 198, 251, 0.5), 0 0 20px rgba(0, 198, 251, 0.2), inset 0 1px 0 rgba(255,255,255,0.4);
}
.ocean-child a:hover img {
    transform: scale(1.2) rotate(-8deg);
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}
.ocean-child a:active {
    transform: translateX(4px) scale(0.98);
    box-shadow: 0 2px 8px rgba(0, 198, 251, 0.3);
}


 /* ===== ПАНЕЛЬ ПОЛЬЗОВАТЕЛЕЙ ===== */
    #usersdiv {
        position: fixed !important;
        right: -170px !important;
        top: 36px !important;
        bottom: 40px !important;
        width: 170px !important;
        padding: 4px 2px !important;
        overflow-y: auto !important;
        overflow-x: visible !important;
        border-radius: 0 !important;
        margin: 0 !important;
        background: rgba(255, 255, 255, 0.30) !important;
        transition: none !important;
        z-index: 1000 !important;
        box-shadow: -2px 0 8px rgba(0,0,0,0.15) !important;
    }
    #usersdiv.open-users {
        right: 0 !important;
    }
	
	/* ===== КНОПКИ — ПК (увеличенные) ===== */
#bottomdiv input[type="button"], #bottomdiv input[type="submit"], #bottomdiv button, .mp_record {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 30px !important;
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.15);
    box-shadow: 0 4px 15px rgba(79, 172, 254, 0.35), inset 0 1px 0 rgba(255,255,255,0.3);
    transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    vertical-align: middle !important;
    margin: 0 3px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}
#bottomdiv input[type="button"]::after, #bottomdiv input[type="submit"]::after, #bottomdiv button::after, .mp_record::after {
    content: '';
    position: absolute;
    top: -50%; left: -50%;
    width: 200%; height: 200%;
    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.2) 50%, transparent 70%);
    transform: translateX(-100%) rotate(25deg);
    transition: transform 0.5s ease;
    pointer-events: none;
}
#bottomdiv input[type="button"]:hover::after, #bottomdiv input[type="submit"]:hover::after, #bottomdiv button:hover::after, .mp_record:hover::after {
    transform: translateX(100%) rotate(25deg);
}
#bottomdiv input[type="button"]:hover, #bottomdiv input[type="submit"]:hover, #bottomdiv button:hover, .mp_record:hover {
    transform: translateY(-1px) scale(1.02);
    background: linear-gradient(135deg, #00c6fb 0%, #005bea 100%) !important;
    box-shadow: 0 8px 25px rgba(0, 198, 251, 0.45), 0 0 20px rgba(0, 198, 251, 0.15), inset 0 1px 0 rgba(255,255,255,0.4);
}
#bottomdiv input[type="button"]:active, #bottomdiv input[type="submit"]:active, #bottomdiv button:active, .mp_record:active {
    transform: translateY(0) scale(0.98);
    box-shadow: 0 2px 8px rgba(79, 172, 254, 0.3);
}
/* Кнопки В, Ж, М — круглые, увеличенные */
#bottomdiv input[type="button"][value="В"], #bottomdiv input[type="button"][value="Ж"], #bottomdiv input[type="button"][value="М"] {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    padding: 0 !important;
    font-size: 13px !important;
    border-radius: 50% !important;
}
.mp_record {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 18px !important;
    line-height: 1 !important;
}
.mp_recording { animation: pulse-blue 1s infinite; }
@keyframes pulse-blue {
    0%, 100% { box-shadow: 0 0 0 0 rgba(79, 172, 254, 0.5); }
    50% { box-shadow: 0 0 0 8px rgba(79, 172, 254, 0); }
}

/* ===== СПИСОК ПОЛЬЗОВАТЕЛЕЙ (десктоп) ===== */
#usersdiv {
    position: absolute;
    width: 313px;
    top: 34px;
    right: 0px;
    bottom: 60px;
    padding: 5px;
    background: rgba(255, 255, 255, 0.22) !important;
    border-radius: 0 20px 20px 0;
    margin: 4px 4px 4px 0;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

/* ===== ЛЕВЫЙ ФРЕЙМ (сообщения) ===== */
#leftdiv {
    position: absolute;
    bottom: 60px !important;
    padding: 12px 10px !important;
    border-radius: 20px 0 0 20px;
    margin: 4px 0 4px 4px;
    background: rgba(255, 255, 255, 0.15) !important;
    left: 95px;
    right: 373px;
    top: 34px;
    overflow-y: scroll;
}

/* Иконка привата (первая ячейка td:first-child) — 32px, круглая */
#usersdiv tr[id^="!"] td:first-child img {
    width: 32px !important;
    height: 32px !important;
    object-fit: contain !important;
    vertical-align: middle !important;
    border-radius: 50% !important;
}

/* ===== ТАБЛИЦЫ, АККОРДЕОН, ПРИВАТ ===== */
table {
    border-collapse: collapse;
    border: none !important;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 60, 100, 0.06);
}
td {
    border: none !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
    border-bottom: 1px solid rgba(0, 150, 200, 0.05);
}
.title {
    background: linear-gradient(135deg, #1abc9c, #0e6655) !important;
    color: #fff !important;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}
.title a { color: #fff !important; }

a, a:active {
    color: #0b3b4a !important;
    font-weight: 600;
    text-decoration: none;
}
a:hover {
    color: #ff6b81 !important;
    text-decoration: underline;
}

.accordion__header {
    background: linear-gradient(135deg, #0b3b4a, #1a5a6a) !important;
    color: #fff !important;
    border-radius: 40px !important;
    padding: 10px 20px !important;
    border: 1px solid rgba(255, 255, 255, 0.10);
}
.accordion__body {
    background: rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 0 20px 20px;
}

#privatdiv {
    background: rgba(0, 80, 120, 0.10) !important;
    border-radius: 20px 20px 0 0;
}
#pen_privat, #clear_privat {
    opacity: 0.5;
    transition: opacity 0.2s;
}
#pen_privat:hover, #clear_privat:hover { opacity: 1; }

.sm {
    max-width: 120px; max-height: 120px;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(0, 80, 120, 0.10);
    transition: transform 0.2s;
}
.sm:hover { transform: scale(1.05) rotate(-2deg); }

input[type="checkbox"] {
    width: 18px !important; height: 18px !important;
    accent-color: #1abc9c;
    border: 1px solid rgba(0, 180, 200, 0.3);
    background: rgba(255,255,255,0.5);
    cursor: pointer;
}

.low { color: rgba(0, 40, 60, 0.5); font-size: 11px; }
.turn:hover {
    transform: rotate(360deg);
    transition: transform 2000ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ===== СМАЙЛЫ СЛЕВА (десктоп) ===== */
#fastsmile {
    position: absolute;
    left: 0px;
    width: 75px;
    top: 50px;
    bottom: 60px;
    overflow-y: scroll;
    padding-left: 0px;
    background: rgba(255, 255, 255, 0.20) !important;
    border-radius: 0 20px 20px 0;
}

    /* ===== ПАНЕЛЬ СМАЙЛОВ ===== */
    #fastsmile {
        position: fixed !important;
        left: -50px !important;
        top: 36px !important;
        bottom: 40px !important;
        width: 50px !important;
        padding: 4px 2px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        border-radius: 0 !important;
        margin: 0 !important;
        background: rgba(255, 255, 255, 0.30) !important;
        transition: none !important;
        z-index: 1000 !important;
        box-shadow: 2px 0 8px rgba(0,0,0,0.15) !important;
    }
    #fastsmile.open-smiles {
        left: 0 !important;
    }
    #fastsmile img {
        width: 36px !important;
        height: auto !important;
        margin: 1px 0 !important;
    }
    #fastsmile a {
        display: inline-block;
        margin: 0 1px;
        text-align: center;
    }
	


/* ===== СКРОЛЛБАРЫ ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: rgba(79, 172, 254, 0.10); border-radius: 12px; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #4facfe, #00f2fe); border-radius: 12px; box-shadow: inset 0 0 6px rgba(0,0,0,0.05); }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #00c6fb, #005bea); }
::-webkit-scrollbar-thumb:horizontal { background: linear-gradient(90deg, #4facfe, #00f2fe); }
::-webkit-scrollbar-thumb:horizontal:hover { background: linear-gradient(90deg, #00c6fb, #005bea); }