:root{
  --bg:#0b0e11;
  --bg2:#12161c;
  --panel:#1a1a1a;
  --panel2:#141414;
  --text:#eaf6f5;
  --muted:#9aa6b2;

  --primary:#ff0000;
  --primary-dark:#cc0000;

  --accent:#00ffcc;
  --accent2:#60a5fa;

  --border: rgba(255,255,255,0.08);
  --shadow: 0 10px 25px rgba(0,0,0,.35);
  --radius: 12px;
}

*{ box-sizing:border-box; }
html, body{ 
  overflow-x:hidden;
  font-family: "Segoe UI", Inter, system-ui, -apple-system, Arial, sans-serif !important;
}
body{ 
  margin:0;
  padding:0;
  min-height: 100vh;
  font-family: "Segoe UI", Inter, system-ui, -apple-system, Arial, sans-serif !important;
  background: linear-gradient(180deg, var(--bg), var(--bg2));
  color: var(--text);
}

img{ max-width:100%; height:auto; }
button, input, textarea{ font-family:inherit; }
ul{ margin:0; padding:0;}
.hidden{ display:none; }
text-muted{ color:var(--muted) !important; }
.center{ display:flex; align-items:center; justify-content:center; }
a{
  color: var( --accent) !important;
  text-decoration:none; 
}
a:hover{
  color: var(--accent2) !important;
}

/* Removed unused header containers */

.hamburger {
  display: none;
  background: none;
  border: none;
  color: white;
  font-size: 24px;
  cursor: pointer;
  padding: 5px;
}

@media (max-width: 768px) {
  .hamburger {
    display: block;
  }
}

.site-header,
body.page-signin header,
body.page-signup header,
body.page-news header,
body.page-index header,
body.page-portfolio header,
body.page-contacts header,
body.page-about header,
body.page-terms header,
body.page-privacy header,
body.page-cookie header,
body.page-kyc header,
body.page-404 header,
body.page-500 header,
body.page-change-password header,
body.page-forgot header{
  position: sticky !important;
  top:0 !important;
  z-index:1000 !important;
  height:70px !important;
  display:flex ;
  align-items:center !important;
  justify-content:space-between !important;
  padding:0 20px !important;
  background: rgba(51,51,51,0.95) !important;
  border-bottom:1px solid var(--border) !important;
  backdrop-filter: blur(6px) !important;
  box-shadow:none !important;
  overflow: visible !important;
}

header .logo-boxed img,
.site-header .logo-boxed img{
  background:#fff;
  padding:6px 10px;
  border-radius:12px;
  box-shadow: var(--shadow);
}

.sidebar .sidebar-logo img,
.sidebar .logo img{
  width:110px;
  height:auto;
  background:#fff;
  padding:8px 10px;
  border-radius:14px;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
}

.card img.logo,
.auth-card img.logo{
  height:80px;
  width:auto;
  background:#fff;
  padding:8px 12px;
  border-radius:14px;
  box-shadow: 0 10px 25px rgba(0,0,0,.15);
}

.btn,
.btn-primary{
  display:inline-block;
  background: var(--primary);
  color:#fff;
  padding:10px 18px;
  border-radius: var(--radius);
  font-weight: 600;
  border:none;
  cursor:pointer;
  transition: .25s;
}
.btn:hover,
.btn-primary:hover{ 
  background: var(--primary-dark);
}

.btn-outline{
  display:inline-block;
  background:transparent;
  color: var(--text);
  border:1px solid var( --border);
  padding:10px 18px;
  border-radius: var(--radius);
  cursor:pointer;
  transition:.25s;
}
.btn-outline:hover{
  border-color: var(--primary);
  box-shadow: var(--accent);
}

.signin-btn{
  display:inline-block !important;
  background-color:transparent !important;
  border:2px solid #ff0000 !important;
  color:#ff0000 !important;
  padding:10px 16px !important;
  border-radius:8px !important;
  font-weight:500 !important;
  text-decoration:none !important;
  transition:all .3s ease;
  cursor:pointer !important;
  box-shadow:none !important;
}
.signin-btn:hover{
  background-color:#ff0000 !important;
  color:#fff !important;
  transform:translateY(-2px) !important;
}

.signup-btn{
  display:inline-block;
  background:linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  border:2px solid transparent;
  padding:10px 20px;
  border-radius:8px;
  font-weight:600;
  text-decoration:none;
  transition:all .3s ease;
  cursor:pointer;
}
.signup-btn:hover{
  background:linear-gradient(135deg, #cc0000, #990000);
  transform:translateY(-2px);
  box-shadow:0 5px 15px rgba(255,0,0,0.3);
}

[data-guest-only][hidden],
[data-auth-only][hidden] {
  display: none !important;
}

a.signin-btn::before,
a.signup-btn::before,
button.signin-btn::before,
button.signup-btn::before{
  display:none !important;
}

footer,
footer.footer,
footer.basic-footer,
.site-footer{
  background:#000;
  color:#999;
  padding:20px;
  text-align:center;
  margin-top:50px;
  border-top:1px solid rgba(255,255,255,0.08);
}
.site-footer p{
  margin-top:20px;
  color:#ccc;
  text-align:center;
  font-size:16px;
}
footer a,
footer.footer a,
footer.basic-footer a,
.site-footer a{
  color: lightgray;
  margin:0 10px;
  text-decoration:none;
}
footer a:hover{ color:#fff; }

.ad-slot{
  max-width:1200px;
  margin:12px auto;
  padding:0 20px;
}
.ad-slot:empty{
  min-height:0;
}

#live-chat-button,
.live-chat-button{
  position:fixed;
  bottom:25px;
  right:25px;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:white;
  font-size:28px;
  padding:18px;
  border-radius:50%;
  cursor:pointer;
  box-shadow: 0 8px 25px rgba(255,0,0,0.4);
  z-index:9999;
  transition:all .3s ease;
  animation: mc_pulse 2s infinite;
}
@keyframes mc_pulse{
  0%{ box-shadow:0 8px 25px rgba(255,0,0,0.4); }
  50%{ box-shadow:0 8px 35px rgba(255,0,0,0.6); transform:scale(1.05); }
  100%{ box-shadow:0 8px 25px rgba(255,0,0,0.4); }
}
#live-chat-button:hover,
.live-chat-button:hover{
  transform:scale(1.1);
  box-shadow:0 12px 35px rgba(255,0,0,0.6);
}

#liveChatModal,
.live-chat-modal{
  position:fixed;
  bottom:40px;
  right:20px;
  width:380px;
  height:500px;
  background: rgba(240,242,245,0.98);
  backdrop-filter: blur(15px);
  border:1px solid rgba(255,255,255,0.2);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,0.3);
  display:none;
  z-index:9999;
}

.chat-header{
  background: linear-gradient(135deg, var(--bg), var(--bg2));
  color:#fff;
  padding:18px;
  text-align:center;
  font-size:18px;
  font-weight:600;
  position:relative;
}
.close-btn{
  background:none;
  border:none;
  color:#fff;
  font-size:24px;
  cursor:pointer;
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  padding:6px;
  border-radius:50%;
  transition:.25s;
}
.close-btn:hover{ background: rgba(255,255,255,0.1); }

.chat-body{
  background: linear-gradient(to bottom, #e5ddd5, #d1c7ae);
  padding:18px;
  overflow-y:auto;
  height:320px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.chat-footer{
  display:flex;
  align-items:center;
  padding:14px;
  background: rgba(240,242,245,0.95);
  border-top:1px solid rgba(0,0,0,0.1);
  gap:10px;
}

.chat-icon-btn{
  background:none;
  border:none;
  font-size:20px;
  color:#666;
  cursor:pointer;
  padding:8px;
  border-radius:50%;
  transition:.25s;
}
.chat-icon-btn:hover{
  background: rgba(255,0,0,0.1);
  color: var(--primary);
}

#chat-input{
  flex:1;
  padding:12px 16px;
  border:none;
  background:#fff;
  border-radius:25px;
  font-size:15px;
  resize:none;
  box-shadow:0 2px 10px rgba(0,0,0,0.1);
  transition:.25s;
}
#chat-input:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(255,0,0,0.2);
}

#send-chat-message{
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border:none;
  padding:10px;
  border-radius:50%;
  cursor:pointer;
  transition:.25s;
}
#send-chat-message:hover{
  background: linear-gradient(135deg, var(--primary-dark), #990000);
  transform:scale(1.1);
}

