@import url('https://fonts.googleapis.com/css2?family=Jura:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@600&family=Jura:wght@400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');

body {
    margin: 0 auto;
    width: 1280px;
    min-height: 100vh;

    font-family: 'Jura', sans-serif;
    font-size: 15px;
    color: #cfe9ff;

    background-color: #0b1210;

    background-image:
        /* 🔥 GRID */
        linear-gradient(rgba(0,255,200,0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,255,200,0.07) 1px, transparent 1px),

        /* 💠 glow */
        radial-gradient(circle at 20% 20%, rgba(0,255,200,0.08), transparent 45%),
        radial-gradient(circle at 80% 70%, rgba(0,140,255,0.06), transparent 50%),

        /* 🖼 фон */
        url('/mon/img/1234567.png');

    background-size:
        60px 60px,
        60px 60px,
        cover,
        cover,
        cover;

    background-repeat:
        repeat,
        repeat,
        no-repeat,
        no-repeat,
        no-repeat;

    background-position:
        center,
        center,
        center,
        center,
        center;

    background-attachment: fixed;
}




html, body {
  cursor: none;
}

/* базовый курсор */
.cursor-arrow {
  position: fixed;
  top: 0;
  left: 0;

  width: 18px;
  height: 18px;

  pointer-events: none;
  z-index: 999999;

  transform: translate(-50%, -50%);

  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%2300ffc8' d='M4 2l16 10-7 1 3 7-3 2-3-8-6 4z'/%3E%3C/svg%3E")
    no-repeat center;

  background-size: contain;

  filter:
    drop-shadow(0 0 6px rgba(0,255,200,0.8))
    drop-shadow(0 0 12px rgba(0,120,255,0.4));

  transition: filter 0.2s ease;
}

/* hover */
body.is-hover a,
body.is-hover button,
body.is-hover .clickable {
  cursor: none;
}

/* hover color */
body.is-hover .cursor-arrow {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fc6899' d='M4 2l16 10-7 1 3 7-3 2-3-8-6 4z'/%3E%3C/svg%3E")
    no-repeat center;

  filter:
    drop-shadow(0 0 8px rgba(252,104,153,0.9))
    drop-shadow(0 0 16px rgba(252,104,153,0.5));
}















.comments-wrap{
	margin-top:20px;
	padding:16px;
	background: rgba(10,10,15,0.6);
	border:1px solid rgba(0,255,200,0.12);
	border-radius:16px;
	backdrop-filter: blur(18px);
	font-family: Arial, sans-serif;
}

/* 🔥 TITLE */
.comments-title{
	display:flex;
	align-items:center;
	justify-content:space-between;
	font-size:16px;
	font-weight:700;
	color:#00ffd5;
	margin-bottom:14px;
	letter-spacing:1px;
}

.comments-count{
	background: rgba(0,255,200,0.12);
	padding:3px 10px;
	border-radius:999px;
	font-size:12px;
	color:#00ffd5;
	border:1px solid rgba(0,255,200,0.25);
}

/* LIST */
.comments-list{
	display:flex;
	flex-direction:column;
	gap:10px;
}

/* ANIMATION FOR COMMENTS */
.comments-list > div{
	animation: fadeInUp 0.25s ease;
}

@keyframes fadeInUp{
	from{
		opacity:0;
		transform: translateY(8px);
	}
	to{
		opacity:1;
		transform: translateY(0);
	}
}

/* PAGINATION */
.comments-pages{
	margin-top:12px;
	text-align:center;
	color:#aaa;
}

/* FORM */
.comments-form{
	margin-top:16px;
	padding-top:14px;
	border-top:1px solid rgba(255,255,255,0.08);
}

.comments-form-title{
	color:#4cc9ff;
	font-weight:600;
	margin-bottom:8px;
}

/* INPUTS */
.comments-form textarea,
.comments-form input[type="text"]{
	width:100%;
	background: rgba(255,255,255,0.05);
	border:1px solid rgba(0,255,200,0.2);
	border-radius:10px;
	padding:10px;
	color:#fff;
	outline:none;
	transition:0.2s;
}

.comments-form textarea{
	resize:none;
	min-height:90px;
}

.comments-form textarea:focus,
.comments-form input:focus{
	border-color:#00ffd5;
	box-shadow:0 0 12px rgba(0,255,213,0.2);
	transform: scale(1.01);
}

/* SUBMIT BUTTON */
.comments-form input[type="submit"]{
	margin-top:8px;
	background:#00ffd5;
	color:#000;
	border:none;
	border-radius:999px;
	padding:8px 14px;
	font-weight:700;
	cursor:pointer;
	transition:0.2s;
}

.comments-form input[type="submit"]:hover{
	transform: scale(1.05);
	box-shadow:0 0 14px rgba(0,255,213,0.4);
}

/* OPTIONAL DARK GLASS ENHANCE */
.comments-wrap{
	box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}










.comm-card{
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(0,255,200,0.15);
	border-radius: 16px;
	padding: 14px;
	margin: 12px 0;
	backdrop-filter: blur(10px);
	box-shadow: 0 0 20px rgba(0,255,200,0.05);
	transition: 0.25s ease;
}

.comm-card:hover{
	transform: translateY(-2px);
	border-color: rgba(0,255,200,0.35);
	box-shadow: 0 0 25px rgba(0,255,200,0.15);
}

/* avatar */
.comm-card-avatar{
	float:left;
	margin-right:12px;
}

.comm-avatar-img{
	width:42px;
	height:42px;
	border-radius:50%;
	border:2px solid rgba(0,120,255,0.5);
	object-fit:cover;
}

/* header */
.comm-card-header{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:8px;
}

.comm-name{
	color:#4cc9ff;
	font-weight:600;
}

.comm-info{
	font-size:12px;
	opacity:0.6;
	margin-left:6px;
}

/* message */
.comm-message{
	color:#eaeaea;
	font-size:14px;
	line-height:1.5;
	padding-left:52px;
}