.user-message,
.support-message{
  padding:12px 16px;
  border-radius:18px;
  max-width:85%;
  line-height:1.4;
  word-wrap:break-word;
  animation: mc_msg_in .25s ease;
}
@keyframes mc_msg_in{
  from{ opacity:0; transform:translateY(16px); }
  to{ opacity:1; transform:translateY(0); }
}
.user-message{
  background: linear-gradient(135deg, #005c4b, #004d3f);
  color:#fff;
  align-self:flex-end;
  margin-left:auto;
  border-bottom-right-radius:5px;
}
.support-message{
  background:#fff;
  color:#333;
  align-self:flex-start;
  border-bottom-left-radius:5px;
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
.agent-name{
  display:block;
  font-weight:700;
  color: var(--primary);
  font-size:.9em;
  margin-bottom:4px;
}

.image-message{ max-width:120px; height:auto; border-radius:10px; }

@media (max-width: 600px){
  #liveChatModal,
  .live-chat-modal{
    width:95%;
    height:80%;
    bottom:10px;
    right:2.5%;
  }
  .chat-body{ height: calc(80vh - 170px); }
}

body.page-transactions{
  margin:0;
  padding:0;
  min-height:100vh;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color: var(--text);
}
body.page-transactions .sidebar{
  width:250px;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  position:fixed;
  left:20px;
  top:20px;
  height:calc(100vh - 40px);
  padding:20px;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:20px;
  box-shadow:0 10px 30px rgba(0,0,0,0.3);
  display:flex;
  flex-direction:column;
  align-items:center;
}
body.page-transactions .sidebar img{
  display:block;
  margin:0 auto 10px;
  width:120px;
  height:auto;
}
body.page-transactions .dropdown{
  width:100%;
  padding:0;
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
body.page-transactions .dropdown a{
  display:block;
  color:#fff;
  padding:12px 16px;
  text-decoration:none;
  border-radius:10px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-transactions .dropdown a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:6px;
  left:16px;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-transactions .dropdown a:hover::before{
  width:calc(100% - 32px);
}
body.page-transactions .dropdown a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}
body.page-transactions .content{
  margin-left:290px;
  padding:20px 30px;
  color: var(--text);
  min-height:calc(100vh - 40px);
}
body.page-transactions .transaction{
  background: rgba(26,26,26,0.92);
  border:1px solid var(--border);
  color: var(--text);
  padding:12px 14px;
  margin-bottom:10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  cursor:pointer;
  border-radius:10px;
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}
body.page-transactions .transaction:hover{
  border-color: rgba(0,255,204,0.18);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  transform: translateY(-2px);
}

body.page-transactions .transaction .amount{ color:#ffb86b; }
body.page-transactions .transaction.withdrawal .amount{ color:#ff6b6b; }
body.page-transactions .transaction.deposit .amount{ color:#40d66b; }

body.page-transactions .modal{
  display:none;
  position:fixed;
  top:0; left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
  justify-content:center;
  align-items:center;
}
body.page-transactions .modal-content{
  background: #0d0f10;
  color: var(--text);
  border:1px solid rgba(255,255,255,0.08);
  padding:20px;
  border-radius:10px;
  width:420px;
  max-width:92%;
  text-align:left;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
}
body.page-transactions .label-left,
body.page-transactions .left{ color: var(--text); }
body.page-transactions .datetime-right,
body.page-transactions .right{ color: var(--accent2); }

body.page-transactions .modal-content h2{ text-align:center; }
body.page-transactions .modal-content p{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:6px 0;
  margin:0;
}
body.page-transactions p.phone-number-container{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  padding:6px 0;
}
body.page-transactions .left{ text-align:left; color:#000; width:50%; }
body.page-transactions .right{ text-align:right; color:blue; width:50%; flex:1; }
body.page-transactions .close{
  font-size:24px;
  color:red;
  cursor:pointer;
}
body.page-transactions .date-time-container{
  display:flex;
  justify-content:space-between;
  margin:10px 0;
  font-weight:bold;
}
body.page-transactions .label-left{ color:#000; }
body.page-transactions .datetime-right{ color:blue; }

@media (max-width: 768px){
  body.page-transactions .sidebar{
    width:100%;
    position:relative;
    left:auto;
    top:auto;
    height:auto;
    padding:16px;
    border-radius:0;
    border-left:none;
    border-right:none;
    box-shadow:none;
    margin-bottom:0;
  }
  body.page-transactions .sidebar img{ width:90px; }
  body.page-transactions .content{ margin-left:0; padding:16px; min-height:auto; }
  body.page-transactions .transaction{ flex-direction:column; gap:8px; align-items:flex-start; }
}
@media (max-width: 480px){
  body.page-transactions .modal-content{ padding:16px; width:100%; border-radius:0; }
  body.page-transactions .modal-content p{ flex-direction:column; gap:4px; }
}

body.page-terms{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  min-height:100vh;
  color:var(--text);
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}
body.page-terms .container{
  max-width:1100px;
  margin:100px auto 40px;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  padding:40px;
  border-radius:20px;
}
body.page-terms h1{
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin:0 0 20px;
}
body.page-terms h2{ background:linear-gradient(135deg, var(--primary), var(--accent)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
body.page-terms h3{ color:var(--accent); }
body.page-terms p,
body.page-terms li{ color:var(--text); line-height:1.8; }
body.page-terms ul{ padding-left:20px; }
body.page-terms li{ margin-bottom:6px; }
body.page-terms .section{ margin-bottom:28px; }

@media (max-width: 768px){
  body.page-terms .container{ padding:20px; margin:20px auto; border-radius:16px; }
}
@media (max-width: 480px){
  body.page-terms .container{ padding:16px; }
}

body.page-privacy{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  min-height:100vh;
  color:var(--text);
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}
body.page-privacy .container{
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  padding:40px;
  border-radius:20px;
  max-width:950px;
  width:100%;
  margin:100px auto 40px;
}
body.page-privacy .header{ text-align:center; margin-bottom:10px; }
body.page-privacy .header h2{
  font-size:28px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-privacy h3{
  color:var(--accent);
  margin-top:28px;
  font-size:18px;
}
body.page-privacy .container p,
body.page-privacy li{
  color:var(--text);
  line-height:1.8;
  text-align:left;
}
body.page-privacy ul{ padding-left:20px; }
body.page-privacy li{ margin-bottom:6px; }
body.page-privacy .button{
  display:inline-block;
  padding:14px 32px;
  margin-top:20px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border-radius:12px;
  cursor:pointer;
  border:none;
  font-size:16px;
  font-weight:600;
  transition:all .3s ease;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-privacy .button:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

@media (max-width: 768px){
  body.page-privacy .container{ padding:24px; margin:80px 12px 30px; }
}
@media (max-width: 480px){
  body.page-privacy .container{ padding:18px; border-radius:14px; }
  body.page-privacy .header h2{ font-size:22px; }
}

body.page-profile *{ box-sizing:border-box; }
body.page-profile{
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:var(--text);
  display:flex;
  min-height:100vh;
  margin:0;
  padding:20px;
  justify-content:center;
  align-items:center;
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}
body.page-profile .sidebar{
  width:250px;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  padding:24px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  height:calc(100vh - 40px);
  position:fixed;
  left:20px;
  top:20px;
  box-shadow:0 10px 30px rgba(0,0,0,0.3);
}
body.page-profile .sidebar .logo_png{
  height:120px !important;
  transform:none !important;
  transform-origin:unset !important;
  margin-bottom:10px;
}
body.page-profile .profile-icon{ font-size:72px; margin-bottom:12px; opacity:.8; }
body.page-profile .sidebar p{
  font-size:13px;
  margin:0 0 16px;
  text-align:center;
  color:var(--muted);
}
body.page-profile .sidebar p strong{ color:var(--text); }
body.page-profile .menu{ list-style:none; padding:0; width:100%; }
body.page-profile .menu li{
  padding:12px 16px;
  text-align:left;
  cursor:pointer;
  border-radius:10px;
  font-size:14px;
  transition:all .2s;
  margin-bottom:2px;
}
body.page-profile .menu li:hover{
  background:rgba(255,255,255,0.05);
}
body.page-profile .menu li.active{
  background:rgba(255,0,0,0.12);
  font-weight:600;
}
body.page-profile .menu li.active a{ color:var(--primary); }
body.page-profile .menu a{
  color:var(--text) !important;
  text-decoration:none;
  display:block;
}
body.page-profile .menu a:hover{ color:var(--primary) !important; }
body.page-profile .container{
  margin-left:290px;
  width:100%;
  max-width:600px;
  text-align:center;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  border-radius:20px;
  padding:40px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  position:relative;
}
body.page-profile h2{
  font-size:28px;
  margin-bottom:30px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-profile .profile-info{
  text-align:left;
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:16px;
  font-size:15px;
  width:100%;
}
body.page-profile .profile-info p{
  margin:0;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:10px 16px;
  background:rgba(255,255,255,0.03);
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.05);
}
body.page-profile .profile-info p strong{ color:var(--accent); }
body.page-profile .profile-info p span{ color:var(--text); }
body.page-profile .note{
  margin-top:20px;
  font-size:13px;
  color:var(--muted);
  text-align:center;
}
body.page-profile .back-button{
  position:absolute;
  top:16px;
  left:16px;
  color:#fff;
  font-size:14px;
  background:rgba(255,255,255,0.08);
  padding:8px 14px;
  border-radius:10px;
  text-decoration:none;
  transition:all .2s;
  border:1px solid rgba(255,255,255,0.08);
}
body.page-profile .back-button:hover{
  background:rgba(255,0,0,0.15);
  border-color:var(--primary);
}
body.page-profile #kyc-action-btn.btn{
  display:none;
  margin-left:8px;
  padding:4px 12px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border:none;
  border-radius:8px;
  font-size:12px;
  cursor:pointer;
  transition:all .2s;
  font-weight:600;
}
body.page-profile #kyc-action-btn.btn:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-1px);
}

@media (max-width: 800px){
  body.page-profile .sidebar{ width:200px; }
  body.page-profile .container{ margin-left:240px; }
}
@media (max-width: 600px){
  body.page-profile{ flex-direction:column; align-items:center; padding:12px; }
  body.page-profile .sidebar{
    width:100%;
    height:auto;
    position:relative;
    left:auto;
    top:auto;
    padding:16px;
    border-radius:16px;
    margin-bottom:12px;
  }
  body.page-profile .sidebar .logo_png{
    height:90px !important;
  }
  body.page-profile .container{
    margin-left:0;
    max-width:100%;
    padding:24px;
  }
  body.page-profile .menu{
    display:flex;
    justify-content:space-around;
    width:100%;
    flex-wrap:wrap;
  }
  body.page-profile .menu li{
    text-align:center;
    flex:1;
    min-width:80px;
    padding:10px 8px;
    font-size:12px;
  }
}

body.page-signin{
  margin:0;
  padding:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#fff;
}
body.page-signin header,
body.page-index header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  height: 70px;
  padding:14px 24px;
  overflow: visible;
  background:#333;
  color:#fff;
}
/* Removed unused .logo class rules */
/* Removed redundant page-specific logo rules */
/* get-started replaced by signup-btn */

body.page-signin .container{
  display:flex;
  justify-content:space-between;
  padding:40px;
  gap:20px;
}
body.page-signin .left,
body.page-signin .right{
  flex:1;
  padding:40px;
  border-radius:20px;
  background: rgba(26,26,26,0.95);
  backdrop-filter: blur(15px);
  border: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 20px 50px rgba(0,0,0,0.5);
  transition: all 0.3s ease;
}
body.page-signin .left:hover,
body.page-signin .right:hover{
  transform: translateY(-5px);
  box-shadow: 0 30px 60px rgba(0,0,0,0.6);
  border-color: rgba(255,0,0,0.2);
}
body.page-signin .box{ text-align:center; padding:20px; }
body.page-signin .form-group{ margin-bottom:20px; text-align:left; }
body.page-signin .form-group label{
  display:block;
  margin-bottom:5px;
  font-weight:bold;
}
body.page-signin .form-group input{
  width:100%;
  padding:15px;
  border: 2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background: rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  transition: all 0.3s ease;
  outline: none;
}
body.page-signin .form-group input:focus{
  border-color: #ff0000;
  box-shadow: 0 0 20px rgba(255,0,0,0.3);
  background: rgba(255,255,255,0.1);
}
body.page-signin .btn-login,
body.page-signin .btn-register{
  width:100%;
  padding:18px;
  background: linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-size:18px;
  font-weight:600;
  transition: all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow: 0 5px 20px rgba(255,0,0,0.3);
  margin-top:20px;
}
body.page-signin .btn-login:hover,
body.page-signin .btn-register:hover{
  background: linear-gradient(135deg, #cc0000, #990000);
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(255,0,0,0.4);
}

body.page-signin .link{
  display:block;
  text-align:right;
  margin-top:10px;
  color:#fff;
}
body.page-signin .benefits-list{ margin-bottom:20px; text-align:left; }
body.page-signin .benefits-list li{ 
  margin-bottom:12px; 
  padding-left: 25px;
  position: relative;
  color: #ccc;
}
body.page-signin .benefits-list li::before{
  content: "✓";
  position: absolute;
  left: 0;
  color: #00ffcc;
  font-weight: bold;
}
body.page-signin .error{
  color:#ff4d4d;
  margin-top:-15px;
  margin-bottom:15px;
  font-size:.9em;
}

body.page-signin .exchange-highlight{ text-align:center; margin:60px 0; }
body.page-signin .box h2,
body.page-signin .exchange-title{
  font-size: 2.5rem;
  background: linear-gradient(135deg, #ff0000, #00ffcc);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 20px;
  text-shadow: 0 0 20px rgba(255,0,0,0.2);
}
body.page-signin .exchange-boxes{
  display:flex;
  justify-content:space-around;
  flex-wrap:wrap;
  gap:20px;
}
body.page-signin .exchange-box{
  flex:1 1 45%;
  padding:20px;
  border-radius:10px;
  background:transparent;
  color:#fff;
  max-width:500px;
}
body.page-signin .left-box{ box-shadow:-10px 0 20px rgba(255,255,255,0.1); text-align:left; }
body.page-signin .right-box{ box-shadow:10px 0 20px rgba(255,255,255,0.1); text-align:right; }

@media (max-width: 768px){
  body.page-signin .container{ flex-direction:column; padding:18px; }
  body.page-signin .exchange-boxes{ flex-direction:column; align-items:center; }
  body.page-signin .exchange-box{ text-align:center; max-width:90%; }
}

body.page-signup{
  margin:0;
  padding:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#fff;
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}
body.page-signup header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 24px;
}
body.page-signup header nav.right{
  display:flex;
  align-items:center;
  gap:16px;
}
body.page-signup header nav.right a{
  color:#fff;
  text-decoration:none;
  font-weight:500;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  position:relative;
}
body.page-signup header nav.right a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-signup header nav.right a:hover::before{
  width:100%;
  left:0;
}
body.page-signup header nav.right a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}
body.page-signup .container{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:calc(100vh - 70px);
  padding:30px 16px;
}
body.page-signup .box{
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  padding:40px;
  text-align:center;
  border-radius:20px;
  width:100%;
  max-width:420px;
}
body.page-signup .box h2{
  margin-bottom:30px;
  font-size:28px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-signup .form-group{ margin-bottom:20px; text-align:left; }
body.page-signup .form-group label{
  display:block;
  margin-bottom:5px;
  font-weight:bold;
  color:#ccc;
}
body.page-signup .form-group input{
  width:100%;
  padding:15px;
  border:2px solid rgba(255,255,255,0.08);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  transition:all .3s ease;
  outline:none;
  box-sizing:border-box;
}
body.page-signup .form-group input:focus{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
  background:rgba(255,255,255,0.1);
}
body.page-signup .form-group input::placeholder{
  color:rgba(255,255,255,0.4);
}
body.page-signup #acceptTerms{
  margin-top:10px;
  accent-color:var(--primary);
}
body.page-signup .btn-register{
  width:100%;
  padding:18px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-size:18px;
  font-weight:600;
  transition:all .3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
  margin-top:20px;
}
body.page-signup .btn-register:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}
body.page-signup .btn-register:disabled{
  opacity:.5;
  cursor:not-allowed;
  transform:none;
}
body.page-signup .sign-in-link{
  margin-top:20px;
  display:block;
  text-align:center;
  color:rgba(255,255,255,0.6);
  font-size:14px;
}
body.page-signup .sign-in-link a{
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}
body.page-signup .sign-in-link a:hover{
  text-decoration:underline;
  color:#00ffcc;
}
body.page-signup .message{ text-align:center; margin-top:20px; font-weight:bold; }
body.page-signup .message.success{ color:#40d66b; }
body.page-signup .message.error{ color:#ff4d4d; }
body.page-signup #phone::placeholder{ color:rgba(255,255,255,0.4); }
body.page-signup #phone{ width:100%; box-sizing:border-box; }

/* Verification modals */
body.page-signup .modal-overlay{
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.8);
  z-index:9999;
}
body.page-signup .modal-content{
  background:rgba(26,26,26,0.98);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  padding:30px;
  border-radius:20px;
  max-width:400px;
  margin:100px auto;
  text-align:center;
  color:#fff;
  position:relative;
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
}
body.page-signup .modal-content h3{
  margin-bottom:20px;
  font-size:22px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-signup .close-modal-btn{
  position:absolute;
  top:10px;
  right:15px;
  background:none;
  border:none;
  color:rgba(255,255,255,0.6);
  font-size:28px;
  cursor:pointer;
  transition:.2s;
  line-height:1;
}
body.page-signup .close-modal-btn:hover{
  color:#fff;
}
body.page-signup .verify-option-btn{
  margin:8px;
  padding:12px 24px;
  border:none;
  border-radius:12px;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:all .2s;
}
body.page-signup .verify-option-btn:hover{
  transform:translateY(-2px);
}
body.page-signup .verify-option-btn.email{ background:var(--primary); color:#fff; }
body.page-signup .verify-option-btn.whatsapp{ background:#00a884; color:#fff; }
body.page-signup .verify-option-btn.sms{ background:#007bff; color:#fff; }
body.page-signup #verificationCodeInput{
  width:80%;
  padding:12px;
  margin-bottom:15px;
  border-radius:10px;
  border:2px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  text-align:center;
  outline:none;
}
body.page-signup #verificationCodeInput:focus{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
}
body.page-signup #verifyCodeBtn{
  width:80%;
  padding:14px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-size:16px;
  font-weight:600;
  transition:all .3s;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-signup #verifyCodeBtn:hover{
  transform:translateY(-2px);
}
body.page-signup #verifyLoading{
  display:none;
  margin-top:10px;
  color:rgba(255,255,255,0.6);
}
body.page-signup #verifyError{
  margin-top:10px;
  color:#ff4d4d;
}
body.page-signup #errorMsg{
  display:none;
  color:#ff4d4d;
  margin-top:10px;
}

/* Loading spinner */
body.page-signup #loadingSpinner{
  display:none;
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:9999;
}

/* intl-tel-input fixes */
body.page-signup .iti{ width:100% !important; }
body.page-signup .iti__flag{ background-image:url("../img/flags.png") !important; }
body.page-signup .iti__country-list{
  background:rgba(26,26,26,0.98) !important;
  border:1px solid rgba(255,255,255,0.1) !important;
  color:#fff !important;
  max-height:260px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  z-index:999999 !important;
  border-radius:10px !important;
}
body.page-signup .iti__country{ color:#fff !important; }
body.page-signup .iti__highlight{ background:rgba(255,0,0,0.15) !important; }
body.page-signup .iti__dropdown-content{ z-index:999999 !important; }

@media (max-width: 600px){
  body.page-signup .container{ padding:16px; }
  body.page-signup .box{ padding:24px; width:100%; }
}

body.page-news{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#ccc;
}
body.page-news header{
  position:sticky;
  top:0;
  background: rgba(17,17,17,0.95);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:15px 30px;
  z-index:1000;
  backdrop-filter: blur(8px);
  border-bottom:1px solid #222;
}
body.page-news .logo{ 
  display:flex;
  height: 70px;
  align-items:center; 
  gap:10px; 
}
body.page-news .logo img{ 
  height: 70px;
  width: auto;
  max-height: 70px;
  display:block;
  object-fit:contain;
  transform: scale(2.2) translateY(2px);
  transform-origin: left center;
  filter: drop-shadow(0 2px 10px rgba(0,255,204,.35));
}
body.page-news .nav-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
body.page-news .nav-actions input{
  max-width:160px;
  padding:8px 12px;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:14px;
  outline:none;
  transition:all .3s ease;
  box-sizing:border-box;
}
body.page-news .nav-actions input:focus{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
  background:rgba(255,255,255,0.1);
}
body.page-news .nav-actions input::placeholder{
  color:rgba(255,255,255,0.4);
}
body.page-news .nav-actions a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-news .nav-actions a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-news .nav-actions a:hover::before{
  width:100%;
  left:0;
}
body.page-news .nav-actions a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}

body.page-news .main-title{
  text-align:center;
  font-size:2.2em;
  margin:30px 0;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-news .ticker {
  width: 100%;
  min-height: 44px;

  display: flex;
  align-items: center;

  overflow: hidden;
  white-space: nowrap;

  background: #111;
  color: var(--accent);

  border-top: 1px solid #222;
  border-bottom: 1px solid #222;
}

body.page-news .ticker span {
  display: inline-block;

  min-width: max-content;

  padding: 11px 0 11px 100%;

  font-size: 0.9rem;
  font-weight: 600;

  animation:
    mc_scrollTicker
    32s
    linear
    infinite;
}

@keyframes mc_scrollTicker {
  from {
    transform:
      translateX(0);
  }

  to {
    transform:
      translateX(-100%);
  }
}

@media (
  prefers-reduced-motion: reduce
) {
  body.page-news .ticker {
    overflow-x: auto;
  }

  body.page-news .ticker span {
    padding-left: 16px;
    padding-right: 16px;

    animation: none;
  }
}

body.page-news .categories{
  max-width:1200px;
  margin:0 auto 10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:0 20px;
}
body.page-news .categories button{
  background:#1e1e1e;
  border:1px solid #222;
  color:#fff;
  padding:8px 12px;
  border-radius:8px;
  cursor:pointer;
}
body.page-news .categories button.active{
  outline:2px solid var(--accent);
}

body.page-news .news-grid{
  max-width:1200px;
  margin:auto;
  padding:30px 20px;
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:20px;
}
body.page-news .news-card{
  background:rgba(26,26,26,0.95);
  padding:20px;
  border-radius:20px;
  transition:.25s;
  border:1px solid rgba(255,255,255,0.04);
  backdrop-filter:blur(15px);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-news .news-card:hover{
  transform:translateY(-5px);
  box-shadow:0 4px 10px rgba(255,0,0,0.1);
}
body.page-news .news-card h3{ color: var(--accent); margin:0 0 10px; }

body.page-news .news-layout{
  display:grid;
  grid-template-columns: 2fr 1fr;
  gap:20px;
  max-width:1200px;
  margin:auto;
  padding:20px;
}
body.page-news .side-news{
  display:flex;
  flex-direction:column;
  gap:15px;
}
body.page-news .widget{
  background:#141414;
  border:1px solid #222;
  border-radius:10px;
  padding:12px;
}
body.page-news .widget h4{ margin:0 0 8px; color: var(--accent); }
body.page-news #trendingCoins{ list-style:none; margin:0; padding:0; }
body.page-news #trendingCoins li{
  padding:6px 0;
  border-bottom:1px dashed #222;
}

body.page-news .headline-slider{
  position:relative;
  overflow:hidden;
  border-radius:12px;
  margin:20px auto;
  max-width:1200px;
}
body.page-news .headline-slider .slide{ display:none; position:relative; }
body.page-news .headline-slider .slide.active{ display:block; }
body.page-news .headline-slider img{
  width:100%;
  height:auto;
  border-radius:12px;
}
body.page-news .slide-caption{
  position:absolute;
  left:20px;
  bottom:20px;
  right:20px;
  background:rgba(0,0,0,.45);
  padding:14px;
  border-radius:10px;
}
body.page-news .slider-dots{ text-align:center; margin-top:8px; }
body.page-news .slider-dots .dot{
  width:10px;height:10px;border-radius:50%;
  border:0;margin:0 4px;
  background:#444;cursor:pointer;
}
body.page-news .slider-dots .dot.active{ background: var(--accent); }

body.page-news .pager{
  max-width:1200px;
  margin:24px auto 56px;
  display:flex;
  gap:12px;
  justify-content:center;
  align-items:center;
  padding:0 20px;
}
body.page-news .pager button{
  padding:10px 14px;
  border-radius:8px;
  border:1px solid #333;
  background:#1a1a1a;
  color:#fff;
  cursor:pointer;
}
body.page-news #pageLabel{ opacity:.9; }

@media (max-width: 900px){
  body.page-news .news-layout{ grid-template-columns:1fr; }
  body.page-news .side-news{ flex-direction:row; overflow-x:auto; }
  body.page-news .widget{ min-width:260px; }
}

body.page-news-article{
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#ddd;
  margin:0;
  padding:0;
}

body.page-news-article .site-header{
  position:sticky;
  top:0;
  z-index:1000;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 22px;
  background: rgba(17,17,17,0.92);
  backdrop-filter: blur(8px);
  border-bottom:1px solid #222;
}
body.page-news-article .logo{ 
  display:flex;
  height: 70px;
  align-items:center; 
  gap:10px; 
}
body.page-news-article .logo img{ 
  height: 70px;
  width: auto;
  max-height: 70px;
  display:block;
  object-fit:contain;
  transform: scale(2.2) translateY(2px);
  transform-origin: left center;
  filter: drop-shadow(0 2px 10px rgba(0,255,204,.35));
}
body.page-news-article .nav-links{
  display:flex;
  gap:10px;
  align-items:center;
}
body.page-news-article .nav-links a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-news-article .nav-links a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-news-article .nav-links a:hover::before{
  width:100%;
  left:0;
}
body.page-news-article .nav-links a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}

body.page-news-article .article-container{
  display:grid;
  grid-template-columns: 2fr 1fr;
  gap:30px;
  max-width:1200px;
  margin:40px auto;
  padding:20px;
}
body.page-news-article .main-article{
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border-radius:20px;
  padding:25px;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  border:1px solid rgba(255,255,255,0.06);
}
body.page-news-article .main-article img{
  width:100%;
  border-radius:12px;
  margin:20px 0;
}
body.page-news-article .main-article h1{ margin:0 0 10px; background:linear-gradient(135deg, var(--primary), var(--accent)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
body.page-news-article .meta{
  font-size:14px;
  color:#888;
  margin-bottom:10px;
}
body.page-news-article .sidebar{
  background:rgba(26,26,26,0.95);
  border-radius:20px;
  padding:20px;
  border:1px solid rgba(255,255,255,0.06);
  backdrop-filter:blur(15px);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-news-article .related-list{
  display:grid;
  gap:12px;
}
body.page-news-article .related-list article{
  display:flex;
  gap:10px;
  align-items:center;
}
body.page-news-article .related-list img{
  width:80px;
  height:60px;
  border-radius:8px;
  object-fit:cover;
}
body.page-news-article .bottom-news{
  max-width:1200px;
  margin:10px auto 60px;
  padding:0 20px;
}
body.page-news-article .bottom-news h3{
  color: var(--accent);
  margin:0 0 12px;
}
body.page-news-article .news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;
}

@media (max-width: 900px){
  body.page-news-article .article-container{
    grid-template-columns:1fr;
  }
}

body.page-portfolio{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#eaf6f5;
}

body.page-portfolio .container{
  max-width:1250px;
  margin:26px auto;
  padding:0 18px;
  display:none;
  flex-direction:column;
  gap:22px;
}
body.page-portfolio .container.auth-passed{
  display:flex;
}
body.page-portfolio #portfolioLoading {
  position: fixed;
  inset: 0;

  width: 100%;
  min-height: 100vh;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  box-sizing: border-box;
  padding: 20px;
  text-align: center;

  background:
    linear-gradient(
      180deg,
      #0b0e11 0%,
      #12161c 100%
    );

  z-index: 20000;
}
body.page-portfolio #portfolioLoading .loader{
  width:48px;
  height:48px;
  border:3px solid rgba(255,255,255,0.1);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:spin .8s linear infinite;
  margin-bottom:20px;
}
body.page-portfolio #portfolioLoading p{
  color:var(--muted);
  font-size:16px;
}
body.page-portfolio #portfolioLoading .error-icon{
  font-size:48px;
  margin-bottom:16px;
}
body.page-portfolio #portfolioLoading .error-msg{
  color:#ff6b6b;
  font-size:15px;
  margin-bottom:20px;
}
body.page-portfolio #portfolioLoading .retry-btn{
  padding:12px 28px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border:none;
  border-radius:12px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:.3s;
}
body.page-portfolio #portfolioLoading .retry-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
@keyframes spin{
  to{ transform:rotate(360deg); }
}
body.page-portfolio h1{
  text-align:center;
  margin:8px 0 0;
  font-size:28px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-portfolio .card{
  background:rgba(26,26,26,0.95);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:20px;
  padding:20px;
  backdrop-filter:blur(15px);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-portfolio .grid{ display:grid; gap:18px; }
body.page-portfolio .overview-grid{
  display:grid;
  grid-template-columns:1fr 380px;
  gap:16px;
  align-items:start;
}
body.page-portfolio .summary-big{
  font-size:24px;
  color: var(--accent);
  font-weight:700;
}
body.page-portfolio .small-muted{
  color:var(--muted);
  font-size:13px;
  margin-top:6px;
}
body.page-portfolio .date-filter{
  display:flex;
  gap:8px;
  align-items:center;
  margin-top:6px;
  flex-wrap:wrap;
}
body.page-portfolio input[type=date]{
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  padding:8px 12px;
  border-radius:8px;
  color:#fff;
  font-size:14px;
  outline:none;
}
body.page-portfolio input[type=date]:focus{
  border-color:var(--primary);
}
body.page-portfolio button.btn{
  background:linear-gradient(135deg, #ff0000, #cc0000);
  border:none;
  padding:10px 18px;
  border-radius:8px;
  color:#fff;
  font-weight:600;
  cursor:pointer;
  transition:all .3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  font-size:13px;
}
body.page-portfolio button.btn:hover{
  background:linear-gradient(135deg, #cc0000, #990000);
  box-shadow:0 5px 15px rgba(255,0,0,0.3);
}
body.page-portfolio .btn-reset{
  background:rgba(255,255,255,0.08) !important;
  color:#fff !important;
}
body.page-portfolio .btn-reset:hover{
  background:rgba(255,255,255,0.15) !important;
  box-shadow:none !important;
}
body.page-portfolio .chart-wrap{
  margin-top:14px;
  background:rgba(0,0,0,0.3);
  padding:12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.04);
}
body.page-portfolio .wallets-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}
body.page-portfolio .wallet{
  background:rgba(18,20,22,0.9);
  padding:16px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.06);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position:relative;
  overflow:hidden;
}
body.page-portfolio .wallet:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 30px rgba(255,0,0,0.1);
  border-color:rgba(255,0,0,0.2);
}
body.page-portfolio .wallet h3{ margin:0; font-size:15px; color: var(--accent); }
body.page-portfolio .addr{ color:var(--muted); font-size:12px; margin-top:6px; word-break:break-all; }
body.page-portfolio .bal{ color:var(--accent); font-weight:700; margin-top:10px; }
body.page-portfolio .badge{
  position:absolute;
  right:10px;
  top:10px;
  font-size:11px;
  padding:4px 10px;
  border-radius:20px;
  background:rgba(255,255,255,0.05);
  color:var(--muted);
}
body.page-portfolio table{ width:100%; border-collapse:collapse; }
body.page-portfolio th, 
body.page-portfolio td{
  padding:12px 10px;
  border-bottom:1px solid rgba(255,255,255,0.04);
  text-align:left;
  font-size:13px;
}
body.page-portfolio th{ color: var(--primary); background:rgba(0,0,0,0.2); font-weight:600; text-transform:uppercase; letter-spacing:0.5px; }
body.page-portfolio tbody td:nth-child(1),
body.page-portfolio tbody td:nth-child(3){
  color:var(--accent);
  font-weight:600;
}
body.page-portfolio .status-completed{ color:#40d66b; font-weight:700; }
body.page-portfolio .status-rejected{ color:#ff6b6b; font-weight:700; }
body.page-portfolio .status-pending{ color:#f3d26b; font-weight:700; }
body.page-portfolio .details-btn{
  background:transparent;
  border:1px solid rgba(255,255,255,0.08);
  padding:6px 12px;
  border-radius:6px;
  color:var(--muted);
  cursor:pointer;
  transition:all .2s;
  font-size:12px;
}
body.page-portfolio .details-btn:hover{
  border-color:var(--accent);
  color:var(--accent);
}

body.page-portfolio .payments{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
}
body.page-portfolio .paybox{
  background:rgba(17,17,17,0.8);
  padding:16px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.04);
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
body.page-portfolio .paybox:hover{
  transform:translateY(-4px);
  box-shadow:0 15px 30px rgba(255,0,0,0.08);
  border-color:rgba(255,0,0,0.15);
}
body.page-portfolio .paybox h4{ margin:0; color:var(--accent); font-size:16px; }
body.page-portfolio .paybox p{ color:var(--muted); margin:8px 0 0; font-size:13px; }

body.page-portfolio .modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0.7);
  z-index:900;
  visibility:hidden;
  opacity:0;
  transition:opacity .2s;
}
body.page-portfolio .modal.show{
  visibility:visible;
  opacity:1;
}
body.page-portfolio .modal-card{
  background:#0d0f10;
  border:1px solid rgba(255,255,255,0.06);
  padding:24px;
  border-radius:12px;
  width:560px;
  max-width:94%;
}
body.page-portfolio .close-btn{
  background:rgba(255,255,255,0.08);
  border:none;
  padding:8px 16px;
  border-radius:8px;
  color:var(--muted);
  cursor:pointer;
  transition:all .2s;
  font-size:13px;
}
body.page-portfolio .close-btn:hover{
  background:rgba(255,255,255,0.15);
  color:#fff;
}

body.page-portfolio .flex-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
}
body.page-portfolio .flex-row-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}
body.page-portfolio .flex-gap{
  display:flex;
  align-items:center;
  gap:12px;
}
body.page-portfolio .text-right{
  text-align:right;
}

body.page-portfolio .overview-body{
  margin-top:14px;
}
body.page-portfolio .filter-wrap{
  margin-left:18px;
}
body.page-portfolio .filter-label{
  font-size:13px;
  color:var(--muted);
}

body.page-portfolio .grid-two{
  grid-template-columns:1fr 420px;
}

body.page-portfolio .market-list{
  margin-top:12px;
}
body.page-portfolio .market-row {
  display: grid;
  grid-template-columns:
    minmax(120px, 1fr)
    auto
    90px;

  align-items: center;
  gap: 16px;

  padding: 11px 4px;

  border-bottom:
    1px solid
    rgba(255,255,255,0.05);
}

body.page-portfolio .market-row:last-child {
  border-bottom: none;
}

body.page-portfolio .market-name {
  color: var(--text);
  font-weight: 600;
}

body.page-portfolio .market-price {
  color: var(--accent);
  font-weight: 700;
  text-align: right;
}

body.page-portfolio .market-change {
  font-weight: 600;
  text-align: right;
}

body.page-portfolio .market-change.up {
  color: #40d66b;
}

body.page-portfolio .market-change.down {
  color: #ff6b6b;
}

@media (max-width: 600px) {
  body.page-portfolio .market-row {
    grid-template-columns:
      minmax(90px, 1fr)
      auto
      72px;

    gap: 8px;

    font-size: 13px;
  }
}
body.page-portfolio .tx-details{
  margin-top:12px;
  color:var(--muted);
  font-size:14px;
}

body.page-portfolio .section-heading{
  margin:0;
  color:var(--accent);
}
body.page-portfolio .section-heading-sm{
  margin-bottom:8px;
}
body.page-portfolio .section-heading-btm{
  margin:0 0 12px;
}
body.page-portfolio .section-heading-red{
  margin:0;
  color:var(--primary);
}

body.page-portfolio .dist-box{
  background:rgba(13,15,16,0.8);
  padding:14px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.04);
}
body.page-portfolio .dist-row{
  display:flex;
  justify-content:space-between;
  margin-top:10px;
  font-size:14px;
}
body.page-portfolio .dist-row:first-child{margin-top:0;}
body.page-portfolio .dist-label{color:var(--muted);}
body.page-portfolio .dist-value{font-weight:700;}
body.page-portfolio .dist-value.cyan{color:var(--accent);}
body.page-portfolio .dist-value.muted{color:var(--muted);}
body.page-portfolio .dist-value.orange{color:#ffb86b;}

body.page-portfolio .dist-divider{
  border:none;
  border-top:1px solid rgba(255,255,255,0.04);
  margin:12px 0;
}

body.page-portfolio .top-route-label{
  font-size:13px;
  color:var(--muted);
}
body.page-portfolio .top-route-value{
  margin-top:8px;
  font-weight:700;
  color:#fff;
}
body.page-portfolio .dist-note{
  font-size:12px;
  color:var(--muted);
  margin-top:10px;
}

body.page-portfolio .refresh-btn{
  color:var(--accent);
  cursor:pointer;
  font-size:13px;
  transition:color .2s;
}
body.page-portfolio .refresh-btn:hover{
  color:#fff;
}

@media(max-width:860px){
  body.page-portfolio .overview-grid{ grid-template-columns:1fr; }
  body.page-portfolio .grid-two{ grid-template-columns:1fr; }
  body.page-portfolio table{ display:block; overflow-x:auto; }
}

body.page-liquidations{
  --bg:#0b0e11;
  --bg2:#12161c;
  --panel:#11151c;
  --panel2:#121923;
  --muted:#9aa6b2;
  --good:#1ecb83;
  --bad:#ff4d4f;

  margin:0;
  background:linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#e9eef3;
}

body.page-liquidations a{ color:inherit }

body.page-liquidations .metrics{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(51,51,51,0.95);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--border)
}
body.page-liquidations .metrics-inner{
  max-width:1280px;
  margin:auto;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  padding:6px 16px;
  align-items:center
}