/* answer */
.comm-answer{
	margin-top:8px;
	padding:8px;
	border-left:2px solid #00ffc8;
	background:rgba(0,255,200,0.05);
	border-radius:6px;
}

/* rates */
.u-rate-btn{
	color:#aaa;
	text-decoration:none;
	margin:0 4px;
	transition:0.2s;
}

.u-rate-btn.up:hover{ color:#00ff99; }
.u-rate-btn.down:hover{ color:#ff4d6d; }

/* answer button */
.comm-answer-link{
	color:#00cfff;
	font-size:13px;
	text-decoration:none;
}

.comm-answer-link:hover{
	text-shadow:0 0 8px rgba(0,207,255,0.6);
}


.comm-form-inner{
	display:flex;
	gap:12px;
	align-items:flex-start;
}

.comm-form-body{
	flex:1;
	min-width:0;
}

.comm-form-input{
	width:100%;
	box-sizing:border-box;
	display:block;
}

.comm-textarea{
	width:100%;
	min-width:100%;
	max-width:100%;
	resize:none;
}

.comm-form-message{
	width:100%;
}








.comm-form-box{
	background: rgba(255,255,255,0.03);
	border: 1px solid rgba(0,255,200,0.15);
	border-radius: 16px;
	padding: 14px;
	backdrop-filter: blur(12px);
	margin-top: 20px;
}

.comm-form-inner{
	display:flex;
	gap:12px;
}

.comm-form-avatar img,
.comm-form-avatar svg{
	width:42px;
	height:42px;
	border-radius:50%;
	border:2px solid rgba(0,120,255,0.5);
}

.comm-form-input{
	width:100%;
	background: rgba(0,0,0,0.25);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 10px;
	padding:10px;
	color:#fff;
	outline:none;
	transition:0.2s;
}

.comm-form-input:focus{
	border-color:#00ffc8;
	box-shadow:0 0 10px rgba(0,255,200,0.3);
}

.comm-textarea{
	resize:none;
	min-height:120px;
}

.comm-form-btn{
	background: linear-gradient(90deg,#00ffc8,#00a2ff);
	border:none;
	padding:10px 16px;
	border-radius:10px;
	color:#000;
	font-weight:700;
	cursor:pointer;
}

.comm-form-actions{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-top:10px;
}

.comm-option{
	display:inline-flex;
	align-items:center;
	gap:6px;
	cursor:pointer;
	opacity:0.7;
}

.comm-option:hover{
	opacity:1;
}




















/* =========================
   MINIMAL SCROLLBAR (WEB3)
========================= */

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(
        180deg,
        rgba(0,255,200,0.25),
        rgba(0,120,255,0.25)
    );
    border-radius: 10px;

    box-shadow:
        0 0 6px rgba(0,255,200,0.2),
        0 0 10px rgba(0,120,255,0.15);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(
        180deg,
        rgba(0,255,200,0.45),
        rgba(0,120,255,0.45)
    );
}


/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(0,255,200,0.3) transparent;
}
















/* =========================
   LINKS (DEX NEON STYLE)
========================= */

a {
    color: #00ffd5;
    text-decoration: none;
    transition: 0.2s;
    text-shadow: 0 0 8px rgba(0,255,213,0.15);
}

a:hover {
    color: #00ff9d;
    text-shadow:
        0 0 8px rgba(0,255,157,0.4),
        0 0 16px rgba(0,255,157,0.2);
}



/* =========================
   TITLE BAR (DEX HEADER)
========================= */

h1 {
    font-family: 'Orbitron', sans-serif;
    font-size: 15px;
    line-height: 26px;

    padding: 5px 10px;
    border-radius: 6px 6px 0 0;

    /* dark glass background */
    background: rgba(16, 31, 30, 0.92);

    /* border depth */
    border: 1px solid rgba(0, 255, 234, 0.08);

    /* neon glow */
    box-shadow:
        0 0 6px rgba(0, 255, 234, 0.35),
        0 0 18px rgba(0, 255, 234, 0.2),
        inset 0 0 12px rgba(0, 255, 234, 0.05);

    /* text neon */
    color: #cffff6;
    text-shadow:
        0 0 6px rgba(2, 248, 125, 0.7),
        0 0 14px rgba(2, 248, 125, 0.5);
}

/* =========================
   STRONG TEXT
========================= */

strong {
    font-weight: 700;
    color: #ffffff;
    text-shadow: 0 0 6px rgba(255,255,255,0.08);
}
























/* =========================
   HEADER + BASE UI
========================= */

#header {
    margin: 10px 0;
}

#logo {
    float: left;
    margin-left: 5px;
}

/* LISTS */
ul, ol {
    margin-left: 20px;
}

ul li {
    list-style-type: square;
    color: #cfe9ff;
}

/* SOCIAL */
.social {
    float: right;
    margin-top: 22px;
    width: 140px;
    text-align: right;
}

#vk_like {
    margin-top: 9px;
    float: right;
}

#social-vk,
#social-twitter {
    height: 40px;
    width: 40px;
}

/* =========================
   TABLE COLUMNS (DEX STYLE)
========================= */

.c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10{
    text-align: center;
    font-weight: 600;
    color: #cfe9ff;
    font-size: 14px;
}



/* ICON / INDEX */
.c0 {
    width: 40px;
    padding-top: -15px;
}

/* VARIOUS METRICS */

.c1 { width: 40px; padding-top: 5px; }
.c2 { width: 150px; }
.c3 { width: 150px; }
.c4 { width: 50px; }
.c5 { width: 50px; }
.c6 { width: 50px; }
.c7 { width: 120px; }
.c6 { width: 50px; }
.c8 { width: 70px; }
.c9 { width: 120px; }
.c10 { width: 150px; }



/* =========================
   SPECIAL LABELS
========================= */

.contract {
    font-weight: 700;
    color: #ffcc00;
    text-shadow: 0 0 6px rgba(255,204,0,0.2);
}

/* =========================
   PRE-COLUMNS
========================= */

.pc {
    width: 15px;
    padding-left: 10px;
    text-align: right;
    color: #7f8c8d;
    font-size: 11px;
}

.pc1 {
    width: 405px;
    padding: 0 10px;
    color: #cfe9ff;
}

.pc2 {
    width: 75px;
    padding: 0 10px;
    text-align: right;
    color: #cfe9ff;
}

/* =========================
   CLEAR FIX
========================= */

.clear {
    clear: both;
}

/* =========================
   ICON SYSTEM (SOFT GLOW)
========================= */

i.icons {
    position: absolute;
    background: url(/img/icons.png);
    height: 16px;
    width: 16px;
    margin-top: 5px;
    opacity: 0.8;
}

i.vote {
    background-position: 0 0;
}

i.voted {
    background-position: -16px 0;
}

i.steam {
    background-position: -32px 0;
    margin-left: -20px;
    opacity: 0.5;
}

tr:hover i.steam {
    opacity: 1;
}

/* =========================
   LINKS
========================= */

a.connect {
    position: relative;
    height: 16px;
    width: 16px;
}

span.steam {
    font-size: 10px;
    padding: 0 5px;
    margin: 0 5px 0 0;
}

span.steam a {
    color: #cfe9ff;
}

/* MAP LINKS */
a.map {
    text-decoration: none;
    border-bottom: 1px solid transparent;
    color: #cfe9ff;
    transition: 0.2s;
}

a.map:hover {
    border-bottom: 1px solid #00ffd5;
    color: #00ffd5;
}

/* =========================
   TABLE UI (DEX GRID STYLE)
========================= */

thead tr {
    background: rgba(7, 19, 24, 0.95);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

tbody tr {
    border-bottom: 1px solid rgba(255,255,255,0.04);
    transition: 0.2s;
}

tbody tr:hover {
    background: rgba(32, 40, 36, 0.6);
    box-shadow: inset 0 0 20px rgba(0,255,200,0.03);
}

/* ROW STYLE */
tr {
    line-height: 15px;
}

/* ========================= */






























<style>

/* =========================
   VIEW LAYOUT (DEX STYLE)
========================= */

.view-mapimg {
    margin:10px;
    width:160px;
    float:left;
}

.view-mapimg img {
    height:120px;
    width:160px;
    width:160px;
    border-radius:8px;
    border:1px solid rgba(255,255,255,0.06);
}

/* INFO BLOCKS */
.view-server {}

.view-info {
    margin:10px 0;
    float:left;
    color:#eaffff;
}

.view-info p {
    line-height:24px;
    color:#cfe9ff;
}

.view-1block {
    float:left;
    width:495px;
}

.view-2block {
    float:right;
    width:495px;
}

/* =========================
   COMMENTS
========================= */

.comments {
    padding-top:3px;
    background:rgba(17,24,23,0.95);
    border:1px solid rgba(255,255,255,0.06);
    border-radius:8px;
}

/* =========================
   ERROR / SUCCESS SYSTEM
========================= */

.error {
    border:1px solid rgba(255,80,80,0.3);
    background:rgba(80,0,0,0.15);
    padding:6px 10px;
    margin-bottom:10px;
    border-radius:8px;
    color:#ff6b6b;
}

.error p.head{
    font-weight:bold;
    font-size:14px;
    margin:5px 0;
    color:#ff4d4d;
}

.error ul{
    margin-bottom:5px;
    color:#ffb3b3;
}

.error ul li {
    line-height:20px;
    list-style-type:disc;
}

.error a {
    color:#ff6b6b;
}

/* =========================
   FORMS
========================= */

fieldset {
    border-top:1px solid rgba(255,255,255,0.08);
    margin-bottom:20px;
}

legend {
    font-weight:bold;
    color:#9aa4a0;
    margin-left:150px;
}

form.add {
    margin:10px 0;
}

dl {
    padding-top:14px;
}

dt {
    float:left;
    text-align:right;
    margin-right:10px;
    width:140px;
    color:#9aa4a0;
}

dd {
    float:left;
    width:180px;
}

dd input {
    width:175px;
    padding:6px;
    border-radius:6px;
    border:1px solid rgba(255,255,255,0.06);
    background:rgba(11,20,17,0.95);
    color:#fff;
    outline:none;
}

input.check {
    width:auto;
}

dd.info {
    margin-left:20px;
    color:#9aa4a0;
    font-size:11px;
    padding-top:3px;
    width:auto;
}

/* DONE BLOCK */
.done {
    background:rgba(17,24,23,0.95);
    padding:10px 10px 10px 150px;
    border-radius:8px;
}

.done input {
    height:27px;
    width:175px;
    border-radius:6px;
}

/* =========================
   SUCCESS BLOCK
========================= */

.succ {
    padding:10px;
    font-size:16px;
    font-weight:bold;
    text-align:center;
    color:#7ef9ff;
}

.succ-left,
.succ-right {
    float:left;
    width:480px;
    padding:0 10px 10px 10px;
    color:#eaffff;
}

.succ-img {
    text-align:center;
}

.succ-right textarea,
.succ-left textarea {
    width:470px;
    height:100px;
    background:rgba(11,20,17,0.95);
    border:1px solid rgba(255,255,255,0.06);
    color:#fff;
    border-radius:6px;
}

/* VOTE */
.voteup img {
    vertical-align:middle;
    margin-top:-4px;
}

/* =========================
   POSTS
========================= */

.dontwork {
    padding:10px;
}

.post {
    margin:0 0 20px 0;
}

.posttext {
    padding:10px;
    background:rgba(17,24,23,0.95);
    border:1px solid rgba(255,255,255,0.06);
    border-radius:8px;
}

h1.posttitle {}

/* =========================
   NOTIFICATIONS
========================= */

#inform-area {
    position:fixed;
    right:0;
    top:0;
    width:350px;
    z-index:10000;
}

.inform-ok,
.inform-error {
    padding:10px;
    margin:10px 10px 0 0;
    color:#fff;
    border-radius:6px;
}

.inform-ok {
    background:rgba(0,160,34,0.8);
}

.inform-error {
    background:rgba(160,0,0,0.8);
}

/* =========================
   FOOTER (DEX TERMINAL STYLE)
========================= */