body.page-liquidations .brand{
  display:flex;
  align-items:center;
}

body.page-liquidations .headline{
  justify-content: flex-end;
  display:grid;
  flex-wrap: wrap;
  grid-auto-flow:column;
  gap:10px;
  align-items:center
}
body.page-liquidations .metric{
  display:flex;
  gap:6px;
  align-items:baseline;
  padding:4px 8px;
  border-radius:9px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.05)
}
body.page-liquidations .metric small{ color:var(--muted) }
body.page-liquidations .delta.up{ color:var(--good) }
body.page-liquidations .delta.down{ color:var(--bad) }

body.page-liquidations .navwrap{
  max-width:1280px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:6px 16px
}
body.page-liquidations .nav-center{
  display:flex;
  gap:18px;
  justify-content:center
}
body.page-liquidations .nav-center a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-liquidations .nav-center a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-liquidations .nav-center a:hover::before{
  width:100%;
  left:0;
}
body.page-liquidations .nav-center a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}

body.page-liquidations .nav-right{
  display:flex;
  gap:10px;
  justify-content:flex-end
}
body.page-liquidations .search{
  display:flex;
  align-items:center;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  padding:8px 12px;
  min-width:220px;
  background:rgba(255,255,255,0.05);
  transition:all .3s ease;
}
body.page-liquidations .search:focus-within{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
  background:rgba(255,255,255,0.1);
}
body.page-liquidations .search input{
  all:unset;
  color:#fff;
  width:100%;
  font-family:inherit;
  font-size:14px;
}
body.page-liquidations .search input::placeholder{
  color:rgba(255,255,255,0.4);
}

body.page-liquidations .container{
  max-width:1280px;
  margin:20px auto;
  padding:0 16px;
  display:grid;
  gap:20px
}
body.page-liquidations .row{
  display:grid;
  grid-template-columns:1.33fr .9fr;
  gap:20px
}

body.page-liquidations .card{
  background:rgba(26,26,26,0.95);
  border:1px solid rgba(255,255,255,.06);
  border-radius:20px;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  backdrop-filter:blur(15px);
}
body.page-liquidations .linkrow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
body.page-liquidations .linkbtn{
  display:inline-block;
  padding:8px 16px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:8px;
  color:#fff;
  font-size:13px;
  font-weight:600;
  transition:all .2s;
  text-decoration:none;
}
body.page-liquidations .linkbtn:hover{
  background:var(--primary);
  border-color:var(--primary);
  box-shadow:0 0 15px rgba(255,0,0,0.2);
}

body.page-liquidations .card-header-bordered{
  border-top:1px solid rgba(255,255,255,.06) !important;
}
body.page-liquidations .card-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.06)
}
body.page-liquidations .card-title{ font-weight:700 }

body.page-liquidations .tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
body.page-liquidations .tag{
  background:#18202b;
  border:1px solid rgba(255,255,255,.08);
  padding:6px 10px;
  border-radius:8px;
  font-size:13px;
  cursor:pointer
}
body.page-liquidations .tag:hover{ background:#1b2430 }
body.page-liquidations .dropdown select{
  background:#18202b;
  color:#e9eef3;
  border:1px solid rgba(255,255,255,.08);
  padding:6px 10px;
  border-radius:8px
}

body.page-liquidations .heatmap{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:48px;
  gap:8px;
  padding:12px
}
body.page-liquidations .cell{
  position:relative;
  border-radius:10px;
  padding:8px;
  display:flex;
  align-items:flex-end;
  font-weight:700
}
body.page-liquidations .cell.red{
  background:linear-gradient(180deg,#5b1616,#a81515)
}
body.page-liquidations .cell.green{
  background:linear-gradient(180deg,#0f3a2a,#178a5b)
}
body.page-liquidations .cell:hover{
  outline:2px solid rgba(255,255,255,.25)
}
body.page-liquidations .cell[data-w="2"]{ grid-column:span 2 }
body.page-liquidations .cell[data-w="3"]{ grid-column:span 3 }
body.page-liquidations .cell[data-w="4"]{ grid-column:span 4 }

body.page-liquidations .kpi{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  padding:12px
}
body.page-liquidations .k{
  background:#161d27;
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  padding:10px
}
body.page-liquidations .k .v{
  font-size:18px;
  font-weight:800
}

body.page-liquidations .table-wrap{
  padding:8px 12px;
}
body.page-liquidations .note-margins{
  margin:12px 2px 2px;
}
body.page-liquidations .search-wide{
  min-width:260px;
}

body.page-liquidations table{
  width:100%;
  border-collapse:separate;
  border-spacing:0
}
body.page-liquidations th,
body.page-liquidations td{
  padding:10px 12px;
  text-align:left
}
body.page-liquidations th{
  color:var(--primary);
  border-bottom:1px solid rgba(255,255,255,.06);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.5px;
  font-size:12px;
}
body.page-liquidations tbody tr{
  background:rgba(255,255,255,.02)
}
body.page-liquidations tbody tr:hover{
  background:rgba(255,255,255,.06)
}

body.page-liquidations .tape{
  max-height:420px;
  overflow:auto
}
body.page-liquidations .tape-row{
  display:grid;
  grid-template-columns:1.2fr .7fr .7fr .6fr;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.06)
}

body.page-liquidations .chart{
  height:220px;
  margin:12px;
  border-radius:12px;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 60px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 40px)
}

@media (max-width:1024px){
  body.page-liquidations .row{
    grid-template-columns:1fr
  }
}
@media (max-width:768px){
  body.page-liquidations .table-wrap{ overflow-x:auto; }
  body.page-liquidations .headline{ display:flex; flex-wrap:wrap; justify-content:flex-end; }
  body.page-liquidations .heatmap{ grid-template-columns:repeat(6,1fr); grid-auto-rows:40px; }
  body.page-liquidations .kpi{ grid-template-columns:repeat(2,1fr); }
  body.page-liquidations .tape-row{ grid-template-columns:1fr 1fr; }
  body.page-liquidations .metrics-inner{ grid-template-columns:1fr; justify-items:center; gap:4px; }
  body.page-liquidations .navwrap{ grid-template-columns:1fr; justify-items:center; gap:8px; }
  body.page-liquidations .search{ min-width:160px; }
}
@media (max-width:480px){
  body.page-liquidations .heatmap{ grid-template-columns:repeat(3,1fr); grid-auto-rows:36px; gap:4px; }
  body.page-liquidations .kpi{ grid-template-columns:1fr; }
  body.page-liquidations .tape-row{ grid-template-columns:1fr; gap:4px; }
}

body.page-kyc{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  min-height:100vh;
  color:var(--text);
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}

body.page-kyc .container{
  max-width:1100px;
  margin:100px auto 40px;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  padding:40px;
  border-radius:20px;
}

body.page-kyc .header{
  text-align:center;
  margin-bottom:12px;
}

body.page-kyc .header p{
  text-align:center;
  margin:0;
  color:var(--muted);
}

body.page-kyc h1{
  margin:0 0 8px;
  font-size:28px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-kyc h2{
  margin-top:28px;
  font-size:20px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-kyc h3{
  color:var(--accent);
  margin-top:20px;
  font-size:16px;
}

body.page-kyc p,
body.page-kyc li{
  color:var(--text);
  line-height:1.8;
}

body.page-kyc ul{ padding-left:20px; }
body.page-kyc li{ margin-bottom:6px; }

body.page-kyc .note{
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  border-left:3px solid var(--primary);
  color:var(--text);
  padding:14px 16px;
  border-radius:10px;
  margin:10px 0 18px;
}

body.page-kyc .button{
  display:inline-block;
  padding:14px 32px;
  margin-top:18px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border-radius:12px;
  cursor:pointer;
  border:none;
  font-size:16px;
  font-weight:600;
  transition:all .3s ease;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-kyc .button:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

body.page-kyc .center{ text-align:center; }

body.page-kyc .badge{
  display:inline-block;
  padding:4px 12px;
  border-radius:999px;
  background:rgba(255,0,0,0.15);
  color:var(--primary);
  font-size:12px;
  font-weight:600;
  margin-right:6px;
  margin-top:6px;
}

@media (max-width: 768px){
  body.page-kyc .container{ padding:24px; margin:80px 12px 30px; }
}
@media (max-width: 480px){
  body.page-kyc .container{ padding:18px; border-radius:14px; }
  body.page-kyc h1{ font-size:22px; }
  body.page-kyc .badge{ font-size:11px; padding:3px 8px; }
}

body.page-index{
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin:0;
  padding:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#ffffff;
  line-height:1.6;
}

body.page-index header{
  height:70px !important;
  display:flex !important;
  justify-content:space-between !important;
  background: rgba(51,51,51,0.95) !important;
  border-bottom:1px solid var(--border) !important;
  align-items:center !important;
  padding:0 20px !important;
  background-color: rgba(51, 51, 51, 0.95);
  backdrop-filter: blur(6px) !important;
  color:#fff;
  position:sticky;
  top:0;
  z-index:1000;
  box-shadow:none !important;
}
header img.logo,
body.page-index header img.logo{
  height:70px;
  width:auto;
  object-fit:contain;
  filter: drop-shadow(0 2px 10px rgba(0,255,204,.35));
}
body.page-index header .left{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  height:70px !important;
  width:auto !important;
  transform:none !important;
  filter:none !important;
  object-fit:unset !important;
  max-height: 70px;
  transform-origin: left center;
}
body.page-index header.hidden{
  display:none !important;
}
body.page-index header .left img,
body.page-index header .logo img,
body.page-index header a.logo img,
body.page-signin header .left img,
body.page-signin header .logo img,
body.page-signin header a.logo img{
  height:40px !important;
  width:auto !important;
  max-height:70px !important;
  display:block !important;
  object-fit:contain !important;
  transform:none !important;
  filter: drop-shadow(0 2px 10px rgba(0,255,204,.35)) !important;
}
body.page-index .logo{
  display:flex !important;
  width:auto !important;
  height:70px !important;
  align-items:center !important;
  border-radius:8px;
  gap:10px !important;
}

body.page-index .brand-name{
  font-size:1.3rem;
  font-weight:700;
  color:#ff0000;
  text-shadow: 0 0 10px rgba(255,0,0,0.3);
}

body.page-index .right{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}

body.page-index .right a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition: all 0.3s ease;
  font-weight:500;
  position:relative;
}

body.page-index .right a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:#ff0000;
  transition: all 0.3s ease;
}

body.page-index .right a:hover::before{
  width:100%;
  left:0;
}

body.page-index .right a:hover{
  background-color: rgba(255,0,0,0.1);
  transform: translateY(-2px);
}

body.page-portfolio nav.right a,
body.page-contacts nav.right a,
body.page-about nav.right a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-portfolio nav.right a::before,
body.page-contacts nav.right a::before,
body.page-about nav.right a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-portfolio nav.right a:hover::before,
body.page-contacts nav.right a:hover::before,
body.page-about nav.right a:hover::before{
  width:100%;
  left:0;
}
body.page-portfolio nav.right a:hover,
body.page-contacts nav.right a:hover,
body.page-about nav.right a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}

body.page-index .auth-buttons{
  display:flex ! important;
  align-items:center !important;
  gap:12px !important; 
}

body.page-index .dropdown{ position:relative; display:inline-block; }

body.page-index .dropdown-button{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  cursor:pointer;
  background:none;
  border:none;
  color:#fff;
  font-size:1rem;
  border-radius:8px;
  transition: all 0.3s ease;
  font-weight:500;
}

body.page-index .dropdown-button:hover{
  background-color: rgba(255,0,0,0.1);
  transform: translateY(-2px);
}

body.page-index .dropdown-content{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  background: rgba(34, 34, 34, 0.98);
  backdrop-filter: blur(10px);
  min-width:220px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.4);
  z-index:1000;
  border-radius:10px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,0.1);
}