#footer {
    margin:-15px 0;
    padding-top:5px;
    border-top:1px solid rgba(255,255,255,0.06);
    background:rgba(7,19,24,0.95);
}

.fooleft{
    float:left;
    width:700px;
}

.fooright{
    float:right;
    width:280px;
    margin-top:1px;
    text-align:right;
    color:#9aa4a0;
}

#footer p {
    margin:3px 0;
    color:#9aa4a0;
}

#footer p.top{
    margin-top:0;
}

#footer p.up{
    margin-top:-2px;
}

#footer p.up a{
    color:#7ef9ff;
}

#footer .fooleft .copy{
    width:60px;
    float:left;
    text-align:right;
    margin-right:5px;
    color:#9aa4a0;
    height:33px;
}

.footinform{
    width:400px;
    float:left;
}

.footlinks{
    width:235px;
    float:left;
}

.footlinks p.top{
    font-size:11px;
}

/* SYSTEM TEXT */
#footer p.system{
    color:#9aa4a0;
    font-size:11px;
}

#footer p.system a{
    color:#7ef9ff;
}

/* =========================
   WIDGETS
========================= */

#bot-widgets {
    border-top:1px solid rgba(255,255,255,0.06);
    padding-top:20px;
    margin-top:20px;
}

#bot-widgets .block {
    float:left;
    width:300px;
    margin:0 16px 0 17px;
}

/* NEW SERVERS */
.new-servers {
    border:1px solid rgba(255,255,255,0.06);
    width:299px;
    font-size:11px;
    background:rgba(17,24,23,0.95);
}

.new-servers h3 {
    border-bottom:1px solid rgba(0,255,200,0.2);
    background:rgba(17,24,23,0.98);
    line-height:20px;
    font-weight:bold;
    color:#7ef9ff;
    padding-left:10px;
}

.new-servers ul.newserv li {
    display:block;
    line-height:25px;
    list-style:none;
    color:#cfe9ff;
}

.new-servers ul.newserv li span {
    color:#9aa4a0;
}

/* INFORM BOX */
#inform-box {
    background:rgba(255,200,80,0.15);
    padding:10px;
    margin-bottom:10px;
    border-radius:6px;
    border:1px solid rgba(255,200,80,0.3);
    color:#ffd38a;
}

/* SEARCH */
.searchbox {
    padding:10px;
    margin-bottom:20px;
}

.searchbox .search_type {
    margin-bottom:10px;
}

/* ACCORDION */
.accordion {
    padding:10px;
}

h2 {
    font-size:15px;
    border-bottom:1px solid rgba(255,255,255,0.1);
    margin-top:20px;
    color:#7ef9ff;
}

h2.first {
    margin-top:0;
}

.accordion h3 {
    font-size:13px;
    margin-top:10px;
    margin-left:10px;
}

.accordion h3 a {
    text-decoration:none;
    color:#7ef9ff;
    border-bottom:1px dashed rgba(0,255,200,0.3);
}

.accordion h3.active a{
    color:#00ffd5;
    border-bottom:1px solid #00ffd5;
}

.accordion p {
    display:none;
    margin-left:10px;
    padding:10px;
    color:#cfe9ff;
}

/* OOOPS */
.ooops,.ooops a {
    color:#9aa4a0;
}

.ooops {
    font-size:11px;
    margin-bottom:10px;
}

/* PAGINATOR */
.paginator{
    text-align:center;
    font-size:14px;
    padding:10px;
    color:#7ef9ff;
}

.paginator .arrow {
    text-decoration:none;
    font-size:20px;
    color:#00ffd5;
}

</style>



















































<style>

/* =========================
   NEW NAVIGATION (DEX STYLE)
========================= */

.new-navigation {
    background:rgba(7,19,24,0.96);
    padding:0 0px;
    margin-bottom:0px;
    border-radius:8px;
    border:1px solid rgba(255,255,255,0.06);
    backdrop-filter: blur(4px);
}

.new-navigation ul {
    margin:0;
    padding:0;
}

/* NAV ITEMS */
.new-navigation ul li {
    display:block;
    padding-left:34px;
    float:left;
    margin:10px 15px 0px 0;
    opacity:0.7;
    cursor:pointer;
    transition:0.2s;
    position:relative;
}

.new-navigation ul li.current,
.new-navigation ul li:hover {
    opacity:1;
}

/* LINKS */
.new-navigation ul li a {
    color:#7ef9ff;
    font-family:'Orbitron',sans-serif;
    font-size:12px;
    text-decoration:none;

    text-shadow:
        0 0 6px rgba(0,255,220,0.3);
    transition:0.2s;
}

.new-navigation ul li a:hover {
    color:#00ffd5;
    text-shadow:
        0 0 10px rgba(0,255,200,0.5);
}

/* TEXT */
.new-navigation ul li p {
    font-size:11px;
    color:#9aa4a0;
}

/* ICON ITEMS (kept, only softened) */
.new-navigation ul li#nav-servers {

}

.new-navigation ul li#nav-home {

}

.new-navigation ul li#nav-token {

}

.new-navigation ul li#nav-stock {

}

.new-navigation ul li#nav-converter {

}

.new-navigation ul li#nav-calculator {

}

.new-navigation ul li#nav-coins {

}

.new-navigation ul li#nav-scanner {

}

.new-navigation ul li#nav-MCcalc {

}

.new-navigation ul li#nav-tokensprices {

}

.new-navigation ul li#nav-vip {

    float:right;
}

.new-navigation ul li#nav-mining {

}

.new-navigation ul li#nav-mc {

}

.new-navigation ul li#nav-add {

    float:right;
}


















/* =========================
   INFO BLOCKS
========================= */


<style>