body.page-index .dropdown:hover .dropdown-content{
  display:block;
  animation: mc_fadeInDown 0.3s ease;
}

@keyframes mc_fadeInDown{
  from{ opacity:0; transform: translateY(-10px); }
  to{ opacity:1; transform: translateY(0); }
}

body.page-index .dropdown-content a{
  display:block;
  padding:14px 18px;
  text-decoration:none;
  color:#fff;
  transition: all 0.3s ease;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

body.page-index .dropdown-content a:last-child{ border-bottom:none; }

body.page-index .dropdown-content a:hover{
  background: linear-gradient(
    135deg,
    rgba(255,0,0,0.2),
    rgba(204,0,0,0.2)
  );
  padding-left:25px;
}

body.page-index .arrow{
  transition: transform 0.3s ease;
  font-size:0.8rem;
}

body.page-index .dropdown:hover .arrow{
  transform: rotate(180deg);
}

body.page-index .hamburger{
  display:none;
  font-size:28px;
  color:#fff;
  cursor:pointer;
  background:none;
  border:none;
  padding:8px;
  border-radius:8px;
  transition: all 0.3s ease;
}

body.page-index .hamburger:hover{
  background-color: rgba(255,0,0,0.1);
}

body.page-index .container{
  max-width:1200px;
  margin:0 auto;
  padding:20px;
}

body.page-index .main-content{
  text-align:center;
  padding:60px 20px;
  background: linear-gradient(
    135deg,
    rgba(255,0,0,0.1),
    rgba(0,255,204,0.1)
  );
  border-radius:20px;
  margin:40px 0;
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

body.page-index .main-content h2{
  font-size:3.5em;
  margin:0 0 20px 0;
  background: linear-gradient(135deg, #ff0000, #00ffcc);
  -webkit-background-clip:text;
  -webkit-text-fill-color: transparent;
  background-clip:text;
  text-shadow: 0 0 30px rgba(255,0,0,0.3);
}

body.page-index .main-content h3{
  font-size:2.2em;
  margin:0 0 15px 0;
  color:#f3ecec;
  text-shadow: 0 2px 10px rgba(255,255,255,0.1);
}

body.page-index .main-content p{
  font-size:1.8em;
  color:#ff0000;
  margin:0 0 40px 0;
  font-weight:600;
  text-shadow: 0 0 20px rgba(255,0,0,0.3);
}

body.page-index form{
  display:flex;
  flex-direction:column;
  align-items:center;
  background: rgba(26,26,26,0.95);
  backdrop-filter: blur(15px);
  padding:40px;
  border-radius:20px;
  max-width:700px;
  margin:auto;
  box-shadow: 0 20px 50px rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.1);
}

body.page-index .form-group{
  display:flex;
  align-items:center;
  width:100%;
  margin-bottom:25px;
  text-align:left;
}

body.page-index .form-group label{
  width:30%;
  font-weight:600;
  color:#00ffcc;
  text-shadow: 0 0 10px rgba(0,255,204,0.3);
}

body.page-index .form-group input,
body.page-index .form-group select{
  width:70%;
  padding:15px;
  border: 2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background: rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  transition: all 0.3s ease;
}

body.page-index select option{
  background-color:#1a1a1a;
  color:#fff;
}

body.page-index .form-group input:focus,
body.page-index .form-group select:focus{
  outline:none;
  border-color:#ff0000;
  box-shadow: 0 0 20px rgba(255,0,0,0.3);
  background: rgba(255,255,255,0.1);
}

body.page-index .form-group input::placeholder{
  color: rgba(255,255,255,0.5);
}

body.page-index .btn-exchange{
  width:100%;
  padding:18px;
  background: linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-size:18px;
  font-weight:600;
  transition: all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow: 0 5px 20px rgba(255,0,0,0.3);
}

body.page-index .btn-exchange:hover{
  background: linear-gradient(135deg, #cc0000, #990000);
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(255,0,0,0.4);
}

body.page-index .btn-exchange:active{
  transform: translateY(-1px);
}

body.page-index .network-details{
  font-size:0.9em;
  color:#00ffcc;
  margin-top:8px;
  padding-left:30%;
  width:70%;
}

body.page-index #exchangeForm .form-group {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  column-gap: 14px;
  row-gap: 8px;
  width: 100%;
  margin-bottom: 18px;
  text-align: left;
}

body.page-index #exchangeForm .form-group label {
  width: auto;
  min-width: 0;
  margin: 0;
  color: #00ffcc;
  font-weight: 600;
  font-size: 15px;
  text-shadow: 0 0 10px rgba(0,255,204,0.3);
}

body.page-index #exchangeForm .form-group input,
body.page-index #exchangeForm .form-group select,
body.page-index #exchangeForm .form-group textarea,
body.page-index #exchangeForm .form-group > div:not(.network-details) {
    width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
}

body.page-index #exchangeForm .form-group input,
body.page-index #exchangeForm .form-group select,
body.page-index #exchangeForm .form-group textarea {
    display: block;
  padding: 15px;
  border: 2px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  background: rgba(255,255,255,0.05);
  color: #fff;
  font-size: 16px;
  transition: all 0.3s ease;
  outline: none;
  box-sizing: border-box;
}
body.page-index #exchangeForm .form-group textarea {
  min-height: 96px;
  resize: vertical;
  background: rgba(255,255,255,0.05);
  color: #fff;
}

body.page-index #exchangeForm .form-group textarea {
  min-height: 96px;
  resize: vertical;
}

body.page-index #exchangeForm .form-group input:focus,
body.page-index #exchangeForm .form-group select:focus,
body.page-index #exchangeForm .form-group textarea:focus {
  border-color: #ff0000;
  box-shadow: 0 0 20px rgba(255,0,0,0.3);
  background: rgba(255,255,255,0.1);
}

body.page-index #exchangeForm .form-group textarea::placeholder,
body.page-index #exchangeForm .form-group input::placeholder {
  color: rgba(255,255,255,0.55);
}

body.page-index #exchangeForm #smsTextGroup {
  align-items: flex-start;
}

body.page-index #exchangeForm #smsTextGroup label {
  padding-top: 14px;
}

body.page-index #exchangeForm .network-details {
    grid-column: 2 / 3;
  width: 100% !important;
  max-width: 100% !important;
  margin: 6px 0 0 0;
  padding-left: 0;
  font-size: 0.9em;
  color: #00ffcc;
}

body.page-index #exchangeForm #loginWarningGroup > div {
    width: 100% !important;
  max-width: 100% !important;
  padding: 12px 14px !important;
  border-radius: 10px;
  background: rgba(255, 204, 0, 0.08);
  border: 1px solid rgba(255, 204, 0, 0.2);
  box-sizing: border-box;
}

body.page-index #exchangeForm .form-group.hidden,
body.page-index #exchangeForm .hidden.form-group {
  display: none !important;
}

@media (max-width: 768px) {
  body.page-index #exchangeForm .form-group {
    grid-template-columns: 1fr;
  }

  body.page-index #exchangeForm .network-details {
    grid-column: auto;
  }

  body.page-index #exchangeForm .form-group label,
  body.page-index #exchangeForm .form-group input,
  body.page-index #exchangeForm .form-group select,
  body.page-index #exchangeForm .form-group textarea,
  body.page-index #exchangeForm .form-group > div:not(.network-details),
  body.page-index #exchangeForm .network-details,
  body.page-index #exchangeForm #loginWarningGroup > div {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }

  body.page-index #exchangeForm #smsTextGroup label {
    padding-top: 0;
  }
}

body.page-index #cryptoTable{
  width:100%;
  border-collapse:separate;
  border-spacing:0 8px;
  margin-top:20px;
}

body.page-index #cryptoTable th{
  background: linear-gradient(135deg, #1a1a1a, #2a2a2a);
  color:#00ffcc;
  padding:15px 12px;
  text-align:left;
  font-weight:600;
  border-radius:8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

body.page-index #cryptoTable td{
  background: rgba(26,26,26,0.8);
  padding:15px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  vertical-align:middle;
  transition: all 0.3s ease;
}

body.page-index #cryptoTable tbody tr{
  transition: all 0.3s ease;
}

body.page-index #cryptoTable tbody tr:hover{
  background: rgba(255,0,0,0.1);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

body.page-index #cryptoTable tbody tr td:first-child{
  border-top-left-radius:10px;
  border-bottom-left-radius:10px;
}

body.page-index #cryptoTable tbody tr td:last-child{
  border-top-right-radius:10px;
  border-bottom-right-radius:10px;
}

body.page-index .news-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:25px;
  margin-top:40px;
}

body.page-index .news-card{
  background: rgba(26,26,26,0.9);
  backdrop-filter: blur(10px);
  padding:25px;
  border-radius:15px;
  color:#fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  border: 1px solid rgba(255,255,255,0.1);
  overflow:hidden;
  position:relative;
}

body.page-index .news-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background: linear-gradient(90deg, #ff0000, #00ffcc);
}

body.page-index .news-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}

body.page-index .news-card img{
  width:100%;
  height:180px;
  object-fit:cover;
  border-radius:10px;
  margin-bottom:15px;
  transition: transform 0.3s ease;
}

body.page-index .news-card:hover img{
  transform: scale(1.05);
}

body.page-index .news-card h3{
  font-size:1.2em;
  margin-bottom:12px;
  color:#00ffcc;
  line-height:1.4;
}

body.page-index .news-card p{
  font-size:0.95em;
  color:#ccc;
  margin-bottom:15px;
  line-height:1.6;
}

body.page-index .read-more{
  color:#ff0000;
  text-decoration:none;
  font-weight:600;
  transition: all 0.3s ease;
  display:inline-flex;
  align-items:center;
  gap:5px;
}

body.page-index .read-more:hover{
  color:#00ffcc;
  transform: translateX(5px);
}

body.page-index .read-more::after{
  content:"→";
  transition: transform 0.3s ease;
}

body.page-index .read-more:hover::after{
  transform: translateX(3px);
}

body.page-index .section-header{
  text-align:center;
  margin:60px 0 30px 0;
}