.dex-inform-box{
 display:inline-block;

 padding:12px 16px;
 margin:8px 0;

 font-size:13px;
 line-height:1.55;

 color:#b9fff0;

 background:linear-gradient(180deg, rgba(8,12,16,0.85), rgba(5,8,10,0.95));

 border:1px solid rgba(0,255,200,0.18);
 border-radius:16px;

 backdrop-filter:blur(12px);

 box-shadow:
 0 0 0 1px rgba(0,255,200,0.05),
 0 10px 35px rgba(0,0,0,0.45),
 inset 0 0 12px rgba(0,255,200,0.05);

 text-shadow:
 0 0 8px rgba(0,255,200,0.35);

 position:relative;
 overflow:hidden;

 transition:0.25s ease;
}

.dex-inform-box::before{
 content:"";
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:2px;
 background:linear-gradient(90deg, transparent, #00ffd0, transparent);
 opacity:0.9;
}

.dex-inform-box::after{
 content:"";
 position:absolute;
 inset:0;
 background:radial-gradient(circle at 20% 0%, rgba(0,255,200,0.12), transparent 60%);
 opacity:0.4;
 pointer-events:none;
}

/* hover — агрессивнее */
.dex-inform-box:hover{
 transform:translateY(-3px) scale(1.01);

 border-color:rgba(0,255,200,0.4);

 box-shadow:
 0 0 25px rgba(0,255,200,0.25),
 0 15px 50px rgba(0,0,0,0.5),
 inset 0 0 16px rgba(0,255,200,0.08);

 color:#eafffa;
}

</style>
<style>
#new-inform-box {
    margin: 0;
    float: left;
    width: 949px;
    font-size: 15px;
    padding: 16px 20px;
    background: linear-gradient(180deg, rgba(17,24,23,0.95), rgba(10,14,13,0.98));
    border: 1px solid rgba(0,255,180,0.15);
    border-radius: 12px;
    color: #e6fff7;
    font-family: Arial, sans-serif;
    line-height: 1.5;
    box-shadow: 
        0 0 20px rgba(0,255,180,0.05),
        inset 0 0 10px rgba(0,255,180,0.03);
    position: relative;
    overflow: hidden;
}


#new-inform-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #00ffc3, transparent);
    opacity: 0.8;
}


#new-inform-box b {
    color: #00ffc3;
    font-weight: bold;
}

#new-inform-box:hover {
    border-color: rgba(0,255,180,0.35);
    box-shadow: 
        0 0 25px rgba(0,255,180,0.12),
        inset 0 0 12px rgba(0,255,180,0.05);
    transition: 0.3s ease;
}
</style>







/* VIEW LAYOUT */
div.view div.left,
div.view div.right {
    float:left;
    width:480px;
    padding:0 10px;
}

div.view dt {
    font-weight:bold;
    width:90px;
    color:#9aa4a0;
}

/* =========================
   MININEWS
========================= */

.mininews {
    padding:10px;
    text-align:center;
    margin-bottom:10px;
    background:rgba(17,24,23,0.98);
    border-radius:6px;
    border:1px solid rgba(255,255,255,0.06);
}

.mininews a {
    color:#7ef9ff;
    font-weight:bold;
    text-decoration:none;
}

.mininews a:hover {
    color:#00ffd5;
}

/* GOOGLE BLOCK */
.bygoog{
    text-align:center;
    background:rgba(17,24,23,0.95);
    margin-bottom:10px;
    padding:5px 0 2px 0;
    border:1px solid rgba(255,255,255,0.06);
}

/* TAG INFO */
.infotag{
    line-height:27px;
    height:27px;
    background:rgba(17,24,23,0.95);
    border-bottom:1px solid rgba(255,255,255,0.06);
    padding-left:10px;
    display:none;
    color:#9aa4a0;
}

/* INFO ADD */
.infoadd{
    padding:10px;
    margin:10px 0;
    border:1px solid rgba(255,255,255,0.06);
    background:rgba(17,24,23,0.95);
    border-radius:8px;
}

.infoadd p.head{
    font-weight:bold;
    font-size:14px;
    margin-bottom:5px;
    color:#eaffff;
}

.infoadd ol{
    list-style-type:decimal;
    color:#cfe9ff;
}

.infoadd ol li{
    line-height:20px;
}

.infoadd p.inform{
    margin-top:8px;
    color:#9aa4a0;
}

.infoadd p.inform span{
    color:#ff6b6b;
    font-weight:bolder;
}

/* VIP */
a.vip{
    display:block;
    background:url(/mon/img/vip15.png);
    height:15px;
    width:22px;
    float:right;
    margin-top:2px;
    opacity:0.9;
}

span.off{
    color:#7F7F7F;
}

.vip-prices{
    margin:10px;
    color:#eaffff;
}

.vip-prices h2,
.oh-yeah h2{
    margin-bottom:10px;
    color:#7ef9ff;
}

/* BLOCK */
.oh-yeah{
    padding:10px;
    background:rgba(17,24,23,0.95);
    border:1px solid rgba(255,255,255,0.06);
    border-radius:8px;
}

/* ADS */
.advert{
    height:70px;
}

/* LEFT PANEL */
.superleft{
    float:left;
    width:500px;
    text-align:center;
}

/* ========================= */

</style>













/* =========================
   SHABLON MONITORINGA (DEX STYLE)
========================= */

.superright{
    float:right;
    width:500px;
    text-align:center;
}

/* =========================
   NAV LIST
========================= */

ul.rex {
  font-size:11px;
  text-align:center;
  color:#9aa4a0;
  margin-bottom:20px;
}

ul.rex a {
  color:#9aa4a0;
  text-decoration:none;
}

ul.rex li {
  display:inline;
  background:rgba(17,24,23,0.98);
  padding:4px 8px;
  border-radius:6px;
  margin-right:10px;
  border:1px solid rgba(255,255,255,0.06);
  transition:0.2s;
}

ul.rex li:hover {
  border:1px solid rgba(0,255,200,0.2);
  color:#eaffff;
}

ul.rex li:hover a {
  color:#00ffd5;
  text-decoration:none;
}

/* =========================
   MAIN VIEW LAYOUT
========================= */

#view {}

#view .left {
    float:left;
    width:595px;
}

#view .left .wrap {
    margin-top:10px;
}