body.page-index .section-header h2{
  font-size:2.5rem;
  background: linear-gradient(135deg, #00ffcc, #ff0000);
  -webkit-background-clip:text;
  -webkit-text-fill-color: transparent;
  background-clip:text;
  margin-bottom:15px;
}

body.page-index .see-more-btn{
  background: linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  padding:12px 30px;
  border-radius:25px;
  text-decoration:none;
  font-weight:600;
  transition: all 0.3s ease;
  display:inline-block;
  margin-top:30px;
}

body.page-index .see-more-btn:hover{
  background: linear-gradient(135deg, #cc0000, #990000);
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255,0,0,0.3);
}

body.page-index .register-section{
  text-align:center;
  padding:80px 20px;
  background: linear-gradient(
    135deg,
    rgba(255,0,0,0.1),
    rgba(0,255,204,0.1)
  );
  border-radius:20px;
  margin:60px 0;
}

body.page-index .register-title{
  font-size:3rem;
  margin-bottom:15px;
  background: linear-gradient(135deg, #ffcc00, #ff0000);
  -webkit-background-clip:text;
  -webkit-text-fill-color: transparent;
  background-clip:text;
}

body.page-index .register-subtitle{
  font-size:1.3rem;
  margin-bottom:50px;
  color:#ccc;
}

body.page-index .steps-wrapper{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap:40px;
  max-width:1000px;
  margin:auto;
}

body.page-index .step{
  background: rgba(26,26,26,0.8);
  padding:30px;
  border-radius:15px;
  transition: all 0.3s ease;
  border: 1px solid rgba(255,255,255,0.1);
}

body.page-index .step:hover{
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.3);
}

body.page-index .step h3{
  color:#00ffcc;
  margin-bottom:15px;
  font-size:1.3rem;
}

body.page-index .step p{
  color:#ccc;
  line-height:1.6;
}

body.page-index .footer-message{
  font-size:2.5rem;
  margin-top:50px;
  background: linear-gradient(135deg, #00ffcc, #ff0000);
  -webkit-background-clip:text;
  -webkit-text-fill-color: transparent;
  background-clip:text;
}

body.page-index .site-footer{
  background: linear-gradient(135deg, #000, #1a1a1a);
  color:#fff;
  padding:40px 20px;
  text-align:center;
  margin-top:80px;
}

body.page-index .site-footer a{
  color:#00ffcc;
  margin-right:20px;
  text-decoration:none;
  transition: all 0.3s ease;
}

body.page-index .site-footer a:hover{
  color:#ff0000;
}

body.page-index #loadingSpinner{
  position:fixed;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  z-index:10000;
  background: rgba(0,0,0,0.8);
  padding:30px;
  border-radius:15px;
  display:none;
}

body.page-index .spinner{
  width:50px;
  height:50px;
  border:4px solid rgba(255,0,0,0.3);
  border-top:4px solid #ff0000;
  border-radius:50%;
  animation: mc_spin 1s linear infinite;
}

@keyframes mc_spin{
  0%{ transform: rotate(0deg); }
  100%{ transform: rotate(360deg); }
}

body.page-index #errorMsg{
  background: rgba(255,0,0,0.1);
  border: 1px solid #ff0000;
  color:#ff0000;
  padding:15px;
  border-radius:10px;
  margin:15px 0;
  text-align:center;
  display:none;
}

body.page-index .balance-dropdown{ position:relative; display:inline-block; }

body.page-index .balance-btn{
  background-color:#2a2a2a;
  color:#fff;
  padding:8px 15px;
  border:1px solid #444;
  border-radius:8px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:150px;
}

body.page-index .balance-btn:hover{ background-color:#333; }

body.page-index .balance-text{ text-align:left; }
body.page-index .balance-text small{
  display:block;
  font-size:0.75em;
  color:#aaa;
}
body.page-index .balance-text span{
  font-size:1em;
  font-weight:bold;
  color:#00ffcc;
}

body.page-index .balance-dropdown-content{
  display:none;
  position:absolute;
  background-color:#1c1c1c;
  min-width:180px;
  box-shadow: 0px 8px 16px rgba(0,0,0,0.5);
  z-index:1;
  border-radius:8px;
  border:1px solid #444;
  overflow:hidden;
}

body.page-index .balance-dropdown-content a{
  color:#fff;
  padding:12px 16px;
  text-decoration:none;
  display:block;
  text-align:left;
}

body.page-index .balance-dropdown-content a:hover{
  background-color:#333;
}

body.page-index .balance-dropdown.active .balance-dropdown-content{ display:block; }
body.page-index .balance-dropdown.active .arrow{ transform: rotate(180deg); }

body.page-index .tabs{ display:flex; background-color:#2a2a2a; }

body.page-index .tab-link{
  flex:1;
  padding:10px;
  border:none;
  background:none;
  color:#aaa;
  cursor:pointer;
  transition: all 0.3s ease;
}

body.page-index .tab-link.active{
  color:#fff;
  border-bottom: 2px solid #00ffcc;
}

body.page-index .tab-content{
  display:none;
  padding:10px;
  animation: mc_fadeIn 0.5s;
}

@keyframes mc_fadeIn{
  from{ opacity:0; }
  to{ opacity:1; }
}

body.page-index .kyc-modal{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  display:none;
  z-index:1000;
}
body.page-index .kyc-card{
  width:min(640px, 92vw);
  background:#fff;
  margin:6vh auto;
  border-radius:14px;
  overflow:hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.2);
}
body.page-index .kyc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 16px;
  border-bottom:1px solid #eee;
  font-weight:600;
}
body.page-index .kyc-close{
  border:none;
  background:transparent;
  font-size:20px;
  cursor:pointer;
}
body.page-index .kyc-body{ padding:16px 18px; }
body.page-index .kyc-steps-list{ margin:10px 0 14px 18px; }
body.page-index .kyc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
body.page-index .kyc-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:14px; }
body.page-index .btn-primary{
  background:#111;
  color:#fff;
  border:none;
  border-radius:8px;
  padding:10px 14px;
  cursor:pointer;
}
body.page-index .btn-secondary{
  background:#f3f3f3;
  color:#111;
  border:none;
  border-radius:8px;
  padding:10px 14px;
  cursor:pointer;
}
body.page-index .kyc-sub{ color:#555; margin-top:-6px; }
body.page-index .kyc-hint{ color:#666; font-size:.92rem; }
body.page-index .kyc-step input,
body.page-index .kyc-step select{
  width:100%;
  padding:10px;
  border:1px solid #ddd;
  border-radius:8px;
  margin:6px 0 10px;
}

body.page-index .kyc-card {
  width: min(640px, 92vw);
  max-height: 88vh;
  overflow-y: auto;
  margin: 6vh auto;

  background: #171717;
  color: #f5f5f5;

  border:
    1px solid
    rgba(255,255,255,.12);

  border-radius: 14px;

  box-shadow:
    0 12px 40px
    rgba(0,0,0,.45);
}

body.page-index .kyc-header {
  color: #f5f5f5;

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

body.page-index .kyc-close {
  color: #fff;
}

body.page-index .kyc-body,
body.page-index .kyc-step,
body.page-index .kyc-step h3,
body.page-index .kyc-step h4,
body.page-index .kyc-step label,
body.page-index .kyc-steps-list {
  color: #f5f5f5;
}

body.page-index .kyc-sub,
body.page-index .kyc-hint {
  color: #b9b9b9;
}

body.page-index .kyc-step input,
body.page-index .kyc-step select,
body.page-index .kyc-step textarea {
  width: 100%;

  background: #232323;
  color: #fff;

  border: 1px solid #444;
  border-radius: 8px;

  padding: 10px;
  margin: 6px 0 10px;
}

body.page-index .kyc-step input::placeholder,
body.page-index .kyc-step textarea::placeholder {
  color: #999;
}

body.page-index .user-dropdown{ display:inline-block; }
body.page-index .user-dropdown.show-dropdown{ display:block; }

body.page-index .nav-right{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:1.5rem;
}

body.page-index .dropdown-arrow{
  font-size:0.75rem;
  opacity:0.7;
}

@media (max-width: 768px){
  body.page-index .hamburger{ display:block; }

  body.page-index .right{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background: rgba(34,34,34,0.98);
    backdrop-filter: blur(15px);
    flex-direction:column;
    padding:25px;
    z-index:1000;
    border-radius: 0 0 15px 15px;
  }

  body.page-index .right.active{ display:flex; }

  body.page-index .right a,
  body.page-index .dropdown-button{
    width:100%;
    text-align:left;
    padding:15px;
    margin:5px 0;
    border-radius:8px;
  }

  body.page-index .dropdown-content{
    position:static;
    display:block;
    background: rgba(51,51,51,0.8);
    margin:10px 0;
    border-radius:8px;
  }

  body.page-index .auth-buttons{
    flex-direction:column;
    width:100%;
    gap:10px;
  }

  body.page-index .main-content h2{ font-size:2.5em; }
  body.page-index .main-content h3{ font-size:1.8em; }
  body.page-index .main-content p{ font-size:1.4em; }

  body.page-index form{
    padding:25px;
    margin:20px;
  }

  body.page-index .form-group{
    flex-direction:column;
    align-items:flex-start;
  }
  body.page-index .form-group label{
    width:100%;
    margin-bottom:8px;
  }
  body.page-index .form-group input,
  body.page-index .form-group select{
    width:100%;
  }

  body.page-index .register-title{ font-size:2.2rem; }
  body.page-index .steps-wrapper{ grid-template-columns:1fr; gap:25px; }

  body.page-index #cryptoTable{ font-size:0.85rem; display:block; overflow-x:auto; }
  body.page-index #cryptoTable th,
  body.page-index #cryptoTable td{ padding:10px 8px; }

  body.page-index .news-grid{ grid-template-columns:1fr; gap:20px; }
}

@media (max-width: 480px){
  body.page-index .container{ padding:15px; }
  body.page-index header{ padding:10px 15px; }
  body.page-index .brand-name{ font-size:1.1rem; }

  body.page-index .main-content{
    padding:40px 15px;
    margin:20px 0;
  }

  body.page-index .main-content h2{ font-size:2rem; }
  body.page-index .main-content h3{ font-size:1.5rem; }
  body.page-index .main-content p{ font-size:1.2rem; }

  body.page-index form{
    padding:20px;
    margin:10px;
  }

  body.page-index .register-section{ padding:50px 15px; }
  body.page-index .register-title{ font-size:1.8rem; }
  body.page-index .footer-message{ font-size:2rem; }
  body.page-index .kyc-grid{ grid-template-columns:1fr; }
}

body.page-index .info-section{
  max-width: 1200px;
  margin: 70px auto 40px;
  padding: 34px 22px;
  border-radius: 22px;
  background:
    radial-gradient(700px 260px at 20% 0%, rgba(0,255,204,.12), transparent 60%),
    radial-gradient(700px 260px at 80% 0%, rgba(255,0,0,.12), transparent 60%),
    linear-gradient(180deg, rgba(18,22,28,.85), rgba(10,12,16,.92));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 24px 80px rgba(0,0,0,.55);
  position: relative;
  overflow: hidden;
}

body.page-index .info-section::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    linear-gradient(90deg, rgba(0,255,204,.18), rgba(255,0,0,.18), rgba(96,165,250,.18));
  filter: blur(22px);
  opacity: .35;
  pointer-events:none;
}

body.page-index .info-section h2{
  margin: 0 0 18px;
  font-size: clamp(22px, 2.2vw, 34px);
  letter-spacing: .2px;
  text-align: center;
  background: linear-gradient(135deg, #00ffcc, #60a5fa, #ff0000);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 10px 40px rgba(0,0,0,.35);
  position: relative;
  z-index: 1;
}

body.page-index .info-section .shadow-box{
  margin: 14px 0;
  padding: 16px 18px 16px 52px;
  border-radius: 16px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 10px 30px rgba(0,0,0,.28);
  color: rgba(255,255,255,.86);
  line-height: 1.8;
  position: relative;
  z-index: 1;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

body.page-index .info-section .shadow-box::before{
  content:"✓";
  position:absolute;
  left: 16px;
  top: 16px;
  width: 26px;
  height: 26px;
  border-radius: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  color: #001;
  background: linear-gradient(135deg, #00ffcc, #60a5fa);
  box-shadow: 0 10px 25px rgba(0,255,204,.18);
}

body.page-index .info-section .shadow-box:hover{
  transform: translateY(-4px);
  border-color: rgba(0,255,204,.22);
  background: rgba(255,255,255,.06);
}

body.page-index .info-section .easy-fast-text{
  margin-top: 22px;
  padding: 14px 16px;
  text-align:center;
  border-radius: 16px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  background:
    linear-gradient(135deg, rgba(0,255,204,.14), rgba(255,0,0,.14));
  border: 1px solid rgba(255,255,255,.10);
  color: #eaf6f5;
  position: relative;
  z-index: 1;
}

body.page-index .right a.nav-pill{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  color: #fff !important;
  font-weight: 500 !important;
  position: relative;
  transform: none !important;
}

body.page-index .right a.nav-pill::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:#ff0000;
  transition: all 0.3s ease;
}

body.page-index .right a.nav-pill:hover::before{
  width:100%;
  left:0;
}

body.page-index .right a.nav-pill:hover{
  background-color: rgba(255,0,0,0.1) !important;
  transform: translateY(-2px) !important;
}

@media (max-width: 768px){
  body.page-index .right a.nav-pill{
    width:100%;
    text-align:left;
    padding:15px !important;
    margin:5px 0;
  }
}

body.page-forgot{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:var(--text);
  min-height:100vh;
}
body.page-forgot .forgot-container{
  max-width:420px;
  margin:100px auto 40px;
  padding:30px 28px;
  text-align:center;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-forgot .forgot-container img{
  display:block;
  margin:0 auto 15px;
}
body.page-forgot h2{
  margin:0 0 20px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-forgot input{
  width:100%;
  padding:15px;
  margin-bottom:15px;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  transition:all 0.3s ease;
  outline:none;
  box-sizing:border-box;
}
body.page-forgot input:focus{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
  background:rgba(255,255,255,0.1);
}
body.page-forgot input::placeholder{
  color:rgba(255,255,255,0.5);
}
body.page-forgot button{
  width:100%;
  padding:18px;
  border:none;
  border-radius:12px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-forgot button:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}
body.page-forgot #loading{
  margin-top:15px;
  font-size:14px;
  display:none;
  color:var(--muted);
}
body.page-forgot #error-message{
  color:#ff4d4d;
  margin-top:10px;
  font-size:14px;
}
body.page-forgot .success{
  color:#28a745;
  margin-top:10px;
  font-size:14px;
}
body.page-forgot .hidden{
  display:none !important;
}
body.page-forgot .fp-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 20px;

  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(5px);
}

body.page-forgot .fp-modal.hidden {
  display: none !important;
}

body.page-forgot .fp-modal-card {
  width: min(420px, 92vw);

  padding: 32px 28px;

  background: #171717;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;

  text-align: center;

  box-shadow:
    0 20px 70px rgba(0, 0, 0, 0.55);
}

body.page-forgot .fp-modal-card h3 {
  margin: 14px 0 10px;

  color: #ffffff;
  font-size: 22px;
}

body.page-forgot .fp-modal-card p {
  margin: 0 0 24px;

  color: #b8b8b8;
  line-height: 1.6;
}

body.page-forgot .fp-success-icon {
  width: 58px;
  height: 58px;

  margin: 0 auto;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: rgba(0, 255, 190, 0.12);
  color: #00e6b8;

  font-size: 30px;
  font-weight: 700;
}

body.page-forgot #successModalButton {
  width: 100%;

  padding: 13px 18px;

  border: 0;
  border-radius: 8px;

  background: #ff0000;
  color: #ffffff;

  font-size: 15px;
  font-weight: 700;

  cursor: pointer;
}

body.page-forgot #successModalButton:hover {
  filter: brightness(1.08);
}
@media (max-width: 480px){
  body.page-forgot .forgot-container{
    margin:80px 15px 40px;
    padding:22px 20px;
  }
}

body.page-cookie{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  min-height:100vh;
  color:var(--text);
  font-family:"Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;
}

body.page-cookie .container{
  max-width:1100px;
  margin:100px auto 40px;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  padding:40px;
  border-radius:20px;
}

body.page-cookie .header{
  text-align:center;
  margin-bottom:12px;
}
body.page-cookie .header p{
  margin:0;
  color:var(--muted);
  text-align:center;
}

body.page-cookie h1{
  margin:0 0 8px;
  font-size:28px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-cookie h2{
  margin-top:28px;
  font-size:20px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-cookie h3{
  color:var(--accent);
  margin-top:18px;
  font-size:16px;
}

body.page-cookie p,
body.page-cookie li{
  color:var(--text);
  line-height:1.8;
}

body.page-cookie ul{ padding-left:20px; }
body.page-cookie li{ margin-bottom:6px; }

body.page-cookie .note{
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  border-left:3px solid var(--primary);
  color:var(--text);
  padding:14px 16px;
  border-radius:10px;
  margin-top:10px;
  margin-bottom:18px;
}

body.page-cookie .button{
  display:inline-block;
  padding:14px 32px;
  margin-top:18px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  text-decoration:none;
  border-radius:12px;
  cursor:pointer;
  border:none;
  font-size:16px;
  font-weight:600;
  transition:all .3s ease;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-cookie .button:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

body.page-cookie .center{ text-align:center; }

@media (max-width: 768px){
  body.page-cookie .container{ padding:24px; margin:80px 12px 30px; }
}
@media (max-width: 480px){
  body.page-cookie .container{ padding:18px; border-radius:14px; }
  body.page-cookie h1{ font-size:22px; }
}

body.page-contacts{
  background-color:#111;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#fff;
  margin:0;
  padding:0;
}

body.page-contacts .contact-section{
  padding:50px 20px;
  background:transparent;
}

body.page-contacts .contact-container{
  display:flex;
  flex-wrap:wrap;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  background:rgba(26,26,26,0.95);
  backdrop-filter:blur(15px);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}

body.page-contacts .contact-sidebar{
  background:rgba(26,26,26,0.95);
  width:100%;
  max-width:300px;
  padding:30px 20px;
  border-right:2px solid var(--accent);
  box-sizing:border-box;
}

body.page-contacts .contact-sidebar ul{
  list-style:none;
  padding:0;
  margin:0;
}

body.page-contacts .contact-sidebar li{
  margin:20px 0;
}

body.page-contacts .contact-sidebar a{
  color:#ccc;
  text-decoration:none;
  display:block;
  transition:.3s;
}

body.page-contacts .contact-sidebar li.active a,
body.page-contacts .contact-sidebar a:hover{
  color:var(--accent);
  font-weight:bold;
}

body.page-contacts .contact-main{
  flex:1;
  padding:40px;
  box-sizing:border-box;
}

body.page-contacts .contact-main h2,
body.page-contacts .contact-main h3{
  margin-top:0;
}
body.page-contacts .contact-main h2{
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-contacts .contact-main ul{
  padding-left:20px;
}

body.page-contacts .contact-main a{
  color:var(--accent);
  text-decoration:none;
}

body.page-contacts .contact-main a:hover{
  text-decoration:underline;
}

body.page-contacts form{
  display:flex;
  flex-direction:column;
  margin-top:20px;
}

body.page-contacts .contact-logo{
  height:80px;
  margin-bottom:15px;
}

body.page-contacts form input,
body.page-contacts form textarea{
  width:100%;
  box-sizing:border-box;
  padding:15px;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  transition:all 0.3s ease;
  outline:none;
  margin-bottom:15px;
}

body.page-contacts form input:focus,
body.page-contacts form textarea:focus{
  border-color:#ff0000;
  box-shadow:0 0 20px rgba(255,0,0,0.3);
  background:rgba(255,255,255,0.1);
}

body.page-contacts form button{
  width:100%;
  padding:18px;
  background:linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-size:18px;
  font-weight:600;
  transition:all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
  margin-top:20px;
}

body.page-contacts form button:hover{
  background:linear-gradient(135deg, #cc0000, #990000);
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

body.page-contacts label{
  margin-bottom:10px;
  color:#ccc;
  font-size:14px;
}

body.page-contacts footer.footer{
  background:#000;
  color:#ccc;
  padding:20px;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  font-size:14px;
}

body.page-contacts footer.footer a{
  color:#ccc;
  margin:0 8px;
  text-decoration:none;
}

body.page-contacts footer.footer a:hover{
  color:var(--accent);
}

body.page-contacts .footer .footer-center{
  text-align:center;
  flex:1;
  min-width:100px;
}

body.page-contacts .footer .footer-left,
body.page-contacts .footer .footer-right{
  flex:1;
  min-width:100px;
}

body.page-contacts .footer .footer-right{
  text-align:right;
}

body.page-contacts .footer .footer-right a{
  margin:0 5px;
  font-size:18px;
}

@media (max-width:992px){

  body.page-contacts .contact-container{
    flex-direction:column;
  }

  body.page-contacts .contact-sidebar{
    width:100%;
    max-width:100%;
    border-right:none;
    border-bottom:2px solid var(--accent);
  }

  body.page-contacts .contact-main{
    padding:20px;
  }

  body.page-contacts .footer{
    flex-direction:column;
    text-align:center;
  }

  body.page-contacts .footer .footer-left,
  body.page-contacts .footer .footer-center,
  body.page-contacts .footer .footer-right{
    flex:unset;
    text-align:center;
    margin:10px 0;
  }

  body.page-contacts form input,
  body.page-contacts form textarea{
    padding:12px;
    font-size:15px;
  }
  body.page-contacts form button{
    padding:15px;
    font-size:16px;
  }
}

@media (max-width:480px){

  body.page-contacts form input,
  body.page-contacts form textarea{
    font-size:14px;
    padding:10px;
  }
  body.page-contacts form button{
    font-size:15px;
    padding:14px;
  }

  body.page-contacts .contact-main{
    padding:15px;
  }

  body.page-contacts .contact-sidebar{
    padding:20px 15px;
  }

  body.page-contacts .footer{
    font-size:13px;
  }
}

body.page-change-password{
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  text-align:center;
  margin:0;
  min-height:100vh;
}
body.page-change-password .container{
  max-width:400px;
  margin:100px auto 40px;
  padding:30px;
  background:rgba(26,26,26,0.95);
  border:1px solid var(--border);
  border-radius:20px;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  backdrop-filter:blur(15px);
}
body.page-change-password .container img{
  display:block;
  margin:0 auto 15px;
}
body.page-change-password h2{
  margin-top:0;
  margin-bottom:20px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-change-password input{
  width:100%;
  padding:15px;
  margin:10px 0;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  color:#fff;
  font-size:16px;
  outline:none;
  transition:.3s;
  box-sizing:border-box;
}
body.page-change-password input:focus{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.3);
}
body.page-change-password input::placeholder{
  color:rgba(255,255,255,0.5);
}
body.page-change-password button{
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  padding:18px;
  border:none;
  cursor:pointer;
  width:100%;
  border-radius:12px;
  font-size:18px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
  transition:.3s;
  margin-top:10px;
}
body.page-change-password button:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-3px);
}
body.page-change-password #smsCodeContainer{
  display:none;
}
body.page-change-password #loading{
  display:none;
  color:var(--accent);
  margin-top:10px;
}
body.page-change-password #error-message{
  color:#ff4d4d;
  margin-top:10px;
  font-size:14px;
}

@media (max-width: 768px){
  body.page-change-password .container{ padding:24px; margin:80px 12px 30px; }
}
@media (max-width: 480px){
  body.page-change-password .container{ padding:20px; border-radius:14px; }
  body.page-change-password h2{ font-size:20px; }
}

body.page-about{
  margin:0;
  padding:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:#ffffff;
  overflow-x:hidden;
}

body.page-about header{
  position:sticky;
  top:0;
  z-index:1000;
  height:70px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  background:rgba(51,51,51,0.95);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(6px);
}

body.page-about nav a{
  margin-left:1.8rem;
  color:#ffffff;
  text-decoration:none;
  font-weight:bold;
  transition:color .3s ease,transform .3s ease;
}
body.page-about nav a:hover{
  color:var(--accent);
  transform:scale(1.05);
}

body.page-about .hero-section{
  background-image:url('/assets/banner-about-us.jpg');
  background-size:cover;
  background-position:center;
  color:#fff;
  text-align:center;
  padding:15rem 2rem;
  position:relative;
}
body.page-about .hero-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-color:rgba(0,0,0,.6);
}
body.page-about .hero-content{
  position:relative;
  z-index:1;
}

body.page-about .hero-content h1{
  font-size:3rem;
  margin-bottom:1rem;
  opacity:0;
  transform:translateY(30px);
  animation:aboutFadeUp 1s ease-out .5s forwards;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-about .hero-content p{
  font-size:1.2rem;
  opacity:0;
  transform:translateY(30px);
  animation:aboutFadeUp 1s ease-out 1s forwards;
  color:#cccccc;
  max-width:800px;
  margin:0 auto;
  line-height:1.8;
}

body.page-about .features-section{
  padding:4rem 2rem;
  text-align:center;
  background:linear-gradient(180deg, #0b0e11, #1a1f25);
}

body.page-about .features-section h2{
  font-size:2.5rem;
  margin-bottom:2rem;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-about .features-container{
  position:relative;
  max-width:1200px;
  margin:0 auto;
}

body.page-about .features{
  display:flex;
  gap:1.5rem;
  overflow-x:auto;
  scroll-behavior:smooth;
  padding:1rem 0;
  scrollbar-width:none;
}
body.page-about .features::-webkit-scrollbar{display:none}

body.page-about .feature-box{
  min-width:220px;
  background:rgba(26,26,26,0.95);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:20px;
  padding:2rem 1.5rem;
  text-align:center;
  transition:all .3s ease;
  flex-shrink:0;
  backdrop-filter:blur(15px);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-about .feature-box:hover{
  border-color:var(--primary);
  box-shadow:0 0 20px rgba(255,0,0,0.2);
  transform:translateY(-5px);
}
body.page-about .feature-box img{
  width:48px;
  height:48px;
  margin-bottom:1rem;
}
body.page-about .feature-box h3{
  font-size:2rem;
  color:var(--primary);
  margin:0 0 0.5rem;
}
body.page-about .feature-box p{
  font-size:0.95rem;
  color:#aaa;
  line-height:1.5;
  margin:0;
}

body.page-about .scroll-buttons{
  display:flex;
  justify-content:center;
  gap:1rem;
  margin-top:1.5rem;
}
body.page-about .scroll-button{
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.2);
  color:#fff;
  width:44px;
  height:44px;
  border-radius:50%;
  font-size:1.2rem;
  cursor:pointer;
  transition:all .3s ease;
  display:flex;
  align-items:center;
  justify-content:center;
}
body.page-about .scroll-button:hover{
  background:var(--primary);
  border-color:var(--primary);
  box-shadow:0 0 15px rgba(255,0,0,0.3);
}

body.page-about .section{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  padding:5rem 2rem;
  align-items:center;
  background:linear-gradient(180deg, #0b0e11, #131a20);
}

body.page-about .section:nth-child(even){
  background:linear-gradient(180deg, #131a20, #1a1f25);
}

body.page-about .section img{
  width:100%;
  border-radius:12px;
  box-shadow:0 0 20px rgba(0,0,0,.5);
}

body.page-about .section-content h2{
  font-size:2.2rem;
  margin-bottom:1.2rem;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-about .section-content h3{
  color:var(--accent);
  margin-bottom:1rem;
  font-weight:bold;
}

body.page-about .section-content p,
body.page-about .section-content ul{
  font-size:1.1rem;
  line-height:1.8;
  color:#cccccc;
}

body.page-about .contact-us-section{
  background:linear-gradient(180deg, #1a1f25, #0b0e11);
  padding:4rem 2rem;
}

body.page-about .contact-content{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  max-width:1100px;
  margin:0 auto;
  align-items:center;
}

body.page-about .contact-info h2{
  font-size:2.2rem;
  margin-bottom:1.5rem;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-about .contact-links p{
  font-size:1.1rem;
  margin:0.8rem 0;
  color:#ccc;
}
body.page-about .contact-links a{
  color:var(--accent);
  text-decoration:none;
}
body.page-about .contact-links a:hover{
  text-decoration:underline;
}

body.page-about .app-section{
  text-align:center;
  padding:5rem 2rem;
  background:linear-gradient(180deg, #0b0e11, #12161c);
}

body.page-about .app-section h2{
  font-size:2.5rem;
  margin-bottom:1rem;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

body.page-about .app-section p{
  color:#aaa;
  font-size:1.1rem;
  max-width:600px;
  margin:0 auto;
}

body.page-about .app-preview{
  margin-top:1.5rem;
  border-radius:12px;
  box-shadow:0 0 20px rgba(0,0,0,0.4);
  max-width:90%;
  height:auto;
}

body.page-about .app-link{
  margin-top:1rem;
  color:#aaa;
}
body.page-about .app-link a{
  color:var(--accent);
  text-decoration:underline;
}
body.page-about .app-link a:hover{
  color:#fff;
}

body.page-about .app-section button{
  display:inline-block;
  margin-top:2rem;
  padding:18px 40px;
  background:linear-gradient(135deg, #ff0000, #cc0000);
  color:#fff;
  border:none;
  border-radius:12px;
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  transition:all .3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-about .app-section button:hover{
  background:linear-gradient(135deg, #cc0000, #990000);
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

body.page-about .reveal{
  opacity:1;
  transform:translateY(0);
  transition:opacity .8s ease,transform .8s ease;
}
body.page-about .reveal.show{
  opacity:1;
  transform:translateY(0);
}

@keyframes aboutFadeUp{
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media (max-width: 768px){
  body.page-about .hero-content h1{ font-size:26px; }
  body.page-about .hero-content p{ font-size:14px; }
  body.page-about .features-container{ padding:0 12px; }
  body.page-about .features{ gap:12px; }
  body.page-about .feature-box{ min-width:200px; padding:16px; }
  body.page-about .section{ display:block; text-align:center; padding:24px 12px; }
  body.page-about .section img{ max-width:100%; margin-bottom:16px; }
  body.page-about .contact-content{ display:block; }
  body.page-about .app-preview{ flex-direction:column; align-items:center; }
  body.page-about .app-link{ flex-wrap:wrap; justify-content:center; }
}
@media (max-width: 480px){
  body.page-about .hero-content h1{ font-size:22px; }
  body.page-about .feature-box{ min-width:160px; padding:12px; }
  body.page-about .scroll-buttons{ display:flex; }
}

body.page-404{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  text-align:center;
  min-height:100vh;
  color:var(--text);
}
body.page-404 .container{
  max-width:600px;
  margin:100px auto 40px;
  padding:60px 20px;
}
body.page-404 h1{
  font-size:120px;
  margin:0 0 10px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-404 .container p{
  font-size:24px;
  color:var(--muted);
  margin:0 0 30px;
}
body.page-404 .btn,
body.page-404 a.btn{
  display:inline-block;
  margin-top:20px;
  text-decoration:none;
  padding:15px 30px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border-radius:12px;
  font-weight:600;
  font-size:16px;
  transition:.3s;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-404 .btn:hover,
body.page-404 a.btn:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

@media (max-width: 768px){
  body.page-404 .container{ padding:0 16px; }
  body.page-404 h1{ font-size:80px; }
  body.page-404 p{ font-size:16px; }
}

body.page-500{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  text-align:center;
  min-height:100vh;
  color:var(--text);
}
body.page-500 .container{
  max-width:600px;
  margin:100px auto 40px;
  padding:60px 20px;
}
body.page-500 h1{
  font-size:120px;
  margin:0 0 10px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-500 .container p{
  font-size:24px;
  color:var(--muted);
  margin:0 0 30px;
}
body.page-500 .btn,
body.page-500 a.btn{
  display:inline-block;
  margin-top:20px;
  text-decoration:none;
  padding:15px 30px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  border-radius:12px;
  font-weight:600;
  font-size:16px;
  transition:.3s;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-500 .btn:hover,
body.page-500 a.btn:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,0,0,0.4);
}

@media (max-width: 768px){
  body.page-500 .container{ padding:0 16px; }
  body.page-500 h1{ font-size:80px; }
  body.page-500 p{ font-size:16px; }
}

body.page-notifications{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:var(--text);
  min-height:100vh;
}
body.page-notifications .container{
  max-width:900px;
  margin:100px auto 40px;
  padding:20px;
}
body.page-notifications .card{
  background:rgba(26,26,26,0.95);
  border-radius:20px;
  padding:24px;
  border:1px solid rgba(255,255,255,0.08);
  backdrop-filter:blur(15px);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
}
body.page-notifications .card h2{
  margin:0 0 20px;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-notifications .item{
  padding:14px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  cursor:pointer;
  transition:.25s;
  border-radius:8px;
}
body.page-notifications .item:last-child{border-bottom:none}
body.page-notifications .item.unread{
  background:rgba(96,165,250,0.08);
}
body.page-notifications .title{
  font-weight:700;
  color:#fff;
}
body.page-notifications .msg{
  margin-top:4px;
  color:var(--muted);
}
body.page-notifications .meta{
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
  opacity:.7;
}
body.page-notifications .item:hover{
  background:rgba(255,255,255,0.03);
}

@media (max-width: 768px){
  body.page-notifications .container{ padding:16px; margin:80px auto 20px; }
  body.page-notifications .card{ padding:16px; border-radius:12px; }
}
@media (max-width: 480px){
  body.page-notifications .item{ padding:12px; }
}

body.page-affiliate{
  margin:0;
  background: linear-gradient(180deg, #0b0e11 0%, #12161c 100%);
  color:var(--text);
  min-height:100vh;
}
body.page-affiliate .wrap{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}
body.page-affiliate .site-header{
  position:sticky;
  top:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  height:70px;
  background:rgba(11,14,17,0.95);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(6px);
}
body.page-affiliate .nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
}
body.page-affiliate .logo{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
}
body.page-affiliate .logo img{
  height:40px;
  width:auto;
  object-fit:contain;
  filter:drop-shadow(0 2px 10px rgba(0,255,204,.35));
}
body.page-affiliate .menu{
  display:flex;
  align-items:center;
  gap:18px;
  font-weight:600;
  flex-wrap:wrap;
  justify-content:flex-end;
}
body.page-affiliate .menu a{
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  font-weight:500;
  position:relative;
}
body.page-affiliate .menu a::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-affiliate .menu a:hover::before{
  width:100%;
  left:0;
}
body.page-affiliate .menu a:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}
body.page-affiliate .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border:1px solid transparent;
  border-radius:8px;
  font-weight:700;
  transition:all .2s;
  cursor:pointer;
  text-decoration:none;
}
body.page-affiliate .btn.primary{
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  box-shadow:0 5px 20px rgba(255,0,0,0.3);
}
body.page-affiliate .btn.primary:hover{
  background:linear-gradient(135deg, var(--primary-dark), #990000);
  transform:translateY(-2px);
}
body.page-affiliate .btn.ghost{
  background-color:transparent;
  border:2px solid #ff0000;
  color:#ff0000;
  font-weight:500;
}
body.page-affiliate .btn.ghost:hover{
  background-color:#ff0000;
  color:#fff;
  transform:translateY(-2px);
}
body.page-affiliate .signin-btn{
  background-color:transparent !important;
  border:2px solid #ff0000 !important;
  color:#ff0000 !important;
  padding:10px 16px !important;
  border-radius:8px !important;
  font-weight:500 !important;
  text-decoration:none !important;
  transition:all .3s ease;
  cursor:pointer !important;
  display:inline-block !important;
  box-shadow:none !important;
}
body.page-affiliate .signin-btn:hover{
  background-color:#ff0000 !important;
  color:#fff !important;
  transform:translateY(-2px) !important;
}
body.page-affiliate .signup-btn{
  background:linear-gradient(135deg, #ff0000, #cc0000) !important;
  color:#fff !important;
  border:2px solid transparent !important;
  padding:10px 20px !important;
  border-radius:8px !important;
  font-weight:600 !important;
  text-decoration:none !important;
  transition:all .3s ease;
  cursor:pointer !important;
  display:inline-block !important;
}
body.page-affiliate .signup-btn:hover{
  background:linear-gradient(135deg, #cc0000, #990000) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 5px 15px rgba(255,0,0,0.3) !important;
}
body.page-affiliate .menu a.signin-btn::before,
body.page-affiliate .menu a.signup-btn::before{
  display:none !important;
}
body.page-affiliate .hero{
  padding:48px 0 16px;
}
body.page-affiliate .digital-box{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  background:rgba(26,26,26,0.95);
  border:1px solid var(--border);
  border-radius:20px;
  padding:28px;
  box-shadow:var(--shadow);
}
body.page-affiliate .tag{
  display:inline-block;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:999px;
  padding:6px 10px;
  color:var(--muted);
  font-size:12px;
  margin-bottom:10px;
}
body.page-affiliate h1{
  margin:6px 0 10px;
  font-size:28px;
  line-height:1.2;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-affiliate p.lead{
  color:var(--muted);
  max-width:42ch;
}
body.page-affiliate .actions{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
body.page-affiliate .milkacase-digital{
  position:relative;
  height:220px;
  border-radius:16px;
  background:rgba(26,26,26,0.5);
  border:1px solid var(--border);
  display:grid;
  place-items:center;
  overflow:hidden;
}
body.page-affiliate .milkacase-logo{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:18px;
  font-weight:800;
  padding:12px 16px;
  border-radius:12px;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
}
body.page-affiliate .milkacase-logo .dot{
  width:10px;
  height:10px;
  border-radius:99px;
  background:var(--primary);
}
body.page-affiliate .section{
  padding:40px 0;
}
body.page-affiliate .section h2{
  font-size:24px;
  margin:0 0 18px;
  text-align:center;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
body.page-affiliate .how-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:22px;
  position:relative;
  padding:6px 12px;
}
body.page-affiliate .step{
  position:relative;
  background:#1a1a1a;
  border:1px solid var(--border);
  border-radius:16px;
  padding:22px 18px;
  min-height:150px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:8px;
  transition:.25s;
}
body.page-affiliate .step:hover{
  border-color:var(--primary);
  transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(255,0,0,0.14);
}
body.page-affiliate .step .num{
  font-weight:800;
  color:var(--accent);
  font-size:56px;
}
body.page-affiliate .step p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
body.page-affiliate .why{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;
}
body.page-affiliate .bigbox{
  background:rgba(26,26,26,0.95);
  border:1px solid var(--border);
  border-radius:18px;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
body.page-affiliate .coinwall{
  height:220px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,0.1);
  display:grid;
  place-items:center;
  color:var(--muted);
}
body.page-affiliate .mini-col{
  display:grid;
  grid-template-rows:repeat(4, 1fr);
  gap:12px;
}
body.page-affiliate .whycard{
  background:#1a1a1a;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  transition:.25s;
}
body.page-affiliate .whycard:hover{
  border-color:var(--primary);
  transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(255,0,0,0.10);
}
body.page-affiliate .whycard h4{
  margin:0 0 6px;
  font-size:15px;
  color:var(--accent);
}
body.page-affiliate .whycard p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}
body.page-affiliate .perfect{
  background:#1a1a1a;
  border:1px solid var(--border);
  border-radius:16px;
  padding:18px;
  margin-top:8px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
body.page-affiliate .pf-card{
  background:#1a1a1a;
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:12px;
  transition:.25s;
}
body.page-affiliate .pf-card:hover{
  border-color:var(--primary);
  transform:translateY(-4px);
  box-shadow:0 12px 24px rgba(255,0,0,0.12);
}
body.page-affiliate .pf-ico{
  flex:0 0 38px;
  height:38px;
  width:38px;
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  border:1px solid var(--border);
  display:grid;
  place-items:center;
  color:var(--accent);
}
body.page-affiliate .pf-card h5{
  margin:0 0 4px;
  font-size:20px;
  color:var(--text);
}
body.page-affiliate .pf-card p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
body.page-affiliate .aff-wrap{
  max-width:1000px;
  margin:0 auto;
  padding:0 16px;
}
body.page-affiliate .aff-panel{
  background:rgba(26,26,26,0.95);
  border:1px solid var(--border);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--shadow);
}
body.page-affiliate .aff-panel h2{
  text-align:left;
  font-size:18px;
  margin:0 0 12px;
  color:var(--text);
}
body.page-affiliate .aff-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
}
body.page-affiliate .aff-card{
  background:#1a1a1a;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  min-height:92px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
}
body.page-affiliate .aff-card strong{
  color:var(--muted);
  font-size:12px;
  letter-spacing:.2px;
}
body.page-affiliate .aff-card p{
  margin:0;
  font-weight:800;
  font-size:18px;
  color:var(--text);
}
body.page-affiliate .aff-note{
  margin:10px 0 0;
  color:var(--muted);
  font-size:12px;
}
body.page-affiliate .ref-row{
  display:flex;
  gap:10px;
  align-items:center;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--border);
  border-radius:14px;
  padding:10px;
}
body.page-affiliate .ref-row input{
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  color:var(--text);
  font-weight:600;
  font-size:14px;
  padding:8px 10px;
}
body.page-affiliate .ref-row .copy-btn{
  white-space:nowrap;
  border-radius:8px;
  padding:10px 14px;
  border:1px solid var(--border);
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font-weight:800;
  transition:.2s;
}
body.page-affiliate .ref-row .copy-btn:hover{
  border-color:var(--primary);
}
body.page-affiliate .withdraw-grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
}
body.page-affiliate .withdraw-grid input{
  width:100%;
  background:rgba(255,255,255,0.05);
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  color:var(--text);
  outline:none;
  font-size:14px;
}
body.page-affiliate .withdraw-grid input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(255,0,0,0.12);
}
body.page-affiliate .withdraw-grid button{
  border:none;
  border-radius:8px;
  padding:12px 16px;
  cursor:pointer;
  font-weight:900;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  transition:.2s;
}
body.page-affiliate .withdraw-grid button:hover{
  transform:translateY(-1px);
}
body.page-affiliate .aff-status{
  margin-top:10px;
  font-size:13px;
  color:var(--muted);
}
body.page-affiliate .auth-only{display:none}
body.page-affiliate .public-only{display:block}
body.page-affiliate .dropdown{
  position:relative;
  display:inline-block;
}
body.page-affiliate .dropdown-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:8px;
  transition:all .3s ease;
  cursor:pointer;
  font-weight:500;
  position:relative;
}
body.page-affiliate .dropdown-toggle::before{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  bottom:0;
  left:50%;
  background-color:var(--primary);
  transition:all .3s ease;
}
body.page-affiliate .dropdown-toggle:hover::before{
  width:100%;
  left:0;
}
body.page-affiliate .dropdown-toggle:hover{
  background-color:rgba(255,0,0,0.1);
  transform:translateY(-2px);
}
body.page-affiliate .dropdown-menu{
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  background:rgba(34,34,34,0.98);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 8px 25px rgba(0,0,0,0.4);
  display:none;
  z-index:1000;
}
body.page-affiliate .dropdown:hover .dropdown-menu{
  display:block;
  animation:mc_fadeInDown .3s ease;
}
body.page-affiliate .dropdown-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 18px;
  color:#fff;
  text-decoration:none;
  font-size:14px;
  transition:all .3s ease;
  border-bottom:1px solid rgba(255,255,255,0.1);
}
body.page-affiliate .dropdown-item:last-child{ border-bottom:none; }
body.page-affiliate .dropdown-item:hover{
  background:linear-gradient(135deg,rgba(255,0,0,0.2),rgba(204,0,0,0.2));
}
body.page-affiliate #backToDashboard i{
  margin-right:8px;
}
body.page-affiliate .ico{
  width:18px;
  height:18px;
  flex-shrink:0;
}

body.page-affiliate .aff-panel + .aff-panel{
  margin-top:14px;
}
body.page-affiliate .aff-wrap > h2{
  text-align:left;
  margin-bottom:16px;
}
body.page-affiliate .aff-panel h2{
  text-align:left;
}
body.page-affiliate .site-footer p{
  margin-top:20px;
  color:var(--muted);
}
body.page-affiliate .site-footer{
  margin-top:40px;
}

@media (max-width: 960px){
  body.page-affiliate .digital-box,
  body.page-affiliate .why{grid-template-columns:1fr}
  body.page-affiliate .how-grid{grid-template-columns:1fr; gap:12px}
  body.page-affiliate .perfect{grid-template-columns:1fr}
  body.page-affiliate .aff-grid{grid-template-columns:1fr}
  body.page-affiliate .withdraw-grid{grid-template-columns:1fr}
  body.page-affiliate .menu{gap:12px}
}

.logo_png{
  height: 100px !important; width: auto !important; transform: scale(1.6) !important; transform-origin: left center !important; display: block !important;
}

body.page-index .right a.download-app-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 42px;
  padding: 10px 18px !important;

  border: 1px solid #00ffcc !important;
  border-radius: 8px !important;

  background: #00ffcc !important;
  color: #0b0e11 !important;

  font-weight: 700 !important;
  text-decoration: none !important;

  transition:
    transform 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease !important;
}

body.page-index .right a.download-app-btn::before {
  display: none !important;
  content: none !important;
}

body.page-index .right a.download-app-btn:hover {
  background: #00e5b8 !important;
  color: #0b0e11 !important;

  transform: translateY(-2px) !important;

  box-shadow:
    0 8px 20px
    rgba(0, 255, 204, 0.25) !important;
}

@media (max-width: 768px) {
  body.page-index .right a.download-app-btn {
    width: 100% !important;
    padding: 15px !important;
  }
}
body.page-index #transactionModal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background:
    rgba(0, 0, 0, 0.78);
  backdrop-filter: blur(5px);
}

body.page-index #transactionModal .modal-content {
  position: relative;
  width: min(520px, 100%);
  padding: 28px !important;
  border:
    1px solid
    rgba(0, 255, 204, 0.35);
  border-radius:
    16px !important;
  background:
    #111 !important;
  box-shadow:
    0 25px 70px
    rgba(0, 0, 0, 0.7);
}

body.page-index #transactionModal .close {
  position: absolute;
  top: 10px;
  right: 16px;
  color: #ffffff;
}

body.page-index #transactionModal #backButton {
  min-width: 130px;
  margin-top: 10px;
}
body.page-transactions #transactions-container {
  width: 100%;
  max-width: 1100px;
  margin-top: 24px;
}

body.page-transactions .transactions-table {
  width: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  background: rgba(20, 23, 27, 0.92);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.26);
}

body.page-transactions .transactions-header,
body.page-transactions .transactions-row {
  display: grid;
  grid-template-columns:
    190px
    minmax(230px, 1fr)
    150px
    150px;
  gap: 20px;
  align-items: center;
}

body.page-transactions .transactions-header {
  padding: 16px 20px;
  color: #98a2b3;
  background: rgba(255, 255, 255, 0.035);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

body.page-transactions .transactions-row {
  width: 100%;
  padding: 18px 20px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.065);
  color: #f5f7fa;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

body.page-transactions .transactions-row:last-child {
  border-bottom: 0;
}

body.page-transactions .transactions-row:hover {
  background: rgba(0, 255, 204, 0.055);
}

body.page-transactions .transaction-cell {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-transactions .transaction-date {
  color: #aab2c0;
  font-size: 14px;
}

body.page-transactions .transaction-name {
  color: #ffffff;
  font-weight: 700;
}

body.page-transactions .transaction-type {
  color: #cbd2dc;
}

body.page-transactions .transaction-status {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  padding: 7px 11px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}

body.page-transactions .status-completed,
body.page-transactions .status-paid {
  color: #62e6a7;
  background: rgba(49, 196, 132, 0.13);
}

body.page-transactions .status-pending,
body.page-transactions .status-queued,
body.page-transactions .status-payout_pending,
body.page-transactions .status-processing {
  color: #ffc857;
  background: rgba(255, 190, 69, 0.13);
}

body.page-transactions .status-under_review,
body.page-transactions .status-ai_review,
body.page-transactions .status-assigned,
body.page-transactions .status-verified,
body.page-transactions .status-approved {
  color: #70b7ff;
  background: rgba(79, 157, 255, 0.13);
}

body.page-transactions .status-failed,
body.page-transactions .status-rejected,
body.page-transactions .status-cancelled,
body.page-transactions .status-canceled {
  color: #ff7777;
  background: rgba(255, 88, 88, 0.13);
}

@media (max-width: 900px) {
  body.page-transactions .transactions-header {
    display: none;
  }

  body.page-transactions .transactions-row {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
  }

  body.page-transactions .transaction-cell {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 14px;
    white-space: normal;
  }

  body.page-transactions .transaction-cell::before {
    content: attr(data-label);
    color: #8993a4;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
  }
}
body.page-transactions .logo-home-link,
body.page-profile .logo-home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

body.page-transactions .transaction-details-card {
  position: relative;
  width: min(560px, calc(100% - 32px));
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 18px;
  background: #101316;
  color: #f5f7fa;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.62);
}

body.page-transactions .transaction-details-card h2 {
  margin: 0 44px 24px;
  color: #ffffff;
  font-size: 28px;
  text-align: center;
}

body.page-transactions .transaction-details-card .close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-grid;
  place-items: center;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  font-size: 26px !important;
  line-height: 1 !important;
  cursor: pointer;
}

body.page-transactions .transaction-details-list {
  display: grid;
}

body.page-transactions .transaction-detail-row,
body.page-transactions .phone-number-container {
  display: grid;
  grid-template-columns:
    minmax(145px, 0.8fr)
    minmax(0, 1.2fr);
  gap: 22px;
  align-items: center;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 12px 0;
  border-bottom:
    1px solid
    rgba(255, 255, 255, 0.075);
}

body.page-transactions .transaction-detail-row:last-child {
  border-bottom: 0;
}

body.page-transactions .transaction-detail-label {
  color: #d9dee7 !important;
  font-weight: 700;
}

body.page-transactions .transaction-detail-value,
body.page-transactions #datetime,
body.page-transactions #phoneNumberValue {
  min-width: 0;
  color: #ffffff !important;
  font-weight: 500;
  text-align: right;
  overflow-wrap: anywhere;
}

body.page-transactions .transaction-detail-status {
  justify-self: end;
  display: inline-flex;
  width: max-content;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
}

body.page-transactions .transaction-detail-status.status-completed,
body.page-transactions .transaction-detail-status.status-paid {
  color: #62e6a7 !important;
  background: rgba(49, 196, 132, 0.14);
}

body.page-transactions .transaction-detail-status.status-pending,
body.page-transactions .transaction-detail-status.status-queued,
body.page-transactions .transaction-detail-status.status-payout_pending,
body.page-transactions .transaction-detail-status.status-processing {
  color: #ffc857 !important;
  background: rgba(255, 190, 69, 0.14);
}

body.page-transactions .transaction-detail-status.status-under_review,
body.page-transactions .transaction-detail-status.status-ai_review,
body.page-transactions .transaction-detail-status.status-assigned,
body.page-transactions .transaction-detail-status.status-verified,
body.page-transactions .transaction-detail-status.status-approved {
  color: #70b7ff !important;
  background: rgba(79, 157, 255, 0.14);
}

body.page-transactions .transaction-detail-status.status-failed,
body.page-transactions .transaction-detail-status.status-rejected,
body.page-transactions .transaction-detail-status.status-cancelled,
body.page-transactions .transaction-detail-status.status-canceled {
  color: #ff8585 !important;
  background: rgba(255, 88, 88, 0.14);
}

@media (max-width: 600px) {
  body.page-transactions .transaction-details-card {
    width: calc(100% - 24px);
    padding: 24px 18px;
  }

  body.page-transactions .transaction-detail-row,
  body.page-transactions .phone-number-container {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  body.page-transactions .transaction-detail-value,
  body.page-transactions #datetime,
  body.page-transactions #phoneNumberValue {
    text-align: left;
  }

  body.page-transactions .transaction-detail-status {
    justify-self: start;
  }
}
/* CMS-authored public article blocks */
body.page-news-article .main-article #content p,
body.page-news-article .main-article #content li {
  line-height: 1.75;
}
body.page-news-article .main-article #content blockquote {
  margin: 24px 0;
  padding: 16px 20px;
  border-left: 4px solid var(--primary);
  border-radius: 0 10px 10px 0;
  background: rgba(255,255,255,.05);
  font-style: italic;
}
body.page-news-article .main-article figure {
  margin: 24px 0;
}
body.page-news-article .main-article figcaption,
body.page-news-article .main-article .media-caption {
  color: #9aa4b2;
  font-size: 14px;
  text-align: center;
}
body.page-news-article .article-video-wrap video,
body.page-news-article #thumbnail:is(video) {
  display: block;
  width: 100%;
  border-radius: 12px;
  margin: 20px 0;
  background: #000;
}
body.page-news-article .article-cta-wrap {
  margin: 28px 0;
}
body.page-news-article .article-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 10px;
  background: var(--primary);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(255,0,0,.2);
}
body.page-news-article .article-cta:hover,
body.page-news-article .article-cta:focus-visible {
  transform: translateY(-1px);
  filter: brightness(1.08);
}
body.page-news .news-read-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  min-height: 40px;
  padding: 8px 14px;
  border-radius: 9px;
  background: var(--primary);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
body.page-news .news-read-more:hover,
body.page-news .news-read-more:focus-visible {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

body.page-signin #phone-group,
body.page-signin #email-group,
body.page-signin .form-group {
    width: 100%;
    box-sizing: border-box;
}

body.page-signin #email {
    width: 100%;
    box-sizing: border-box;
}

body.page-signin #phone-group .iti {
    width: 100%;
    display: block;
}

body.page-signin #phone-group .iti input {
    width: 100%;
    box-sizing: border-box;
}

body.page-signin #password {
    width: 100%;
    box-sizing: border-box;
}
/* =====================================================
   INDEX HEADER - MOBILE + TABLET FIX
   ===================================================== */