/* IMAGE BLOCK */
#view .left .wrap .map-img {
    float:left;
    height:120px;
    margin:0 10px;
    width:160px;
}

#view .left .wrap .map-img img {
    height:120px;
    width:160px;
    border-radius:8px;
}

/* INFO BLOCK */
#view .left .wrap .info {
    float:left;
    width:415px;
}

#view .left .wrap .info dl {
    line-height:24px;
    width:415px;
    padding:0;
    color:#cfe9ff;
}

#view .left .wrap .info dl dt {
    color:#9aa4a0;
    float:left;
    width:70px;
    text-align:left;
}

#view .left .wrap .info dl dt:after {
    content:':';
}

#view .left .wrap .info dl dd {
    float:left;
    width:335px;
    color:#eaffff;
}

#view .left .wrap .info dl dd .votes {
    float:left;
}

#view .left .wrap .info dl dd .vote_link {
    float:left;
    margin-left:3px;
}

/* =========================
   ADD INFO SECTION
========================= */

#view .left .add-info {
    margin-top:20px;
}

#view .left .add-info h1 {
    margin-bottom:10px;
}

#view .left .add-info dl {
    line-height:24px;
    width:595px;
    padding:0;
    color:#cfe9ff;
}

#view .left .add-info dl dt {
    color:#9aa4a0;
    float:left;
    margin-left:10px;
    width:100px;
    text-align:left;
}

#view .left .add-info dl dt:after {
    content:':';
}

#view .left .add-info dl dd {
    float:left;
    width:475px;
}

/* =========================
   COMMENTS
========================= */

#view .left .comments {
    margin-top:20px;
    padding:0;
    background:none;
}

/* =========================
   RIGHT PANEL
========================= */

#view .right {
    float:left;
    margin-left:20px;
    width:385px;
}

/* PLAYER LIST TABLE */
.player-list {
    width:385px;
    border-collapse:collapse;
    color:#eaffff;
}

.player-list tr {
    line-height:26px;
}

.player-list thead tr {
    background:rgba(17,24,23,0.98);
    border-bottom:1px solid rgba(255,255,255,0.06);
}

.player-list tbody tr {
    border-bottom:1px solid rgba(255,255,255,0.05);
    transition:0.2s;
}

.player-list tbody tr:hover {
    background:rgba(0,255,200,0.05);
}

.player-list td.c10 {
    color:#9aa4a0;
    font-size:11px;
    padding-right:10px;
    text-align:right;
    width:20px;
}

.player-list td.c20 {
    padding-right:10px;
    width:210px;
}

.player-list td.c30 {
    padding-right:10px;
    text-align:right;
    width:75px;
}

/* EMPTY STATE */
#view .right .no-players {
    padding:10px 34px;
    color:#9aa4a0;
}

/* ADS */
#view .right .ads {
    margin-left:25px;
    margin-top:20px;
    width:336px;
}

/* =========================
   CLEARFIX
========================= */

.clearfix:before,
.clearfix:after {
  content:"";
  display:block;
  height:0;
  overflow:hidden;
}

.clearfix:after { clear:both; }
.clearfix { zoom:1; }

/* =========================
   SCROLL TOP (DEX STYLE)
========================= */

#scrollTop {
    cursor:pointer;
    position:fixed;
    right:-100px;
    bottom:20px;
    height:25px;
    width:100px;
    z-index:100000;
}

#scrollTop .sArrow{
    float:left;
    width:20px;
    text-align:center;
    height:25px;
    line-height:25px;
    font-size:17px;
    border-radius:6px 0 0 6px;
    background:rgba(0,255,200,0.8);
    color:#0b0f0e;
}

#scrollTop .sText {
    float:left;
    width:80px;
    background:rgba(17,24,23,0.98);
    height:25px;
    line-height:25px;
    text-align:center;
    font-size:14px;
    color:#7ef9ff;
    border:1px solid rgba(255,255,255,0.06);
}

/* =========================
   EXTRA BLOCKS
========================= */

.yaad {
    padding:10px;
    margin-top:10px;
    background:rgba(17,24,23,0.98);
    border:1px solid rgba(255,255,255,0.06);
    border-radius:8px;
}

.yaddfooter {
    background:rgba(17,24,23,0.95);
    padding:5px 5px 10px 5px;
    color:#9aa4a0;
}

/* NEW YEAR BANNER */
#newyear {
    height:36px;
    margin:10px 0;
    background:rgba(17,24,23,0.98);
    padding:20px 10px 0 70px;
    border:1px solid rgba(0,255,200,0.15);
    font-size:14px;
    color:#ff6b6b;
}

/* SHARE BLOCK */
.yashare-auto-init {
    text-align:center;
    margin-bottom:10px;
    background:rgba(17,24,23,0.98);
    border-radius:6px;
    border:1px solid rgba(255,255,255,0.06);
}

/* SURFING BLOCK */
.surfingbird {
    height:46px;
    line-height:46px;
    background:rgba(0,150,255,0.15);
    border-radius:6px;
    margin-bottom:10px;
    border:1px solid rgba(0,150,255,0.3);
}

.surfingbird a{
    display:block;
    padding-left:54px;
    text-decoration:none;
    color:#7ef9ff;
    height:46px;
    line-height:46px;
}

.surfingbird a:hover {
    background:rgba(0,150,255,0.25);
}

.surfingbird a span {
    font-size:16px;
}

</style>






















<style>

/* =========================
   PAGINATOR (DEX STYLE)
========================= */

.paginator {
  display:flex;
  justify-content:center;
  gap:10px;
  margin:20px 0;
  font-family:'Orbitron','Roboto Mono',monospace;
}

/* LINKS */
.paginator a {
  padding:6px 12px;
  text-decoration:none;
  color:#7ef9ff;
  background:rgba(20,28,25,0.98);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:6px;
  transition:0.2s;
  font-weight:700;
  letter-spacing:1px;
  box-shadow:0 0 6px rgba(0,0,0,0.3);
}

/* HOVER */
.paginator a:hover {
  color:#00ffd5;
  transform:scale(1.08);
  border-color:rgba(0,255,200,0.2);
  box-shadow:0 0 12px rgba(0,255,200,0.1);
}