@media (max-width: 1024px) {

  /* Hamburger muuqda */
  body.page-index .hamburger {
    display: block !important;
    position: relative;
    z-index: 1002;
    flex-shrink: 0;
  }

  /* Logo-ga header-ka ha ku dhex ekaado */
  body.page-index header .logo_png {
    height: 40px !important;
    width: auto !important;
    max-width: 180px !important;
    transform: none !important;
    transform-origin: center !important;
    object-fit: contain !important;
    display: block !important;
  }

  /*
   * MUHIIM:
   * menu-ga oo dhan waa qarsoon yahay
   * ilaa hamburger la taabto.
   */
  body.page-index header .right {
    display: none !important;

    position: absolute !important;
    top: 70px !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    max-height: calc(100vh - 70px);
    overflow-y: auto;

    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;

    padding: 18px !important;

    background: rgba(25, 25, 25, 0.98) !important;
    backdrop-filter: blur(15px);

    border-radius: 0 0 15px 15px;
    z-index: 1001 !important;
  }

  /* Hamburger markuu OPEN yahay */
  body.page-index header .right.active {
    display: flex !important;
  }

  /* Dhammaan qaybaha menu-ga full width */
  body.page-index header .right > *,
  body.page-index header .dropdown {
    width: 100%;
  }

  body.page-index header .right > a,
  body.page-index header .dropdown-button,
  body.page-index header .balance-btn {
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
    justify-content: space-between;
  }

  /* Submenu-yada default ahaan xir */
  body.page-index header .dropdown-content,
  body.page-index header .dropdown:hover .dropdown-content {
    display: none !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;

    margin: 5px 0 10px !important;

    background: rgba(51, 51, 51, 0.85) !important;
    box-shadow: none !important;
    border-radius: 8px !important;
  }

  /* JS ayaa class-kan siinaya dropdown-ka la furay */
  body.page-index header .dropdown.mobile-open > .dropdown-content {
    display: block !important;
  }

  body.page-index header .dropdown.mobile-open > .dropdown-button .arrow,
  body.page-index header .dropdown.mobile-open > .dropdown-button .dropdown-arrow {
    transform: rotate(180deg);
  }

  body.page-index .auth-buttons {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.page-index .auth-buttons a {
    width: 100% !important;
  }

  body.page-index .balance-dropdown {
    width: 100%;
  }
}
body.page-change-password .cp-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(6px);
}

body.page-change-password .cp-modal.is-open{
  display:flex;
}

body.page-change-password .cp-modal-card{
  width:min(420px, 92vw);
  padding:30px 26px 24px;
  border-radius:18px;
  background:rgba(26,26,26,.98);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:
    0 24px 70px rgba(0,0,0,.55),
    0 0 30px rgba(255,0,0,.08);
  text-align:center;
}

body.page-change-password .cp-modal-icon{
  width:62px;
  height:62px;
  margin:0 auto 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(0,180,130,.14);
  border:1px solid rgba(0,220,160,.35);
  color:#00d99a;
  font-size:32px;
  font-weight:700;
}

body.page-change-password .cp-modal-card h3{
  margin:0 0 10px;
  color:#fff;
  font-size:22px;
}

body.page-change-password .cp-modal-card p{
  margin:0 0 22px;
  color:#b9b9b9;
  font-size:15px;
  line-height:1.6;
}

body.page-change-password .cp-modal-card button{
  margin:0;
  width:100%;
  padding:14px 18px;
  border:0;
  border-radius:10px;
  background:linear-gradient(
    135deg,
    var(--primary),
    var(--primary-dark)
  );
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  text-transform:uppercase;
  letter-spacing:.5px;
}

body.page-change-password .cp-modal-card button:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(255,0,0,.25);
}
.page-portfolio #txModal .close-btn {
  position: static;
  top: auto;
  right: auto;
  transform: none;

  flex: 0 0 auto;

  padding: 9px 15px;

  border:
    1px solid
    rgba(255, 255, 255, 0.15);

  border-radius: 8px;

  background: #20252a;
  color: #fff;

  font-size: 14px;
  line-height: 1.2;

  cursor: pointer;

  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.page-portfolio #txModal .close-btn:hover {
  background: #2b3238;
}

.page-portfolio #txModal .close-btn:active {
  transform: scale(0.97);
}
.page-portfolio #txModal {
  position: fixed;
  inset: 0;
  z-index: 9999;

  display: none;
  align-items: center;
  justify-content: center;

  padding: 24px;

  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(5px);
}

.page-portfolio #txModal.show {
  display: flex;
}

.page-portfolio #txModal .modal-card {
  width: min(620px, 100%);
  max-height: 85vh;
  overflow-y: auto;

  padding: 24px;

  background: #15191d;

  border:
    1px solid
    rgba(255, 255, 255, 0.10);

  border-radius: 16px;

  box-shadow:
    0 24px 70px
    rgba(0, 0, 0, 0.55);
}

.page-portfolio #txModal .modal-card > .flex-row {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;
  margin-bottom: 20px;
}

.page-portfolio #txModal .section-heading {
  margin: 0;

  color: #00f0d0;
  font-size: 22px;
}

.page-portfolio #txModal .tx-details {
  display: grid;
  gap: 8px;
  margin-top: 0;
}

.page-portfolio #txModal .tx-detail-row {
  display: grid;

  grid-template-columns:
    minmax(110px, 150px)
    minmax(0, 1fr);

  gap: 18px;

  padding: 12px 14px;

  background: #101418;

  border:
    1px solid
    rgba(255, 255, 255, 0.06);

  border-radius: 9px;
}

.page-portfolio #txModal .tx-detail-label {
  color: #9aa4ad;

  font-size: 13px;
  font-weight: 600;
}

.page-portfolio #txModal .tx-detail-value {
  min-width: 0;

  color: #f2f5f7;

  font-size: 14px;
  text-align: right;

  overflow-wrap: anywhere;
}

@media (max-width: 600px) {

  .page-portfolio #txModal {
    padding: 14px;
  }

  .page-portfolio #txModal .modal-card {
    padding: 18px;
  }

  .page-portfolio #txModal .tx-detail-row {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .page-portfolio #txModal .tx-detail-value {
    text-align: left;
  }
}
body.page-liquidations .data-source-status{
  max-width:1280px;
  margin:8px auto;
  padding:0 16px;
  font-size:12px;
}

body.page-liquidations .tag.active{
  border-color:var(--accent);
  box-shadow:0 0 0 1px var(--accent);
}

body.page-liquidations .chart{
  height:320px;
  position:relative;
  overflow:hidden;
}

body.page-liquidations #liquidationChart{
  width:100%;
  height:100%;
  display:block;
}

body.page-liquidations .chart-empty{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
}

body.page-liquidations .chart-empty[hidden]{
  display:none;
}

body.page-liquidations .empty-state{
  padding:20px;
  text-align:center;
  color:var(--muted);
}

body.page-liquidations .tape-row.liq-long{
  border-left:3px solid var(--good);
}