/* CURRENT PAGE */
.paginator span {
  padding:6px 12px;
  background:rgba(20,28,25,0.98);
  color:#00ffd5;
  border-radius:6px;
  border:1px solid rgba(0,255,200,0.15);
  font-weight:700;
  letter-spacing:1px;
  box-shadow:0 0 10px rgba(0,255,200,0.05);
}

/* =========================
   CRYPTO TEXT BLOCK
========================= */

.crypto-text {
  font-family:'Rajdhani',sans-serif;
  color:#d3fcb3;
  font-size:11px;

  background:rgba(20,35,30,0.95);
  padding:12px 18px;
  border-radius:8px;

  border:1px solid rgba(0,255,170,0.2);

  text-shadow:0 0 6px rgba(0,255,170,0.25);

  transition:0.3s ease;
}

.crypto-text:hover {
  box-shadow:0 0 12px rgba(0,255,170,0.15);
  border-color:rgba(0,255,170,0.4);
}

/* =========================
   OPTIONAL SCROLL ANIMATION FIX
========================= */

@keyframes scroll {
  0% { transform:translateX(0); }
  100% { transform:translateX(-100%); }
}

/* =========================
   SECTIONS BACKGROUND
========================= */

.section-1 { background-image:url(/mon/img/1.png); }
.section-2 { background-image:url(/mon/img/2.png); }
.section-3 { background-image:url(/mon/img/3.png); }
.section-4 { background-image:url(/mon/img/4.png); }
.section-5 { background-image:url(/mon/img/5.png); }

</style>





















<style>

/* =========================
   CHAT (DEX DARK STYLE)
========================= */

.chat_box_body {
  width:218px;
  padding-left:5px;
  margin-bottom:0;
  float:left;
}

.chat_box_title {
  color:#7ef9ff;
  font-size:18px;
  background:rgba(15,23,20,0.95);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:10px;
  height:34px;
  display:flex;
  align-items:center;
  padding-left:10px;
  text-shadow:none;
}

.chat_box_title div {
  margin-left:60px;
  margin-bottom:0;
}

.chat_box {}

.cMessage {
  padding-top:5px;
}

.cMessage a:link,
.cMessage a:active,
.cMessage a:visited {}

.cMessage a:hover {}

/* MESSAGES */
.mcBlock1,
.mcBlock2 {
  background:rgba(15,23,20,0.98);
  border:1px solid rgba(255,255,255,0.06);
  color:#e5e7eb;
  margin:3px 2px;
  padding:4px 6px;
  border-radius:8px;
  word-wrap:break-word;
  max-width:218px;
  transition:0.2s;
}

.mcBlock1:hover,
.mcBlock2:hover {
  border:1px solid rgba(0,255,200,0.15);
  box-shadow:0 0 10px rgba(0,255,200,0.05);
}

.mcTime {
  float:right;
  font-size:9px;
  color:#9ca3af;
  text-shadow:none;
}

a.mcName:link,
a.mcName:visited,
a.mcName:active,
a.mcName:hover {
  color:#7ef9ff;
  font-size:11px;
  text-shadow:none;
}

/* LAYOUT */
#autoupd {margin-top:5px;float:left;}
#uniform-mchatRSel {float:left;}
#msgctrl {float:right;margin-top:-5px;}
#fldmsg {float:left;}
#submsg {float:left;margin-left:10px;width:155px;}

#msglenght {
  color:#9ca3af;
  text-shadow:none;
  padding:2px 0;
}

#mcclose {
  color:#ff6b6b;
  font-weight:bold;
  text-align:center;
}

#mchatMsgF {
  height:80px !important;
  background:rgba(11,20,17,0.98);
  border:1px solid rgba(255,255,255,0.06);
  color:#fff;
}

/* =========================
   CHAT BUTTONS (DARK CLEAN)
========================= */

.mcm,
.mcs,
.mcs2,
.mcb,
.mcb2,
.mcr {
  float:right;
  position:relative;
  display:block;
  background-position:0 -1px;
  background-repeat:no-repeat;
  opacity:0.85;
  transition:0.2s;
}

.mcm:hover,
.mcs:hover,
.mcs2:hover,
.mcb:hover,
.mcb2:hover,
.mcr:hover {
  opacity:1;
}

/* =========================
   CHAT FORM (DEX PANEL)
========================= */

.chat-form {
  background:rgba(15,23,20,0.98);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;
  padding:10px;
  margin-top:10px;
  color:#e5e7eb;
}

.chat-form-top {
  display:flex;
  justify-content:space-between;
  margin-bottom:8px;
  font-size:12px;
  color:#9ca3af;
}

.chat-tools-right a {
  margin-left:8px;
  text-decoration:none;
  opacity:0.7;
  color:#7ef9ff;
}

.chat-tools-right a:hover {
  opacity:1;
}

.chat-grid-2 {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin-bottom:6px;
}

.chat-grid-2 input,
.chat-message-box textarea {
  width:100%;
  padding:8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.06);
  background:rgba(11,20,17,0.98);
  color:#fff;
  outline:none;
}

.chat-message-box textarea {
  min-height:90px;
  resize:vertical;
}

.chat-secure {
  display:flex;
  gap:8px;
  align-items:center;
  margin:6px 0;
  color:#9ca3af;
}

.chat-form-bottom {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:8px;
}

.chat-submit input {
  background:rgba(0,255,136,0.9);
  border:none;
  padding:7px 14px;
  border-radius:10px;
  color:#0b0f0e;
  cursor:pointer;
  transition:0.2s;
  font-weight:bold;
}

.chat-submit input:hover {
  background:rgba(0,255,136,1);
}

.chat-counter {
  font-size:11px;
  color:#9ca3af;
}

.chat-denied {
  text-align:center;
  padding:10px;
  color:#ff6b6b;
}

</style>




















<style>

body{
  background:#0b1411;
  font-family:Arial;
  color:#fff;
  margin:0;
}