body.page-liquidations .tape-row.liq-short{
  border-left:3px solid var(--bad);
}

body.page-liquidations .pager{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:16px;
}

body.page-liquidations .pager button{
  background:#18202b;
  color:#e9eef3;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  padding:7px 12px;
  cursor:pointer;
}

body.page-liquidations .pager button:disabled{
  opacity:.4;
  cursor:not-allowed;
}

body.page-liquidations .is-filtered-out {
  display: none !important;
}

body.page-liquidations #heatmap .cell[hidden] {
  display: none !important;
}

body.page-liquidations #tape .tape-row[hidden] {
  display: none !important;
}

body.page-liquidations .logo_png {
  display: block !important;
  width: auto !important;
  height: 44px !important;
  max-width: 180px !important;

  transform: none !important;
  transform-origin: center !important;
}

body.page-liquidations .row > *,
body.page-liquidations .card,
body.page-liquidations .headline,
body.page-liquidations .nav-right,
body.page-liquidations .tags {
  min-width: 0;
}

body.page-liquidations .metrics-inner,
body.page-liquidations .navwrap,
body.page-liquidations .container {
  width: 100%;
  box-sizing: border-box;
}

body.page-liquidations #filterStatus,
body.page-liquidations .data-source-status {
  width: 100%;
  max-width: 1280px;

  margin: 10px auto;
  padding-left: 16px;
  padding-right: 16px;

  box-sizing: border-box;

  line-height: 1.5;
  overflow-wrap: anywhere;
}

body.page-liquidations .card-header {
  gap: 12px;
  flex-wrap: wrap;
}

body.page-liquidations .tags {
  max-width: 100%;
}

body.page-liquidations .dropdown {
  max-width: 100%;
}

body.page-liquidations .dropdown select {
  max-width: 100%;
}

body.page-liquidations .table-wrap {
  width: 100%;
  max-width: 100%;

  overflow-x: auto;
  overflow-y: visible;

  box-sizing: border-box;

  -webkit-overflow-scrolling: touch;
}

body.page-liquidations
section[aria-label="Exchange Liquidations"]
table {
  min-width: 760px;
}

body.page-liquidations
section[aria-label="Top 10 events"]
table {
  min-width: 620px;
}

body.page-liquidations
section[aria-label="Total Liquidations Table"]
table {
  min-width: 1080px;
}


/* Footer should wrap cleanly */
body.page-liquidations .site-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  gap: 12px 18px;

  box-sizing: border-box;
}

body.page-liquidations .site-footer a {
  margin: 0;
}

body.page-liquidations .site-footer p {
  flex: 0 0 100%;

  margin:
    8px 0 0;

  padding:
    0 12px;

  box-sizing:
    border-box;
}

@media (max-width: 1100px) {

  body.page-liquidations
  .metrics-inner {
    grid-template-columns:
      1fr;

    gap: 12px;

    padding:
      12px 20px;
  }


  body.page-liquidations
  .brand {
    justify-content:
      center;
  }


  body.page-liquidations
  .headline {
    width: 100%;

    display: grid;

    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );

    grid-auto-flow:
      row;

    gap: 8px;
  }


  body.page-liquidations
  .metric {
    min-width: 0;

    justify-content:
      space-between;

    flex-wrap: wrap;
  }


  body.page-liquidations
  .navwrap {
    grid-template-columns:
      1fr;

    gap: 10px;

    padding:
      4px 20px 14px;
  }


  body.page-liquidations
  .navwrap > div:first-child {
    display: none;
  }


  body.page-liquidations
  .nav-center {
    justify-content:
      center;

    flex-wrap:
      wrap;
  }


  body.page-liquidations
  .nav-right {
    width: 100%;

    justify-content:
      center;

    flex-wrap:
      wrap;
  }


  body.page-liquidations
  .nav-right .search {
    width:
      min(
        100%,
        420px
      );

    min-width: 0;

    box-sizing:
      border-box;
  }


  body.page-liquidations
  .row {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }
}

@media (max-width: 768px) {

  body.page-liquidations
  .metrics {
    position:
      static;

    backdrop-filter:
      none;
  }


  body.page-liquidations
  .metrics-inner {
    padding:
      12px;
  }


  body.page-liquidations
  .headline {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  body.page-liquidations
  .metric {
    align-items:
      flex-start;

    flex-direction:
      column;

    gap: 3px;

    padding:
      8px 10px;
  }


  body.page-liquidations
  .metric small {
    font-size:
      11px;
  }


  body.page-liquidations
  .metric b {
    font-size:
      14px;

    overflow-wrap:
      anywhere;
  }


  body.page-liquidations
  .navwrap {
    padding:
      4px 12px 12px;
  }


  body.page-liquidations
  .nav-center {
    width:
      100%;

    gap:
      6px;
  }


  body.page-liquidations
  .nav-center a {
    padding:
      8px 11px;
  }


  body.page-liquidations
  .nav-right {
    width:
      100%;
  }


  body.page-liquidations
  .search {
    width:
      100%;

    max-width:
      420px;

    min-width:
      0;
  }


  body.page-liquidations
  .container {
    margin:
      12px auto 24px;

    padding:
      0 12px;

    gap:
      14px;
  }


  body.page-liquidations
  .card {
    border-radius:
      14px;
  }


  body.page-liquidations
  .card-header {
    align-items:
      flex-start;

    padding:
      12px;
  }


  body.page-liquidations
  .card-header .tags {
    width:
      100%;

    justify-content:
      flex-start;
  }


  body.page-liquidations
  .heatmap {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );

    grid-auto-rows:
      auto;

    gap:
      8px;

    padding:
      10px;
  }

  body.page-liquidations
  .heatmap .cell[data-w] {
    grid-column:
      span 1 !important;

    min-height:
      64px;
  }


  body.page-liquidations
  .cell {
    padding:
      8px;

    overflow:
      hidden;
  }


  body.page-liquidations
  .cell > div {
    min-width:
      0;

    overflow-wrap:
      anywhere;
  }


  body.page-liquidations
  .kpi {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );

    padding:
      10px;
  }


  body.page-liquidations
  .linkrow {
    width:
      100%;
  }


  body.page-liquidations
  .linkbtn {
    flex:
      1 1 120px;

    text-align:
      center;
  }


  body.page-liquidations
  .tape-row {
    grid-template-columns:
      minmax(0, 1.5fr)
      minmax(80px, .7fr)
      minmax(80px, .7fr)
      minmax(70px, .6fr);

    gap:
      8px;

    font-size:
      13px;
  }


  body.page-liquidations
  .chart {
    height:
      280px;

    margin:
      10px;
  }


  body.page-liquidations
  .pager {
    flex-wrap:
      wrap;

    gap:
      8px;

    padding:
      12px;
  }
}

@media (max-width: 560px) {

  body.page-liquidations
  .logo_png {
    height:
      38px !important;

    max-width:
      150px !important;
  }


  body.page-liquidations
  .headline {
    grid-template-columns:
      1fr;
  }


  body.page-liquidations
  .nav-center {
    justify-content:
      space-between;
  }


  body.page-liquidations
  .nav-center a {
    flex:
      1 1 auto;

    text-align:
      center;

    padding:
      8px 6px;

    font-size:
      14px;
  }


  body.page-liquidations
  .nav-right {
    align-items:
      stretch;
  }


  body.page-liquidations
  .nav-right .search {
    max-width:
      none;
  }


  body.page-liquidations
  .nav-right
  .signin-btn {
    width:
      100%;

    text-align:
      center;
  }


  body.page-liquidations
  #filterStatus,
  body.page-liquidations
  .data-source-status {
    padding-left:
      12px;

    padding-right:
      12px;

    font-size:
      11px;
  }


  body.page-liquidations
  .heatmap {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  body.page-liquidations
  .kpi {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  body.page-liquidations
  .tape-row {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr);

    gap:
      6px 10px;
  }


  body.page-liquidations
  .tape-row > div {
    min-width:
      0;

    overflow-wrap:
      anywhere;
  }


  body.page-liquidations
  .chart {
    height:
      250px;

    margin:
      8px;
  }


  body.page-liquidations
  .search-wide {
    width:
      100%;

    min-width:
      0;
  }


  body.page-liquidations
  .site-footer {
    margin-top:
      28px;

    padding:
      18px 12px;

    gap:
      10px 14px;
  }


  body.page-liquidations
  .site-footer p {
    font-size:
      13px;

    line-height:
      1.5;
  }
}

@media (max-width: 420px) {

  body.page-liquidations
  .kpi {
    grid-template-columns:
      1fr;
  }


  body.page-liquidations
  .tape-row {
    grid-template-columns:
      1fr;
  }


  body.page-liquidations
  .card-title {
    font-size:
      15px;
  }


  body.page-liquidations
  .tag,
  body.page-liquidations
  .dropdown select {
    font-size:
      12px;

    padding:
      6px 8px;
  }
}

.page-news .news-page-shell {
  width: min(1240px, calc(100% - 32px));
  margin: 30px auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 30px;
  align-items: start;
}

.page-news .news-main-column {
  min-width: 0;
}

.page-news .news-sidebar {
  min-width: 0;
  display: grid;
  gap: 22px;
}

.page-news .section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.page-news .section-kicker {
  display: block;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  opacity: .7;
  margin-bottom: 4px;
}

.page-news .section-heading h2 {
  margin: 0;
}

.page-news .news-date-filter {
  display: grid;
  gap: 5px;
  font-size: .82rem;
}

.page-news .news-grid {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.page-news .news-card {
  min-width: 0;
  overflow: hidden;
  border-radius: 14px;
}

.page-news .news-card-media {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.page-news .news-card-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.page-news .news-card-body {
  padding: 16px;
}

.page-news .news-card h3 {
  margin: 10px 0;
  overflow-wrap: anywhere;
}

.page-news .news-card p {
  overflow-wrap: anywhere;
}

.page-news .news-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.page-news .badge.featured {
  font-weight: 700;
}

.page-news .trending-news-section {
  margin-top: 45px;
}

.page-news .trending-news-grid {
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
}

.page-news .trending-news-grid .news-card-body {
  padding: 12px;
}

.page-news .trending-news-grid .news-card h3 {
  font-size: 1rem;
}

.page-news .widget {
  border-radius: 14px;
  padding: 18px;
  overflow: hidden;
}

.page-news .widget h3 {
  margin-top: 0;
}

.page-news .trending-coins-list {
  display: grid;
  gap: 8px;
}

.page-news .trending-coin-row {
  display: grid;
  grid-template-columns: 28px 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  padding: 9px 0;
  text-decoration: none;
}

.page-news .trending-coin-row img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.page-news .trend-coin-name {
  min-width: 0;
  font-weight: 600;
}

.page-news .trend-coin-name small {
  display: block;
  opacity: .65;
}

.page-news .market-snapshot {
  display: grid;
  gap: 10px;
}

.page-news .market-stat {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.page-news .market-stat span {
  opacity: .7;
}

.page-news .pager {
  margin: 28px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.ad-slot {
  width: 100%;
  margin: 22px auto;
  padding: 0;
  overflow: hidden;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.ad-sponsored-label {
  font-size: .72rem;
  opacity: .6;
  margin-bottom: 6px;
}

.news-ad-link {
  width: 100%;
  display: block;
  overflow: hidden;
}

.news-ad-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ad-billboard {
  width: min(970px, calc(100% - 30px));
  max-height: 280px;
}

.ad-leaderboard {
  width: min(728px, calc(100% - 30px));
  max-height: 120px;
}

.ad-rectangle {
  width: 300px;
  max-width: 100%;
  max-height: 280px;
}

.ad-skyscraper {
  width: 300px;
  max-width: 100%;
  max-height: 630px;
}

.page-news .headline-wrap {
  width: min(1240px, calc(100% - 32px));
  margin: 26px auto;
}

.page-news .headline-slider {
  overflow: hidden;
  border-radius: 16px;
}

.page-news .slide {
  display: none;
  position: relative;
  min-height: 380px;
  overflow: hidden;
}

.page-news .slide.active {
  display: block;
}

.page-news .slide > img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}

.page-news .slide-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 28px;
}

.page-news .slide-caption h2 {
  max-width: 850px;
  overflow-wrap: anywhere;
}

.page-news .slide-caption p {
  max-width: 800px;
}

.page-news .slider-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 10px;
}

@media (max-width: 950px) {
  .page-news .news-page-shell {
    grid-template-columns: 1fr;
  }

  .page-news .news-sidebar {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .page-news .ad-skyscraper,
  .page-news .ad-rectangle {
    justify-self: center;
  }

  .page-news .trending-news-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .page-news .news-grid,
  .page-news .trending-news-grid,
  .page-news .news-sidebar {
    grid-template-columns: 1fr;
  }

  .page-news .section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .page-news .slide {
    min-height: 330px;
  }

  .page-news .slide > img {
    height: 350px;
  }

  .page-news .slide-caption {
    padding: 18px;
  }

  .page-news .categories {
    overflow-x: auto;
    justify-content: flex-start;
    flex-wrap: nowrap;
  }

  .page-news .categories button {
    white-space: nowrap;
  }
}

body.page-index .notif-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

body.page-index .notif-bell {
  position: relative;
  width: 42px;
  height: 42px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 50%;

  background: rgba(255,255,255,0.04);
  color: #fff;

  cursor: pointer;
  transition: 0.2s ease;
}

body.page-index .notif-bell:hover {
  background: rgba(255,255,255,0.09);
}

body.page-index .notif-bell-icon {
  font-size: 20px;
  line-height: 1;
}

body.page-index .notif-count {
  position: absolute;

  top: -6px;
  right: -7px;

  min-width: 19px;
  height: 19px;

  padding: 0 5px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 2px solid #0b0e11;
  border-radius: 999px;

  background: #f6465d;
  color: #fff;

  font-size: 11px;
  font-weight: 700;

  line-height: 1;
}

body.page-index .notif-dropdown {
  position: absolute;

  top: calc(100% + 12px);
  right: 0;

  width: 390px;
  max-width: calc(100vw - 24px);

  background: #181a20;

  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;

  box-shadow:
    0 18px 50px
    rgba(0,0,0,0.45);

  overflow: hidden;

  z-index: 10050;
}

body.page-index .notif-header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 16px 18px;

  border-bottom:
    1px solid rgba(255,255,255,0.08);
}

body.page-index .notif-header strong {
  color: #fff;
  font-size: 17px;
}

body.page-index .notif-close {
  border: 0;
  background: transparent;

  color: #848e9c;

  font-size: 25px;
  line-height: 1;

  cursor: pointer;
}

body.page-index .notif-close:hover {
  color: #fff;
}

body.page-index .notif-list {
  max-height: 420px;
  overflow-y: auto;
}

body.page-index .notif-item {
  width: 100%;

  display: flex;
  gap: 10px;

  padding: 14px 16px;

  border: 0;
  border-bottom:
    1px solid rgba(255,255,255,0.06);

  background: transparent;

  color: inherit;

  text-align: left;

  cursor: pointer;
}

body.page-index .notif-item:hover {
  background: rgba(255,255,255,0.04);
}

body.page-index .notif-item.unread {
  background: rgba(246, 70, 93, 0.05);
}

body.page-index .notif-dot {
  width: 7px;
  height: 7px;

  margin-top: 7px;

  border-radius: 50%;

  background: transparent;

  flex: 0 0 auto;
}

body.page-index .notif-item.unread .notif-dot {
  background: #f6465d;
}

body.page-index .notif-item-body {
  min-width: 0;

  display: flex;
  flex-direction: column;

  flex: 1;
}

body.page-index .notif-title {
  color: #f0f1f2;

  font-size: 14px;
  font-weight: 700;

  line-height: 1.4;
}

body.page-index .notif-message {
  display: -webkit-box;

  margin-top: 4px;

  overflow: hidden;

  color: #b7bdc6;

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

  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

body.page-index .notif-meta {
  margin-top: 6px;

  color: #707a8a;

  font-size: 11px;
}

body.page-index .notif-empty {
  padding: 35px 20px;

  color: #848e9c;

  text-align: center;
  font-size: 13px;
}

body.page-index .notif-view-all {
  width: 100%;

  padding: 13px 16px;

  border: 0;
  border-top:
    1px solid rgba(255,255,255,0.08);

  background: transparent;

  color: #f0b90b;

  font-size: 13px;
  font-weight: 600;

  cursor: pointer;
}

body.page-index .notif-view-all:hover {
  background: rgba(255,255,255,0.04);
}

body.page-index .notif-detail {
  padding: 18px;
}

body.page-index .notif-back {
  margin-bottom: 18px;

  padding: 0;

  border: 0;
  background: transparent;

  color: #f0b90b;

  cursor: pointer;

  font-size: 13px;
}

body.page-index .notif-detail h4 {
  margin: 0 0 12px;

  color: #fff;

  font-size: 17px;
  line-height: 1.4;
}

body.page-index .notif-detail p {
  margin: 0;

  color: #b7bdc6;

  font-size: 14px;
  line-height: 1.65;

  white-space: pre-wrap;
  word-break: break-word;
}

body.page-index .notif-detail-meta {
  margin-top: 18px;

  color: #707a8a;

  font-size: 12px;
}

@media (max-width: 768px) {

  body.page-index .notif-dropdown {
    position: fixed;

    top: 70px;
    left: 12px;
    right: 12px;

    width: auto;

    max-width: none;

    max-height:
      calc(100vh - 90px);
  }

  body.page-index .notif-list {
    max-height:
      calc(100vh - 220px);
  }
}

.password-input-wrap {
    position: relative;
    width: 100%;
}

.password-input-wrap input[type="password"]::-ms-reveal,
.password-input-wrap input[type="password"]::-ms-clear {
    display: none !important;
}

.password-input-wrap input {
    width: 100%;
    padding-right: 52px !important;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    border-radius: 8px;
    z-index: 5;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
}

.password-toggle:hover {
    background: rgba(128, 128, 128, 0.12);
}

.password-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.password-toggle:active {
    transform: translateY(-50%) scale(0.94);
}

.password-toggle svg {
    width: 21px;
    height: 21px;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;

    pointer-events: none;
}

.password-toggle .eye-closed {
    display: none;
}

.password-toggle.is-visible .eye-open {
    display: none;
}

.password-toggle.is-visible .eye-closed {
    display: block;
}

@media (max-width: 480px) {

    .password-toggle {
        right: 7px;

        width: 40px;
        height: 40px;
    }

    .password-input-wrap input {
        padding-right: 52px !important;
    }
}