/* APP WRAPPER */
.app{
  display:flex;
  justify-content:center;
  padding-top:40px;
}

/* CARD (DEX STYLE) */
.card{
  width:100%;
  background:rgba(17,27,23,0.98);
  border-radius:14px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(4px);
}

/* INPUTS */
input, select{
  width:120px;
  padding:10px;
  margin-bottom:10px;
  border-radius:8px;
  border:none;
  background:rgba(11,20,17,0.98);
  color:#fff;
  outline:none;
  border:1px solid rgba(255,255,255,0.06);
}

/* BUTTON */
button{
  width:100%;
  padding:10px;
  margin-bottom:10px;
  border:none;
  border-radius:8px;
  background:rgba(0,255,136,0.95);
  font-weight:bold;
  cursor:pointer;
  transition:0.2s;
}

button:hover{
  opacity:0.85;
}

/* RESULT */
#result{
  margin-top:10px;
  font-size:16px;
  font-weight:bold;
}

/* EXTRA GRID INFO */
.of-extra{
  grid-column: 1 / -1;
  display:flex;
  gap:10px;
  font-size:10px;
  color:#8aa;
  margin-top:2px;
  opacity:0.95;
}

.of-extra span{
  padding:2px 6px;
  border-radius:4px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.05);
}

/* COLORS (UNCHANGED LOGIC) */
.liq-imb{ color:#7dd3fc; }
.mom{ color:#22c55e; }
.micro{ color:#fbbf24; }
.score{ color:#a78bfa; font-weight:bold; }

.ai-signal{
  color:#7dd3fc;
  font-weight:bold;
}

.ai-prob{
  color:#a78bfa;
  font-weight:bold;
}

.liq-pressure{ color:#7dd3fc; }
.whale{ color:#fbbf24; }
.entry{ color:#22c55e; font-weight:bold; }
.sentiment{ color:#a78bfa; font-weight:bold; }

</style>























<style>

/* ONLINE BOX (BINANCE TERMINAL STYLE) */
.onlineBox{

padding:10px;
margin-top:10px;
width:100%;
max-width:200px;

background:linear-gradient(180deg,#0b0f14,#0a0e12);

border:1px solid rgba(0,255,200,.1);
border-radius:10px;

backdrop-filter:blur(10px);

box-shadow:
0 0 25px rgba(0,255,200,.08),
0 20px 40px rgba(0,0,0,.5);

transition:.25s;

position:relative;
overflow:hidden;
}

/* scanline terminal effect */
.onlineBox::before{

content:"";
position:absolute;
inset:0;

background:repeating-linear-gradient(
0deg,
rgba(255,255,255,.02),
rgba(255,255,255,.02) 1px,
transparent 2px,
transparent 4px
);

opacity:.2;
pointer-events:none;
}

/* hover glow */
.onlineBox:hover{

border-color:rgba(0,255,200,.35);

box-shadow:
0 0 25px rgba(0,255,200,.15),
0 25px 60px rgba(0,0,0,.6);
}

/* TITLE (terminal header) */
.onlineTitle{

font-size:12px;
font-weight:700;
letter-spacing:.5px;

color:#00ffd5;

margin-bottom:8px;

padding-bottom:6px;

border-bottom:1px solid rgba(255,255,255,.06);

text-shadow:0 0 10px rgba(0,255,200,.25);

text-transform:uppercase;
}

/* STATS */
.onlineStats{

font-size:11px;
color:#7f8b99;
margin-bottom:8px;
}

.onlineStats b{
color:#eaffff;
text-shadow:0 0 8px rgba(0,255,200,.15);
}

.sep{
margin:0 6px;
color:rgba(255,255,255,.2);
}

/* LIST (terminal panel) */
.onlineList{

background:rgba(10,14,18,.85);

padding:8px;

border-radius:8px;

font-size:12px;

color:#cfd6e4;

max-height:140px;
overflow:auto;

line-height:1.5;

border:1px solid rgba(0,255,200,.08);

box-shadow:inset 0 0 1px rgba(255,255,255,.03);
}

/* USER LINKS (exchange tick style) */
.onlineList a{

color:#7ef9ff;

text-decoration:none;

position:relative;

padding-left:12px;

display:inline-block;

transition:.2s;
}

/* live dot */
.onlineList a::before{

content:"";
width:5px;
height:5px;

background:#00ff9d;

border-radius:50%;

position:absolute;

left:0;
top:50%;

transform:translateY(-50%);

box-shadow:0 0 8px rgba(0,255,157,.5);

animation:pulse 1.4s infinite;
}

/* hover */
.onlineList a:hover{

color:#00ffd5;

text-shadow:0 0 10px rgba(0,255,200,.25);
}

/* PULSE (websocket live indicator) */
@keyframes pulse{
0%{box-shadow:0 0 0 0 rgba(0,255,157,.5)}
70%{box-shadow:0 0 0 8px transparent}
100%{box-shadow:0 0 0 0 transparent}
}

/* SCROLLBAR (binance style) */
.onlineList::-webkit-scrollbar{
width:4px;
}

.onlineList::-webkit-scrollbar-thumb{
background:rgba(0,255,200,.25);
border-radius:10px;
}

.onlineList::-webkit-scrollbar-thumb:hover{
background:rgba(0,255,200,.4);
}

</style>

























.main-menu {
  display: flex;
  gap: 20px;
  list-style: none;
  padding: 0;
}

.menu-item {
  position: relative;
}

.menu-item span {
  cursor: pointer;
  font-weight: 600;
  color: #00ff9d;
}

.dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  background: #061b16;
  border: 1px solid rgba(0,255,170,0.15);
  border-radius: 10px;
  padding: 10px;
  display: none;
  min-width: 200px;
}

.dropdown li {
  list-style: none;
  margin: 5px 0;
}

.dropdown a {
  color: #ccc;
  text-decoration: none;
  font-size: 14px;
}

.dropdown a:hover {
  color: #00ff9d;
}

/* hover open */
.menu-item:hover .dropdown {
  display: block;
}

/* highlight block */
.highlight span {
  color: #ffcc00;
}