/* ANDRA2 v2 — visual override for Metin2CMS */
:root{
  --a-bg:#07090d;
  --a-panel:rgba(10,13,19,.86);
  --a-panel-2:rgba(16,20,28,.92);
  --a-line:rgba(204,169,104,.20);
  --a-gold:#d5b574;
  --a-gold-2:#f0d699;
  --a-text:#eef2f7;
  --a-muted:#99a3b2;
  --a-blue:#79a9ff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#07090d!important;color:var(--a-text)!important;overflow-x:hidden}

/* HERO */
.make-header{height:820px!important;min-width:0!important;background:#05070b!important;border-bottom:1px solid var(--a-line)!important}
.make-header:after{content:"";position:absolute;inset:auto 0 0;height:260px;z-index:3;pointer-events:none;background:linear-gradient(to bottom,transparent,#07090d 92%)}
.andra-hero{position:absolute;inset:0;overflow:hidden}
.andra-hero-bg{position:absolute;inset:0;z-index:0;background:url(../img/theme/header-bg.png) center center/cover no-repeat;}
.andra-hero-shade{position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 42%,rgba(4,7,13,.05) 0,rgba(4,7,13,.24) 38%,rgba(4,7,13,.76) 82%),linear-gradient(90deg,rgba(4,6,10,.62),rgba(4,6,10,.08) 50%,rgba(4,6,10,.62))}
.andra-hero-content{position:relative;z-index:4;width:min(1180px,calc(100% - 48px));height:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-top:74px}
.andra-kicker{font-size:11px;font-weight:700;letter-spacing:.34em;color:#c6d6ed;text-shadow:0 2px 16px #000;margin-bottom:16px}
.andra-hero-logo{width:min(330px,64vw);height:auto;filter:drop-shadow(0 12px 22px rgba(0,0,0,.8));margin-bottom:10px}
.andra-hero h1{font-family:"Cinzel Decorative",serif!important;font-size:clamp(30px,4vw,54px)!important;line-height:1.12;color:#fff!important;font-weight:700!important;letter-spacing:.02em;text-shadow:0 4px 28px rgba(0,0,0,.9);margin:0 0 13px!important}
.andra-hero p{font-size:15px;line-height:1.8;color:#cbd2dc;max-width:620px;text-shadow:0 2px 12px rgba(0,0,0,.85);margin:0 0 30px}
.andra-hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.andra-btn{width:220px;min-height:64px;padding:10px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:4px;transition:.25s;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.08em;text-decoration:none!important}
.andra-btn span{font-family:"Cinzel Decorative",serif;font-size:13px;font-weight:700;position:relative;z-index:2}
.andra-btn small{font-family:"Inter",sans-serif;font-size:9px;letter-spacing:.11em;margin-top:4px;opacity:.7;position:relative;z-index:2}
.andra-btn-primary{color:#17130c!important;background:linear-gradient(180deg,#f0d699,#bd9350);border:1px solid #f5dfac;box-shadow:0 10px 34px rgba(180,131,62,.25),inset 0 1px rgba(255,255,255,.5)}
.andra-btn-primary:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45),transparent 70%);transform:translateX(-120%);transition:.6s}
.andra-btn-primary:hover{transform:translateY(-3px);filter:brightness(1.08);box-shadow:0 14px 42px rgba(180,131,62,.38)}
.andra-btn-primary:hover:before{transform:translateX(120%)}
.andra-btn-secondary{color:#e9eef6!important;background:rgba(10,14,20,.72);border:1px solid rgba(207,221,241,.24);backdrop-filter:blur(10px)}
.andra-btn-secondary:hover{transform:translateY(-3px);border-color:rgba(121,169,255,.55);background:rgba(21,29,42,.88)}
.andra-hero-links{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:11px;color:#aab4c1;text-transform:uppercase;letter-spacing:.08em}
.andra-hero-links a{color:#d4dbe5!important;padding-left:12px;border-left:1px solid rgba(255,255,255,.14)}
.andra-status-dot{width:7px;height:7px;border-radius:50%;background:#67dd8b;box-shadow:0 0 12px rgba(103,221,139,.8)}
.andra-scroll-hint{position:absolute;z-index:4;left:50%;bottom:34px;transform:translateX(-50%);font-size:9px;text-transform:uppercase;letter-spacing:.22em;color:#87909c;display:flex;flex-direction:column;align-items:center;gap:8px}
.andra-scroll-hint span{width:1px;height:22px;background:linear-gradient(#d5b574,transparent)}

/* NAV */
.make-header .make-container{position:relative;z-index:10;width:min(1260px,100%)!important;margin:0 auto}
.make-header .make-nav{position:absolute!important;top:0;left:50%;transform:translateX(-50%);width:min(1260px,calc(100vw - 40px));height:86px!important;min-height:86px!important;margin-top:0!important;background:linear-gradient(to bottom,rgba(4,6,10,.82),rgba(4,6,10,.2))!important;border-bottom:1px solid rgba(255,255,255,.08)!important;backdrop-filter:blur(5px)}
.make-header .make-nav:before{display:none!important}
.make-header .make-nav>.logo-head{top:0!important;width:145px!important;min-width:145px!important;margin:10px 42px auto!important}
.make-header .make-nav>.logo-head img{max-width:145px;height:auto}
.make-header .make-nav ul{width:auto!important;min-width:0!important;max-width:none!important;flex:1;height:86px!important;gap:34px}
.make-header .make-nav ul.l-menu,.make-header .make-nav ul.r-menu{margin:0!important}
.make-header .make-nav ul.l-menu{justify-content:flex-end!important}
.make-header .make-nav ul.r-menu{justify-content:flex-start!important}
.make-header .make-nav ul li{margin:0!important;font-size:11px!important;letter-spacing:.14em!important;color:#c5ccd6!important}
.make-header .make-nav ul li:hover,.make-header .make-nav ul li.active{color:#fff!important;text-shadow:0 0 18px rgba(121,169,255,.45)!important}
.make-header .make-nav ul li:after{background:linear-gradient(90deg,transparent,var(--a-gold),transparent)!important;height:1px!important;bottom:-13px!important}

/* MAIN LAYOUT */
.make-body{min-width:0!important;background:radial-gradient(circle at 50% 0,rgba(58,78,112,.10),transparent 34%),linear-gradient(#07090d,#090d13 45%,#06080b)!important;background-size:cover!important;padding:0 18px 70px!important}
.make-body .make-container{width:min(1320px,100%)!important;gap:18px}
.make-body .make-container.main{align-items:flex-start}
.make-body .make-container .left-col,.make-body .make-container .right-col{width:300px!important;min-width:300px!important;max-width:300px!important;left:auto!important;right:auto!important;margin-top:54px!important}
.make-body .make-container .center-col{width:auto!important;min-width:0!important;max-width:none!important;flex:1;margin-top:54px!important}

/* PANELS */
.make-body .make-container .box-sm-v1{margin-bottom:18px}
.make-body .make-container .box-sm-v1 .heading{height:54px!important;margin:0!important;padding:0 20px!important;background:linear-gradient(90deg,rgba(213,181,116,.12),rgba(18,23,31,.88))!important;border:1px solid var(--a-line)!important;border-bottom:none!important;border-radius:8px 8px 0 0!important}
.make-body .make-container .box-sm-v1 .heading h2{font-size:13px!important;color:var(--a-gold-2)!important;letter-spacing:.10em!important;text-shadow:none!important}
.make-body .make-container .box-sm-v1 .heading>div>.p-w-l{color:#aab4c0!important;font-size:10px}
.make-body .make-container .box-sm-v1 .inner.login-box,.make-body .make-container .box-sm-v1 .inner.rank,.make-body .make-container .box-sm-v1 .inner.stats-box{border-radius:0 0 8px 8px!important;border:1px solid var(--a-line)!important;background:linear-gradient(180deg,rgba(13,17,24,.94),rgba(7,10,15,.97))!important;box-shadow:0 16px 40px rgba(0,0,0,.28)!important;backdrop-filter:blur(8px)}
.make-body .make-container .box-sm-v1 .inner.login-box form{padding:22px!important}
.make-body .make-container .box-sm-v1 .inner.login-box form>label.password,.make-body .make-container .box-sm-v1 .inner.login-box form>label.username{width:100%!important;height:44px!important;border-radius:5px!important;border-color:rgba(255,255,255,.08)!important;background:#0d1219!important}
.make-body .make-container .box-sm-v1 .inner.login-box form button{width:100%!important;height:44px!important;border-radius:4px!important;margin-top:14px!important;background:linear-gradient(180deg,#d4b373,#a47c3e)!important;border:1px solid #e2c58a!important}
.make-body .make-container .box-sm-v1 .inner.login-box form button b{color:#16120b!important}
.make-body .make-container .box-sm-v1 .inner.login-box .login-add{padding:0 22px 22px!important;color:#8f99a7!important}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane,.user-menu{width:calc(100% - 16px)!important;height:42px!important;margin:4px 8px!important;border-radius:4px!important;background:rgba(255,255,255,.018)!important}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:hover,.user-menu:hover{background:rgba(213,181,116,.09)!important;transform:translateX(3px)!important}
.make-body .make-container .box-sm-v1 .inner.rank .p-thead{padding:0 12px!important;background:rgba(255,255,255,.025)!important;border-bottom:1px solid rgba(255,255,255,.05)}
.make-body .make-container .box-sm-v1 .inner.stats-box{height:auto!important;min-height:190px;padding:12px 0;margin-bottom:0!important}
.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat{width:100%!important;margin:0!important;padding:0 18px;height:38px!important;border-bottom:1px solid rgba(255,255,255,.04)}
.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat .text{margin-left:0!important;width:100%;display:flex;align-items:center;justify-content:space-between}
.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat .text strong{font-size:13px!important;color:#fff!important}

/* CENTER */
.center-col .banner-main{padding:0!important;margin-bottom:18px!important;border:1px solid var(--a-line);border-radius:8px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.30)}
.center-col .banner-main .slider,.center-col .banner-main .slider-wrapper{border-radius:8px;overflow:hidden}
.center-col .banner-main img{display:block;width:100%!important;height:290px!important;object-fit:cover}
.vk-news-section,.center-col .newsfeed{margin-top:0!important;background:linear-gradient(180deg,rgba(13,17,24,.94),rgba(7,10,15,.97))!important;border:1px solid var(--a-line)!important;border-radius:8px!important;box-shadow:0 18px 50px rgba(0,0,0,.32)!important;padding:22px!important}
.vk-post{padding:0 0 22px!important;margin:0 0 22px!important;border-bottom:1px solid rgba(255,255,255,.07)!important;background:transparent!important}
.vk-post:last-child{border-bottom:0!important;margin-bottom:0!important}
.vk-post-text{font-size:13px!important;line-height:1.75!important;color:#cbd3dd!important}
.vk-news-img{width:100%!important;max-height:440px;object-fit:cover;border-radius:6px!important;margin-top:15px;box-shadow:0 12px 34px rgba(0,0,0,.32)}
.vk-post-date{margin-top:12px!important;color:#798493!important;font-size:10px!important;text-transform:uppercase;letter-spacing:.08em}

/* FOOTER */
.make-footer{background:#05070a!important;border-top:1px solid var(--a-line)!important}
.make-footer .make-container{width:min(1260px,calc(100% - 36px))!important}

/* RESPONSIVE */
@media (max-width:1100px){
  .make-header .make-nav{width:calc(100% - 24px);padding:0 12px}
  .make-header .make-nav>.logo-head{margin:10px 20px auto!important}
  .make-header .make-nav ul{gap:16px}
  .make-body .make-container.main{display:grid!important;grid-template-columns:280px 1fr!important}
  .make-body .make-container .left-col,.make-body .make-container .right-col{width:280px!important;min-width:280px!important;max-width:280px!important}
  .make-body .make-container .center-col{grid-column:2;grid-row:1 / span 2}
  .make-body .make-container .right-col{grid-column:1;grid-row:2;margin-top:0!important}
}
@media (max-width:780px){
  .make-header{height:740px!important}
  .make-header .make-nav{height:auto!important;min-height:70px!important;justify-content:center;overflow-x:auto;padding:0 12px}
  .make-header .make-nav>.logo-head{position:absolute!important;left:50%;transform:translateX(-50%);margin:5px 0!important;width:110px!important;min-width:110px!important;z-index:20}
  .make-header .make-nav>.logo-head img{max-width:110px}
  .make-header .make-nav ul{height:70px!important;gap:14px;min-width:max-content!important}
  .make-header .make-nav ul li{font-size:9px!important}
  .make-header .make-nav ul.l-menu{padding-right:70px}
  .make-header .make-nav ul.r-menu{padding-left:70px}
  .andra-hero-content{width:calc(100% - 28px);padding-top:80px}
  .andra-kicker{font-size:9px;letter-spacing:.18em}
  .andra-hero p{font-size:13px;max-width:460px}
  .andra-btn{width:min(280px,100%)}
  .andra-hero-actions{width:100%;flex-direction:column;align-items:center}
  .andra-hero-links{flex-wrap:wrap;justify-content:center}
  .make-body{padding-left:10px!important;padding-right:10px!important}
  .make-body .make-container.main{display:flex!important;flex-direction:column!important}
  .make-body .make-container .left-col,.make-body .make-container .center-col,.make-body .make-container .right-col{width:100%!important;min-width:0!important;max-width:none!important;margin-top:18px!important}
  .make-body .make-container .center-col{order:1}
  .make-body .make-container .left-col{order:2}
  .make-body .make-container .right-col{order:3}
  .center-col .banner-main img{height:210px!important}
}
@media (max-width:520px){
  .make-header .make-nav ul li:nth-child(n+3){display:none}
  .andra-hero h1{font-size:28px!important}
  .andra-hero-logo{width:230px}
  .center-col .banner-main img{height:170px!important}
  .vk-news-section,.center-col .newsfeed{padding:14px!important}
}

/* ==========================================================
   ANDRA2 CYBER NEWS — game portal / cyber-fantasy treatment
   ========================================================== */
.cyber-news{
  --cy:#68e7ff;
  --cy2:#3c86ff;
  --vio:#9b74ff;
  --hot:#ff4f96;
  --ink:#071019;
  --panel:rgba(7,13,22,.92);
  position:relative;
  margin-top:18px;
  padding:24px;
  overflow:hidden;
  background:
    linear-gradient(rgba(104,231,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(104,231,255,.028) 1px,transparent 1px),
    radial-gradient(circle at 15% 0,rgba(54,130,255,.12),transparent 34%),
    linear-gradient(180deg,rgba(8,16,27,.97),rgba(5,9,16,.98));
  background-size:28px 28px,28px 28px,auto,auto;
  border:1px solid rgba(104,231,255,.16);
  box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.025);
  clip-path:polygon(0 18px,18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.cyber-news:before{
  content:"";
  position:absolute;
  top:0;left:0;
  width:160px;height:2px;
  background:linear-gradient(90deg,var(--cy),transparent);
  box-shadow:0 0 18px rgba(104,231,255,.6);
}
.cyber-news:after{
  content:"ANDRA2 // NETWORK";
  position:absolute;
  right:16px;bottom:8px;
  font-size:8px;
  letter-spacing:.25em;
  color:rgba(104,231,255,.16);
  pointer-events:none;
}
.cyber-news-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(104,231,255,.10)}
.cyber-news-kicker{display:block;margin-bottom:6px;color:var(--cy);font-size:9px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;text-shadow:0 0 12px rgba(104,231,255,.4)}
.cyber-news-head h2{margin:0!important;color:#f7fbff!important;font-family:"Cinzel Decorative",serif!important;font-size:25px!important;line-height:1.15;letter-spacing:.025em;text-shadow:0 0 24px rgba(72,138,255,.14)}
.cyber-news-live{display:flex;align-items:center;gap:8px;color:#94a8bc;font-size:9px;font-weight:800;letter-spacing:.18em}
.cyber-news-live i{width:6px;height:6px;border-radius:50%;background:#63ffad;box-shadow:0 0 0 4px rgba(99,255,173,.08),0 0 12px rgba(99,255,173,.8);animation:cyPulse 1.8s infinite}
@keyframes cyPulse{50%{opacity:.45;box-shadow:0 0 0 7px rgba(99,255,173,0),0 0 5px rgba(99,255,173,.3)}}
.cyber-news-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cyber-news-card{position:relative;min-width:0;overflow:hidden;background:linear-gradient(145deg,rgba(11,20,32,.96),rgba(5,10,18,.98));border:1px solid rgba(104,231,255,.10);clip-path:polygon(0 13px,13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%);transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.cyber-news-card:hover{transform:translateY(-4px);border-color:rgba(104,231,255,.32);box-shadow:0 18px 42px rgba(0,0,0,.38),0 0 26px rgba(60,134,255,.07)}
.cyber-news-card.is-featured{grid-column:1/-1;display:grid;grid-template-columns:minmax(260px,42%) 1fr;min-height:300px;border-color:rgba(104,231,255,.22);background:linear-gradient(115deg,rgba(12,24,39,.98),rgba(7,12,22,.98))}
.cyber-cut{position:absolute;z-index:8;pointer-events:none}
.cyber-cut-a{right:0;top:0;width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--cy))}
.cyber-cut-b{left:0;bottom:0;width:75px;height:1px;background:linear-gradient(90deg,var(--vio),transparent)}
.cyber-news-media{position:relative;min-height:165px;overflow:hidden;background:#050910}
.cyber-news-card.is-featured .cyber-news-media{min-height:300px}
.cyber-news-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(5,10,17,.85)),linear-gradient(90deg,rgba(30,91,167,.09),transparent 40%);pointer-events:none}
.cyber-news-media img{display:block;width:100%;height:100%;min-height:165px;max-height:230px;object-fit:cover;filter:saturate(.92) contrast(1.05);transition:transform .45s ease,filter .45s ease}
.cyber-news-card.is-featured .cyber-news-media img{min-height:300px;max-height:360px}
.cyber-news-card:hover .cyber-news-media img{transform:scale(1.035);filter:saturate(1.06) contrast(1.08)}
.cyber-news-scan{position:absolute;z-index:3;inset:0;opacity:.22;background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,rgba(126,229,255,.07) 4px);mix-blend-mode:screen;pointer-events:none}
.cyber-news-content{position:relative;padding:18px 18px 16px;display:flex;flex-direction:column;min-width:0}
.cyber-news-card.is-featured .cyber-news-content{padding:28px 28px 22px;justify-content:center}
.cyber-news-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.cyber-news-tag{padding:5px 8px 4px;border:1px solid rgba(104,231,255,.26);background:rgba(63,135,255,.07);color:var(--cy);font-size:8px;font-weight:800;letter-spacing:.15em;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px))}
.cyber-news-meta time{display:flex;align-items:center;gap:7px;color:#74879a;font-size:9px;letter-spacing:.08em}
.cyber-news-meta time b{font-weight:700;color:#9cb1c4}
.cyber-news-card h3{margin:0 0 12px!important;color:#f4f8fd!important;font-family:"Inter",sans-serif!important;font-size:17px!important;line-height:1.35;font-weight:800!important;letter-spacing:.01em;text-transform:none!important}
.cyber-news-card.is-featured h3{font-size:24px!important;line-height:1.25}
.cyber-news-text{position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;color:#9dacbc;font-size:12px;line-height:1.75}
.cyber-news-card.is-featured .cyber-news-text{-webkit-line-clamp:6;font-size:13px;color:#acbac8}
.cyber-news-foot{margin-top:auto;padding-top:16px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid rgba(255,255,255,.045)}
.cyber-news-id{color:#4d6072;font-size:8px;letter-spacing:.18em}
.cyber-news-arrow{color:#bcd0e3;font-size:8px;font-weight:800;letter-spacing:.14em;transition:color .2s,text-shadow .2s}
.cyber-news-arrow b{margin-left:5px;color:var(--cy);font-size:12px}
.cyber-news-card:hover .cyber-news-arrow{color:#fff;text-shadow:0 0 12px rgba(104,231,255,.28)}
@media(max-width:900px){.cyber-news-grid{grid-template-columns:1fr}.cyber-news-card.is-featured{grid-template-columns:1fr}.cyber-news-card.is-featured .cyber-news-media,.cyber-news-card.is-featured .cyber-news-media img{min-height:220px;max-height:320px}.cyber-news-card.is-featured .cyber-news-content{padding:20px}}
@media(max-width:520px){.cyber-news{padding:16px;clip-path:none}.cyber-news-head h2{font-size:20px!important}.cyber-news-card{clip-path:none}.cyber-news-card.is-featured h3{font-size:19px!important}.cyber-news-live{display:none}}


/* ============================================================
   ANDRA2 V4 — WIDE DESKTOP FIX
   Main desktop target: 1920px. Keeps content wide instead of
   forcing the whole portal into a narrow centered 1260/1320 box.
   ============================================================ */

@media (min-width: 1281px) {
  html, body { width: 100%; }

  .make-header,
  .make-body {
    min-width: 0 !important;
    width: 100% !important;
  }

  .make-header .make-container,
  .make-body .make-container,
  .make-footer .make-container {
    width: calc(100% - 64px) !important;
    max-width: 1720px !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .make-header .make-nav {
    width: 100% !important;
    max-width: none !important;
  }

  .make-header .make-nav ul {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: 1 1 0 !important;
  }

  .make-header .make-nav ul.l-menu { justify-content: flex-end !important; }
  .make-header .make-nav ul.r-menu { justify-content: flex-start !important; }
  .make-header .make-nav ul li { margin-left: 28px !important; margin-right: 28px !important; }

  .make-body .make-container.main {
    display: grid !important;
    grid-template-columns: 300px minmax(0, 1fr) 300px !important;
    gap: 22px !important;
    align-items: start !important;
  }

  .make-body .make-container .left-col,
  .make-body .make-container .right-col {
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    margin-top: 54px !important;
    left: auto !important;
    right: auto !important;
  }

  .make-body .make-container .center-col {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-top: 54px !important;
  }

  .center-col .banner-main,
  .cyber-news,
  .center-col .newsfeed {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .center-col .banner-main img {
    width: 100% !important;
    height: clamp(300px, 21vw, 410px) !important;
  }
}

@media (min-width: 1600px) {
  .make-header .make-container,
  .make-body .make-container,
  .make-footer .make-container {
    width: calc(100% - 80px) !important;
    max-width: 1760px !important;
  }

  .make-body .make-container.main {
    grid-template-columns: 320px minmax(0, 1fr) 320px !important;
    gap: 26px !important;
  }

  .make-body .make-container .left-col,
  .make-body .make-container .right-col {
    width: 320px !important;
    min-width: 320px !important;
    max-width: 320px !important;
  }
}

.cyber-news-card h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.cyber-news-card.is-featured h3 { -webkit-line-clamp: 3; }

.cyber-news-empty {
  grid-column: 1 / -1;
  min-height: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 30px;
  border: 1px dashed rgba(104,231,255,.18);
  background: linear-gradient(145deg,rgba(11,20,32,.72),rgba(5,10,18,.82));
  color: #91a4b7;
  text-align: center;
}

.cyber-news-empty strong {
  color: #eaf7ff;
  font-size: 14px;
  letter-spacing: .06em;
}

.cyber-news-empty span { font-size: 11px; }

/* ============================================================
   ANDRA2 V5 — HEADER / FOOTER GEOMETRY FIX
   Wide layout applies ONLY to the main content area.
   Header navigation and footer return to a stable centered width.
   ============================================================ */

@media (min-width: 1281px) {
  /* Keep the top navigation compact and predictable. */
  .make-header .make-container {
    width: 1260px !important;
    max-width: calc(100% - 64px) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .make-header .make-nav {
    width: 1260px !important;
    max-width: calc(100vw - 64px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  .make-header .make-nav ul {
    flex: 0 1 515px !important;
    width: 515px !important;
    min-width: 0 !important;
    max-width: 515px !important;
    gap: 0 !important;
  }

  .make-header .make-nav ul.l-menu {
    justify-content: flex-end !important;
    margin-right: 0 !important;
  }

  .make-header .make-nav ul.r-menu {
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  .make-header .make-nav ul li {
    margin-left: 34px !important;
    margin-right: 34px !important;
    white-space: nowrap !important;
  }

  .make-header .make-nav > .logo-head {
    flex: 0 0 145px !important;
    margin-left: 28px !important;
    margin-right: 28px !important;
  }

  /* Footer must not inherit the wide portal content width. */
  .make-footer .make-container {
    width: 1260px !important;
    max-width: calc(100% - 64px) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .make-footer .foot-menu {
    margin-top: 55px !important;
    margin-bottom: 55px !important;
    width: 100% !important;
  }

  .make-footer .foot-menu ul {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 18px !important;
  }

  .make-footer .foot-menu ul li {
    margin: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  .make-footer .foot-menu .logo-head {
    margin: 0 !important;
    justify-self: center !important;
  }

  .make-footer .foot-menu .logo-head img {
    display: block !important;
    max-width: 145px !important;
    height: auto !important;
  }

  .make-footer .foot-foot {
    width: 100% !important;
    align-items: center !important;
  }
}

@media (min-width: 1600px) {
  /* Explicitly keep header/footer stable even on 2K/4K displays. */
  .make-header .make-container,
  .make-footer .make-container {
    width: 1260px !important;
    max-width: calc(100% - 80px) !important;
  }

  .make-header .make-nav {
    width: 1260px !important;
    max-width: calc(100vw - 80px) !important;
  }
}

/* ============================================================
   ANDRA2 V6 — WIDE HEADER FINAL FIX
   Desktop 1920px target: header uses the screen properly while
   menu items stay grouped and balanced around the center logo.
   ============================================================ */
@media (min-width: 1281px) {
  .make-header .make-container {
    width: calc(100% - 96px) !important;
    max-width: 1760px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
  }

  .make-header .make-nav {
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 170px minmax(0, 1fr) !important;
    align-items: center !important;
    padding: 0 42px !important;
  }

  .make-header .make-nav ul {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 86px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 18px !important;
    flex: none !important;
  }

  .make-header .make-nav ul.l-menu,
  .make-header .make-nav ul.r-menu {
    margin: 0 !important;
    padding: 0 !important;
  }

  .make-header .make-nav ul.l-menu li {
    text-align: center !important;
  }

  .make-header .make-nav ul.r-menu li {
    text-align: center !important;
  }

  .make-header .make-nav ul li {
    margin: 0 !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  .make-header .make-nav ul li a {
    display: inline-block !important;
  }

  .make-header .make-nav > .logo-head {
    grid-column: 2 !important;
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
    margin: 8px auto 0 !important;
    justify-self: center !important;
    flex: none !important;
  }

  .make-header .make-nav > .logo-head img {
    max-width: 150px !important;
    width: auto !important;
    height: auto !important;
  }
}

@media (min-width: 1600px) {
  .make-header .make-container {
    width: calc(100% - 120px) !important;
    max-width: 1800px !important;
  }

  .make-header .make-nav {
    padding-left: 56px !important;
    padding-right: 56px !important;
  }

  .make-header .make-nav ul {
    gap: 26px !important;
  }
}

.make-header .make-nav {
    top: -100px !important;
}


/* ============================================================
   ANDRA2 V7 — SIDEBAR CYBER-FANTASY UPGRADE
   Append to the END of css/andra2-redesign.css
   ============================================================ */

/* --- shared sidebar card shell --- */
.make-body .make-container .left-col .box-sm-v1,
.make-body .make-container .right-col .box-sm-v1{
    position:relative;
}

.make-body .make-container .left-col .box-sm-v1:before,
.make-body .make-container .right-col .box-sm-v1:before{
    content:"";
    position:absolute;
    inset:-1px;
    pointer-events:none;
    border-radius:12px;
    background:
        linear-gradient(135deg,
            rgba(104,231,255,.16),
            transparent 20%,
            transparent 78%,
            rgba(155,116,255,.10));
    opacity:.75;
    z-index:-1;
}

/* --- section headers --- */
.make-body .make-container .box-sm-v1 .heading{
    position:relative;
    min-height:58px!important;
    height:58px!important;
    padding:0 18px!important;
    overflow:hidden!important;
    background:
        linear-gradient(90deg,rgba(86,135,255,.10),transparent 38%),
        linear-gradient(180deg,#202633 0%,#171d27 100%)!important;
    border:1px solid rgba(128,164,210,.18)!important;
    border-bottom:1px solid rgba(104,231,255,.16)!important;
    border-radius:10px 10px 0 0!important;
    box-shadow:
        inset 0 1px rgba(255,255,255,.025),
        0 8px 24px rgba(0,0,0,.18);
}

.make-body .make-container .box-sm-v1 .heading:before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:82px;
    height:2px;
    background:linear-gradient(90deg,#68e7ff,transparent);
    box-shadow:0 0 14px rgba(104,231,255,.55);
}

.make-body .make-container .box-sm-v1 .heading:after{
    content:"";
    position:absolute;
    right:14px;
    bottom:8px;
    width:34px;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(104,231,255,.28));
    opacity:.65;
}

.make-body .make-container .box-sm-v1 .heading h2{
    font-family:"Cinzel Decorative",serif!important;
    font-size:13px!important;
    line-height:1.25!important;
    letter-spacing:.065em!important;
    color:#f5f7fb!important;
    text-shadow:0 0 18px rgba(104,231,255,.10)!important;
}

.make-body .make-container .box-sm-v1 .heading>div>.p-w-l{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:44px;
    min-height:22px;
    padding:0 8px!important;
    border:1px solid rgba(104,231,255,.14);
    border-radius:999px;
    background:rgba(104,231,255,.04);
    color:#b8c7d8!important;
    font-size:8px!important;
    font-weight:800!important;
    letter-spacing:.08em;
    text-transform:uppercase;
}

/* --- ranking body --- */
.make-body .make-container .box-sm-v1 .inner.rank{
    padding:0 8px 9px!important;
    overflow:hidden;
    border:1px solid rgba(128,164,210,.15)!important;
    border-top:0!important;
    border-radius:0 0 10px 10px!important;
    background:
        linear-gradient(rgba(104,231,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(104,231,255,.018) 1px,transparent 1px),
        linear-gradient(180deg,rgba(10,16,25,.98),rgba(7,11,18,.98))!important;
    background-size:24px 24px,24px 24px,auto!important;
    box-shadow:
        0 18px 45px rgba(0,0,0,.28)!important,
        inset 0 1px rgba(255,255,255,.015)!important;
}

/* table header */
.make-body .make-container .box-sm-v1 .inner.rank .p-thead{
    height:42px!important;
    margin:0 -8px 7px!important;
    padding:0 12px!important;
    background:
        linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))!important;
    border-bottom:1px solid rgba(104,231,255,.08)!important;
}

.make-body .make-container .box-sm-v1 .inner.rank .p-thead>*{
    color:#92a1b2!important;
    font-size:9px!important;
    font-weight:800!important;
    letter-spacing:.04em;
    text-transform:uppercase;
}

/* ranking rows */
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane{
    position:relative;
    width:100%!important;
    height:46px!important;
    margin:5px 0!important;
    padding:0 10px!important;
    border:1px solid rgba(126,154,187,.12)!important;
    border-radius:6px!important;
    background:
        linear-gradient(90deg,rgba(104,231,255,.025),transparent 32%),
        rgba(255,255,255,.025)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.012);
    transition:
        transform .22s ease,
        border-color .22s ease,
        background .22s ease,
        box-shadow .22s ease!important;
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:before{
    content:"";
    position:absolute;
    left:-1px;
    top:9px;
    bottom:9px;
    width:2px;
    border-radius:0 2px 2px 0;
    background:#405166;
    opacity:.35;
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:hover{
    transform:translateX(3px)!important;
    border-color:rgba(104,231,255,.28)!important;
    background:
        linear-gradient(90deg,rgba(104,231,255,.065),transparent 45%),
        rgba(255,255,255,.035)!important;
    box-shadow:
        0 8px 20px rgba(0,0,0,.18),
        inset 0 1px rgba(255,255,255,.02)!important;
}

/* top 3 */
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(1){
    border-color:rgba(255,208,91,.28)!important;
    background:
        linear-gradient(90deg,rgba(255,202,74,.09),transparent 46%),
        rgba(255,255,255,.028)!important;
}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(1):before{
    background:#ffd15e;
    opacity:.95;
    box-shadow:0 0 10px rgba(255,209,94,.6);
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(2){
    border-color:rgba(202,218,236,.20)!important;
    background:
        linear-gradient(90deg,rgba(190,211,232,.07),transparent 46%),
        rgba(255,255,255,.028)!important;
}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(2):before{
    background:#c9d8e7;
    opacity:.8;
    box-shadow:0 0 9px rgba(201,216,231,.36);
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(3){
    border-color:rgba(255,154,89,.20)!important;
    background:
        linear-gradient(90deg,rgba(255,137,76,.07),transparent 46%),
        rgba(255,255,255,.028)!important;
}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(3):before{
    background:#ff9e62;
    opacity:.85;
    box-shadow:0 0 9px rgba(255,158,98,.38);
}

/* columns */
.make-body .make-container .box-sm-v1 .inner.rank .pix-tab .order,
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .order{
    width:40px!important;
    min-width:40px!important;
    padding:0!important;
    color:#93a0b1!important;
    font-size:11px!important;
    font-weight:800!important;
    text-align:center!important;
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .order img{
    display:block;
    width:30px!important;
    height:30px!important;
    object-fit:contain;
    margin:0 auto!important;
    filter:drop-shadow(0 3px 7px rgba(0,0,0,.42));
}

.make-body .make-container .box-sm-v1 .inner.rank .pix-tab .username,
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .username{
    min-width:0;
    padding-left:8px!important;
    color:#f5f7fa!important;
    font-size:11px!important;
    font-weight:800!important;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;
}

.make-body .make-container .box-sm-v1 .inner.rank .pix-tab .kingdom,
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .kingdom{
    width:72px!important;
    min-width:72px!important;
    font-size:9px!important;
    font-weight:800!important;
    text-transform:uppercase;
    letter-spacing:.02em;
}

.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .kingdom.red{
    color:#ff6871!important;
    text-shadow:0 0 10px rgba(255,104,113,.16);
}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .kingdom.blue{
    color:#70b4ff!important;
    text-shadow:0 0 10px rgba(112,180,255,.16);
}
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .kingdom.yellow{
    color:#f0c76f!important;
    text-shadow:0 0 10px rgba(240,199,111,.16);
}

.make-body .make-container .box-sm-v1 .inner.rank .pix-tab .level,
.make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .level{
    width:64px!important;
    min-width:64px!important;
    padding-left:7px;
    color:#dbe6f1!important;
    font-size:10px!important;
    font-weight:900!important;
    text-align:right!important;
    white-space:nowrap;
}

/* --- statistics panel --- */
.make-body .make-container .box-sm-v1 .inner.stats-box{
    position:relative;
    min-height:0!important;
    height:auto!important;
    padding:10px 8px 12px!important;
    border:1px solid rgba(128,164,210,.15)!important;
    border-top:0!important;
    border-radius:0 0 10px 10px!important;
    background:
        radial-gradient(circle at 85% 8%,rgba(104,231,255,.055),transparent 28%),
        linear-gradient(180deg,rgba(10,16,25,.98),rgba(7,11,18,.98))!important;
    box-shadow:
        0 18px 45px rgba(0,0,0,.28)!important,
        inset 0 1px rgba(255,255,255,.015)!important;
}

.make-body .make-container .box-sm-v1 .inner.stats-box:after{
    content:"SERVER // LIVE DATA";
    position:absolute;
    right:12px;
    bottom:7px;
    color:rgba(104,231,255,.11);
    font-size:6px;
    font-weight:900;
    letter-spacing:.22em;
    pointer-events:none;
}

.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat{
    position:relative;
    width:100%!important;
    height:45px!important;
    margin:0 0 6px!important;
    padding:0 12px!important;
    overflow:hidden;
    border:1px solid rgba(126,154,187,.10)!important;
    border-radius:6px;
    background:
        linear-gradient(90deg,rgba(104,231,255,.025),transparent 50%),
        rgba(255,255,255,.02);
    transition:.22s ease;
}

.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat:hover{
    border-color:rgba(104,231,255,.22)!important;
    background:
        linear-gradient(90deg,rgba(104,231,255,.055),transparent 55%),
        rgba(255,255,255,.028);
    transform:translateX(2px);
}

.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat:before{
    content:"";
    position:absolute;
    left:0;
    top:10px;
    bottom:10px;
    width:2px;
    background:#68e7ff;
    opacity:.35;
    box-shadow:0 0 8px rgba(104,231,255,.28);
}

.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat .text{
    width:100%!important;
    height:100%;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:12px;
    color:#a7b4c3!important;
    font-size:9px!important;
    font-weight:700!important;
    line-height:1.15!important;
}

.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat .text strong{
    min-width:46px;
    padding:5px 8px;
    border:1px solid rgba(104,231,255,.12);
    border-radius:999px;
    background:rgba(104,231,255,.035);
    color:#f2f8ff!important;
    font-size:11px!important;
    font-weight:900!important;
    text-align:center;
    box-shadow:inset 0 1px rgba(255,255,255,.018);
}

/* online rows get a green value glow */
.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat:first-child .text strong,
.make-body .make-container .box-sm-v1 .inner.stats-box .lane-stat:last-child .text strong{
    color:#8fffc1!important;
    border-color:rgba(99,255,173,.16)!important;
    background:rgba(99,255,173,.035)!important;
    text-shadow:0 0 10px rgba(99,255,173,.20);
}

/* little spacing polish */
.make-body .make-container .left-col,
.make-body .make-container .right-col{
    filter:drop-shadow(0 14px 28px rgba(0,0,0,.12));
}

/* 320px sidebar comfort */
@media (min-width:1600px){
    .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane{
        height:48px!important;
    }
    .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .username{
        font-size:11px!important;
    }
}

/* tighter on smaller desktop/tablet */
@media (max-width:1280px){
    .make-body .make-container .box-sm-v1 .heading{
        padding:0 14px!important;
    }
    .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane{
        padding:0 8px!important;
    }
    .make-body .make-container .box-sm-v1 .inner.rank .pix-tab .kingdom,
    .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane .kingdom{
        width:62px!important;
        min-width:62px!important;
    }
}


/* ============================================================
   ANDRA2 V8 — FULL RANKING PAGES / CYBER-FANTASY LEADERBOARD
   Append to the END of css/andra2-redesign.css
   ============================================================ */

:root{
    --rank-cyan:#68e7ff;
    --rank-blue:#538dff;
    --rank-violet:#9b74ff;
    --rank-gold:#ffd56a;
    --rank-silver:#d9e4ef;
    --rank-bronze:#ff9f68;
    --rank-line:rgba(112,164,220,.15);
}

/* Main ranking content card */
.center-col .newsfeed:has(.ranking-big),
.center-col .newsfeed:has(table),
.ranking-big{
    position:relative;
}

/* Give the ranking page a HUD surface without touching PHP */
.center-col .newsfeed:has(.ranking-big){
    padding:26px 28px 34px!important;
    overflow:hidden;
    background:
        linear-gradient(rgba(104,231,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(104,231,255,.018) 1px,transparent 1px),
        radial-gradient(circle at 90% 0,rgba(83,141,255,.09),transparent 30%),
        linear-gradient(180deg,rgba(12,18,28,.98),rgba(7,11,18,.99))!important;
    background-size:30px 30px,30px 30px,auto,auto!important;
    border:1px solid rgba(112,164,220,.15)!important;
    border-radius:12px!important;
    box-shadow:0 22px 65px rgba(0,0,0,.34)!important;
}

.center-col .newsfeed:has(.ranking-big):before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:170px;
    height:2px;
    background:linear-gradient(90deg,var(--rank-cyan),transparent);
    box-shadow:0 0 18px rgba(104,231,255,.45);
}

.center-col .newsfeed:has(.ranking-big):after{
    content:"ANDRA2 // LEADERBOARD";
    position:absolute;
    right:20px;
    bottom:12px;
    color:rgba(104,231,255,.10);
    font-size:7px;
    font-weight:900;
    letter-spacing:.22em;
    pointer-events:none;
}

/* Page title */
.center-col .newsfeed h1,
.center-col .newsfeed h2,
.center-col .newsfeed h3{
    color:#f5f8fc;
}

.center-col .newsfeed h4:first-child,
.center-col .newsfeed .title:first-child{
    letter-spacing:.06em;
}

/* Search fields on ranking pages */
.center-col .newsfeed input[type="text"],
.center-col .newsfeed input[type="search"],
.center-col .newsfeed select{
    height:42px!important;
    padding:0 14px!important;
    color:#e8f1fa!important;
    background:
        linear-gradient(180deg,rgba(10,20,31,.96),rgba(7,14,23,.98))!important;
    border:1px solid rgba(104,231,255,.22)!important;
    border-radius:5px!important;
    box-shadow:
        inset 0 1px rgba(255,255,255,.02),
        0 0 0 1px rgba(83,141,255,.025)!important;
    outline:none!important;
    transition:border-color .2s,box-shadow .2s,background .2s;
}

.center-col .newsfeed input[type="text"]:focus,
.center-col .newsfeed input[type="search"]:focus,
.center-col .newsfeed select:focus{
    border-color:rgba(104,231,255,.58)!important;
    box-shadow:
        0 0 0 3px rgba(104,231,255,.055),
        0 0 18px rgba(83,141,255,.10)!important;
    background:#09131e!important;
}

.center-col .newsfeed input::placeholder{
    color:#8292a4!important;
}

/* Search / action buttons */
.center-col .newsfeed button,
.center-col .newsfeed input[type="submit"],
.center-col .newsfeed .btn{
    min-height:42px;
    padding:0 18px!important;
    border:1px solid rgba(104,231,255,.28)!important;
    border-radius:5px!important;
    color:#eef9ff!important;
    background:
        linear-gradient(180deg,rgba(18,105,127,.92),rgba(10,65,84,.96))!important;
    box-shadow:
        inset 0 1px rgba(255,255,255,.08),
        0 8px 20px rgba(0,0,0,.18),
        0 0 14px rgba(104,231,255,.055)!important;
    font-size:11px!important;
    font-weight:800!important;
    transition:.2s ease!important;
}

.center-col .newsfeed button:hover,
.center-col .newsfeed input[type="submit"]:hover,
.center-col .newsfeed .btn:hover{
    transform:translateY(-1px);
    border-color:rgba(104,231,255,.56)!important;
    filter:brightness(1.08);
    box-shadow:
        0 10px 24px rgba(0,0,0,.24),
        0 0 20px rgba(104,231,255,.10)!important;
}

/* Big ranking table */
.center-col .ranking-big{
    margin-top:24px!important;
    width:100%;
    display:flex;
    flex-direction:column;
    gap:6px;
}

/* Every row becomes a leaderboard card */
.center-col .ranking-big .lane{
    position:relative!important;
    min-height:52px!important;
    height:52px!important;
    width:100%!important;
    padding:0 14px!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:hidden;
    border:1px solid rgba(126,154,187,.10);
    border-radius:6px;
    background:
        linear-gradient(90deg,rgba(104,231,255,.018),transparent 42%),
        rgba(255,255,255,.018)!important;
    transition:
        transform .2s ease,
        border-color .2s ease,
        background .2s ease,
        box-shadow .2s ease!important;
}

/* Kill old alternating stripe */
.center-col .ranking-big .lane:nth-child(odd){
    background:
        linear-gradient(90deg,rgba(104,231,255,.018),transparent 42%),
        rgba(255,255,255,.018)!important;
}

.center-col .ranking-big .lane:before{
    content:"";
    position:absolute;
    left:0;
    top:11px;
    bottom:11px;
    width:2px;
    background:#43556b;
    opacity:.34;
}

.center-col .ranking-big .lane:hover{
    transform:translateX(3px);
    border-color:rgba(104,231,255,.28);
    background:
        linear-gradient(90deg,rgba(104,231,255,.06),transparent 48%),
        rgba(255,255,255,.028)!important;
    box-shadow:
        0 9px 24px rgba(0,0,0,.20),
        inset 0 1px rgba(255,255,255,.015);
}

/* Top 3 rows */
.center-col .ranking-big .lane:nth-child(1){
    min-height:60px!important;
    height:60px!important;
    border-color:rgba(255,213,106,.29);
    background:
        linear-gradient(90deg,rgba(255,207,85,.105),transparent 50%),
        rgba(255,255,255,.022)!important;
}
.center-col .ranking-big .lane:nth-child(1):before{
    background:var(--rank-gold);
    opacity:1;
    box-shadow:0 0 12px rgba(255,213,106,.55);
}

.center-col .ranking-big .lane:nth-child(2){
    border-color:rgba(217,228,239,.20);
    background:
        linear-gradient(90deg,rgba(217,228,239,.065),transparent 48%),
        rgba(255,255,255,.02)!important;
}
.center-col .ranking-big .lane:nth-child(2):before{
    background:var(--rank-silver);
    opacity:.85;
    box-shadow:0 0 10px rgba(217,228,239,.30);
}

.center-col .ranking-big .lane:nth-child(3){
    border-color:rgba(255,159,104,.21);
    background:
        linear-gradient(90deg,rgba(255,159,104,.065),transparent 48%),
        rgba(255,255,255,.02)!important;
}
.center-col .ranking-big .lane:nth-child(3):before{
    background:var(--rank-bronze);
    opacity:.88;
    box-shadow:0 0 10px rgba(255,159,104,.32);
}

/* Ranking columns */
.center-col .ranking-big .lane .order{
    width:7%!important;
    min-width:46px;
    padding:0!important;
    color:#8798aa!important;
    font-size:11px!important;
    font-weight:900;
    text-align:center!important;
}

.center-col .ranking-big .lane:nth-child(1) .order{
    color:var(--rank-gold)!important;
    font-size:14px!important;
}
.center-col .ranking-big .lane:nth-child(2) .order{
    color:var(--rank-silver)!important;
}
.center-col .ranking-big .lane:nth-child(3) .order{
    color:var(--rank-bronze)!important;
}

/* Face / empire icon */
.center-col .ranking-big .lane .face{
    width:6%!important;
    min-width:48px!important;
    padding:0!important;
    text-align:center;
}

.center-col .ranking-big .lane .face img{
    width:36px!important;
    height:24px!important;
    object-fit:cover!important;
    border-radius:3px;
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 4px 12px rgba(0,0,0,.30);
}

/* Character / guild name */
.center-col .ranking-big .lane .name{
    width:34%!important;
    min-width:0;
    padding-left:10px;
    color:#f4f7fb!important;
    font-size:12px!important;
    font-weight:850!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

/* Guild / extra column */
.center-col .ranking-big .lane .guild{
    width:36%!important;
    min-width:0;
    color:#9eacbb!important;
    font-size:11px!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

/* Level */
.center-col .ranking-big .lane .level{
    margin-left:auto;
    width:14%!important;
    min-width:78px;
    color:#dce7f2!important;
    font-size:10px!important;
    font-weight:800;
    text-align:right;
    white-space:nowrap;
}

.center-col .ranking-big .lane .level b{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:52px;
    height:26px;
    padding:0 8px;
    border:1px solid rgba(104,231,255,.14);
    border-radius:999px;
    background:rgba(104,231,255,.035);
    color:#eaf7ff!important;
    font-weight:900!important;
}

/* Empire color polish */
.center-col .ranking-big .lane .name span.red{
    color:#ff6c75!important;
}
.center-col .ranking-big .lane .name span.yellow{
    color:#f3c85f!important;
}
.center-col .ranking-big .lane .name span.blue{
    color:#6db2ff!important;
}

/* Generic Bootstrap table fallback — covers ranking pages that don't use .ranking-big */
.center-col .newsfeed table{
    width:100%!important;
    margin-top:16px!important;
    border-collapse:separate!important;
    border-spacing:0 6px!important;
    background:transparent!important;
    color:#dce5ef!important;
}

.center-col .newsfeed table thead tr{
    background:linear-gradient(90deg,rgba(18,81,98,.90),rgba(13,63,79,.90))!important;
}

.center-col .newsfeed table thead th{
    height:42px;
    padding:0 12px!important;
    border:0!important;
    color:#cde4ed!important;
    font-size:9px!important;
    font-weight:900!important;
    letter-spacing:.055em;
    text-transform:uppercase;
    vertical-align:middle!important;
}

.center-col .newsfeed table tbody tr{
    position:relative;
    height:50px;
    background:rgba(255,255,255,.018)!important;
    box-shadow:inset 0 0 0 1px rgba(126,154,187,.09);
    transition:.2s ease;
}

.center-col .newsfeed table tbody tr:hover{
    transform:translateX(3px);
    background:
        linear-gradient(90deg,rgba(104,231,255,.055),transparent 50%),
        rgba(255,255,255,.028)!important;
    box-shadow:
        inset 0 0 0 1px rgba(104,231,255,.22),
        0 8px 22px rgba(0,0,0,.17);
}

.center-col .newsfeed table tbody tr:nth-child(1){
    background:
        linear-gradient(90deg,rgba(255,207,85,.085),transparent 44%),
        rgba(255,255,255,.02)!important;
    box-shadow:inset 2px 0 var(--rank-gold),inset 0 0 0 1px rgba(255,213,106,.20);
}

.center-col .newsfeed table tbody tr:nth-child(2){
    background:
        linear-gradient(90deg,rgba(217,228,239,.055),transparent 44%),
        rgba(255,255,255,.018)!important;
    box-shadow:inset 2px 0 var(--rank-silver),inset 0 0 0 1px rgba(217,228,239,.14);
}

.center-col .newsfeed table tbody tr:nth-child(3){
    background:
        linear-gradient(90deg,rgba(255,159,104,.055),transparent 44%),
        rgba(255,255,255,.018)!important;
    box-shadow:inset 2px 0 var(--rank-bronze),inset 0 0 0 1px rgba(255,159,104,.14);
}

.center-col .newsfeed table tbody td{
    padding:10px 12px!important;
    border:0!important;
    color:#dbe4ed!important;
    font-size:10px!important;
    font-weight:700!important;
    vertical-align:middle!important;
}

.center-col .newsfeed table tbody td img{
    border-radius:3px;
    box-shadow:0 3px 9px rgba(0,0,0,.28);
}

/* Pagination */
.center-col .newsfeed .pagination,
.center-col .newsfeed ul.pagination{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    gap:5px!important;
    margin:26px 0 0!important;
}

.center-col .newsfeed .pagination li,
.center-col .newsfeed .pagination a,
.center-col .newsfeed .pagination span{
    border-radius:4px!important;
}

.center-col .newsfeed .pagination a,
.center-col .newsfeed .pagination span{
    min-width:30px!important;
    height:30px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 8px!important;
    border:1px solid rgba(112,164,220,.12)!important;
    background:rgba(255,255,255,.018)!important;
    color:#aebdcb!important;
    font-size:9px!important;
    font-weight:850!important;
    transition:.2s ease;
}

.center-col .newsfeed .pagination a:hover,
.center-col .newsfeed .pagination .active a,
.center-col .newsfeed .pagination .active span{
    color:#effbff!important;
    border-color:rgba(104,231,255,.40)!important;
    background:rgba(104,231,255,.075)!important;
    box-shadow:0 0 14px rgba(104,231,255,.08);
}

/* Ranking page top nav links / tabs */
.center-col .newsfeed a[href*="ranking"]{
    transition:.2s ease;
}

/* Wide ranking pages */
@media(min-width:1281px){
    .center-col .newsfeed:has(.ranking-big),
    .center-col .newsfeed:has(table){
        min-height:700px;
    }
}

/* Mobile */
@media(max-width:780px){
    .center-col .newsfeed:has(.ranking-big){
        padding:16px 12px 24px!important;
    }
    .center-col .ranking-big .lane{
        min-height:48px!important;
        height:48px!important;
        padding:0 8px!important;
    }
    .center-col .ranking-big .lane .order{
        width:9%!important;
        min-width:30px!important;
    }
    .center-col .ranking-big .lane .face{
        width:12%!important;
        min-width:42px!important;
    }
    .center-col .ranking-big .lane .name{
        width:43%!important;
        font-size:10px!important;
    }
    .center-col .ranking-big .lane .guild{
        display:none!important;
    }
    .center-col .ranking-big .lane .level{
        width:30%!important;
        min-width:65px!important;
    }
}


/* ============================================================
   ANDRA2 V10 — REGISTRATION "CREATE YOUR LEGEND"
   HARD OVERRIDE. Append at the VERY END of andra2-redesign.css
   ============================================================ */

:root{
  --v10-cyan:#66e9ff;
  --v10-blue:#4d7dff;
  --v10-purple:#8d6cff;
  --v10-gold:#e7c16e;
  --v10-red:#ff6377;
  --v10-green:#69f7b0;
}

/* --- FULL REGISTRATION EXPERIENCE --- */
body .make-body .center-col .formbox{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  max-width:none!important;
  min-height:720px!important;
  margin:0!important;
  padding:58px 62px 60px!important;
  overflow:hidden!important;
  border:1px solid rgba(108,165,221,.18)!important;
  border-radius:14px!important;

  background-image:
    linear-gradient(90deg,
      rgba(5,10,17,.96) 0%,
      rgba(5,10,17,.88) 34%,
      rgba(5,10,17,.57) 52%,
      rgba(5,10,17,.90) 71%,
      rgba(5,10,17,.98) 100%),
    linear-gradient(180deg,
      rgba(4,8,14,.10),
      rgba(4,8,14,.48)),
    url(../img/theme/header-bg.png)!important;

  background-repeat:no-repeat!important;
  background-size:cover,cover,cover!important;
  background-position:center,center,center!important;

  box-shadow:
    0 32px 100px rgba(0,0,0,.48),
    inset 0 1px rgba(255,255,255,.025)!important;
}

/* cinematic vignette + grid */
body .make-body .center-col .formbox:after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  pointer-events:none!important;
  background:
    linear-gradient(rgba(102,233,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(102,233,255,.026) 1px,transparent 1px),
    radial-gradient(circle at 80% 45%,rgba(71,125,255,.12),transparent 35%),
    linear-gradient(180deg,transparent 70%,rgba(3,6,11,.88) 100%)!important;
  background-size:34px 34px,34px 34px,auto,auto!important;
  opacity:.95!important;
}

/* LEFT BRANDING */
body .make-body .center-col .formbox:before{
  content:"ANDRA2\A CREATE YOUR\A LEGEND"!important;
  white-space:pre!important;
  position:absolute!important;
  z-index:1!important;
  left:58px!important;
  top:185px!important;
  width:38%!important;
  color:#fff!important;
  font-family:"Cinzel Decorative",serif!important;
  font-size:clamp(30px,3vw,48px)!important;
  font-weight:700!important;
  line-height:1.12!important;
  letter-spacing:.035em!important;
  text-shadow:
    0 5px 35px rgba(0,0,0,.95),
    0 0 30px rgba(76,130,255,.16)!important;
  pointer-events:none!important;
}

/* decorative line under left branding */
body .make-body .center-col .formbox > h1,
body .make-body .center-col .formbox > h2,
body .make-body .center-col .formbox > h3,
body .make-body .center-col .formbox > h4,
body .make-body .center-col .formbox > .title{
  position:relative!important;
  z-index:4!important;
  width:560px!important;
  max-width:56%!important;
  margin:0 0 18px auto!important;
  padding:0 0 18px!important;
  color:#f7fbff!important;
  font-family:"Cinzel Decorative",serif!important;
  font-size:25px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  text-shadow:0 0 22px rgba(102,233,255,.13)!important;
}

body .make-body .center-col .formbox > h1:before,
body .make-body .center-col .formbox > h2:before,
body .make-body .center-col .formbox > h3:before,
body .make-body .center-col .formbox > h4:before,
body .make-body .center-col .formbox > .title:before{
  content:"ACCOUNT CREATION // SECURE ACCESS"!important;
  display:block!important;
  margin-bottom:8px!important;
  color:var(--v10-cyan)!important;
  font-family:"Inter",sans-serif!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.22em!important;
  text-shadow:0 0 12px rgba(102,233,255,.35)!important;
}

body .make-body .center-col .formbox > h1:after,
body .make-body .center-col .formbox > h2:after,
body .make-body .center-col .formbox > h3:after,
body .make-body .center-col .formbox > h4:after,
body .make-body .center-col .formbox > .title:after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:1px!important;
  background:linear-gradient(90deg,var(--v10-cyan),rgba(102,233,255,.08),transparent)!important;
  box-shadow:0 0 14px rgba(102,233,255,.18)!important;
}

/* ALERT — MOVE TO RIGHT PANEL */
body .make-body .center-col .formbox .alert{
  position:relative!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  width:560px!important;
  max-width:56%!important;
  min-height:54px!important;
  margin:0 0 14px auto!important;
  padding:13px 18px 13px 48px!important;
  overflow:hidden!important;
  border-radius:7px!important;
  font-family:"Inter",sans-serif!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.4!important;
  backdrop-filter:blur(12px)!important;
}

body .make-body .center-col .formbox .alert:before{
  position:absolute!important;
  left:18px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  font-size:16px!important;
  font-weight:900!important;
}

body .make-body .center-col .formbox .alert.failed,
body .make-body .center-col .formbox .alert-danger,
body .make-body .center-col .formbox .alert-warning{
  color:#ffc2ca!important;
  border:1px solid rgba(255,99,119,.30)!important;
  background:
    linear-gradient(90deg,rgba(255,99,119,.12),rgba(30,8,14,.83) 65%)!important;
  box-shadow:
    inset 2px 0 var(--v10-red),
    0 10px 30px rgba(0,0,0,.23)!important;
}

body .make-body .center-col .formbox .alert.failed:before,
body .make-body .center-col .formbox .alert-danger:before,
body .make-body .center-col .formbox .alert-warning:before{
  content:"!"!important;
  color:#ff7b8c!important;
}

body .make-body .center-col .formbox .alert.success,
body .make-body .center-col .formbox .alert-success{
  color:#b9ffd5!important;
  border:1px solid rgba(105,247,176,.27)!important;
  background:
    linear-gradient(90deg,rgba(105,247,176,.10),rgba(5,29,18,.83) 65%)!important;
  box-shadow:
    inset 2px 0 var(--v10-green),
    0 10px 30px rgba(0,0,0,.23)!important;
}

body .make-body .center-col .formbox .alert.success:before,
body .make-body .center-col .formbox .alert-success:before{
  content:"✓"!important;
  color:var(--v10-green)!important;
}

/* RIGHT GLASS REGISTRATION PANEL */
body .make-body .center-col .formbox .register{
  position:relative!important;
  z-index:4!important;
  width:560px!important;
  max-width:56%!important;
  margin:0 0 0 auto!important;
  padding:28px 28px 28px!important;
  overflow:hidden!important;
  border:1px solid rgba(112,166,219,.18)!important;
  border-radius:12px!important;
  background:
    linear-gradient(180deg,rgba(11,19,31,.88),rgba(6,12,21,.93))!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:
    0 25px 65px rgba(0,0,0,.40),
    inset 0 1px rgba(255,255,255,.025)!important;
}

/* top energy rail */
body .make-body .center-col .formbox .register:before{
  content:"01 ACCOUNT    /    02 SECURITY    /    03 ENTER WORLD"!important;
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0 0 22px!important;
  padding:0 0 13px!important;
  color:#72869a!important;
  font-family:"Inter",sans-serif!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.15em!important;
  text-align:center!important;
  border-bottom:1px solid rgba(102,233,255,.08)!important;
}

body .make-body .center-col .formbox .register:after{
  content:"SECURE CONNECTION  •  DATA PROTECTED  •  ANDRA2 NETWORK"!important;
  display:block!important;
  margin:19px 0 0!important;
  color:#4e6377!important;
  font-family:"Inter",sans-serif!important;
  font-size:6px!important;
  font-weight:900!important;
  letter-spacing:.17em!important;
  text-align:center!important;
}

/* FIELD ROW */
body .make-body .center-col .formbox .default{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0 0 12px!important;
}

/* accent strip */
body .make-body .center-col .formbox .default:before{
  content:""!important;
  position:absolute!important;
  z-index:6!important;
  left:0!important;
  top:11px!important;
  bottom:11px!important;
  width:2px!important;
  background:linear-gradient(var(--v10-cyan),var(--v10-blue))!important;
  opacity:.30!important;
  box-shadow:0 0 10px rgba(102,233,255,.24)!important;
  transition:.22s ease!important;
}

body .make-body .center-col .formbox .default:focus-within:before{
  opacity:1!important;
  box-shadow:0 0 14px rgba(102,233,255,.65)!important;
}

/* INPUTS — HARD OVERRIDE */
body .make-body .center-col .formbox .default input,
body .make-body .center-col .formbox input[type="text"],
body .make-body .center-col .formbox input[type="password"],
body .make-body .center-col .formbox input[type="email"],
body .make-body .center-col .formbox input[type="number"]{
  display:block!important;
  width:100%!important;
  height:52px!important;
  margin:0!important;
  padding:0 17px 0 19px!important;

  border:1px solid rgba(105,151,200,.23)!important;
  border-radius:6px!important;
  outline:none!important;

  background:
    linear-gradient(180deg,rgba(11,24,38,.98),rgba(6,15,25,.99))!important;
  background-image:none!important;

  color:#edf8ff!important;
  -webkit-text-fill-color:#edf8ff!important;

  font-family:"Inter",sans-serif!important;
  font-size:13px!important;
  font-weight:550!important;
  line-height:52px!important;

  box-shadow:
    inset 0 1px rgba(255,255,255,.018),
    0 6px 16px rgba(0,0,0,.12)!important;

  transition:
    transform .20s ease,
    border-color .20s ease,
    background .20s ease,
    box-shadow .20s ease!important;
}

body .make-body .center-col .formbox .default input::placeholder,
body .make-body .center-col .formbox input::placeholder{
  color:#73879b!important;
  -webkit-text-fill-color:#73879b!important;
  opacity:1!important;
}

body .make-body .center-col .formbox .default input:hover,
body .make-body .center-col .formbox input[type="text"]:hover,
body .make-body .center-col .formbox input[type="password"]:hover,
body .make-body .center-col .formbox input[type="email"]:hover{
  border-color:rgba(102,233,255,.36)!important;
}

body .make-body .center-col .formbox .default input:focus,
body .make-body .center-col .formbox input[type="text"]:focus,
body .make-body .center-col .formbox input[type="password"]:focus,
body .make-body .center-col .formbox input[type="email"]:focus,
body .make-body .center-col .formbox input[type="number"]:focus{
  transform:translateY(-1px)!important;
  border-color:rgba(102,233,255,.75)!important;
  background:#071827!important;
  box-shadow:
    0 0 0 3px rgba(102,233,255,.055),
    0 10px 28px rgba(0,0,0,.24),
    0 0 24px rgba(77,125,255,.10)!important;
}

/* AUTOFILL FIX */
body .make-body .center-col .formbox input:-webkit-autofill,
body .make-body .center-col .formbox input:-webkit-autofill:hover,
body .make-body .center-col .formbox input:-webkit-autofill:focus,
body .make-body .center-col .formbox input:-webkit-autofill:active{
  -webkit-text-fill-color:#eef8ff!important;
  -webkit-box-shadow:0 0 0 1000px #091827 inset!important;
  box-shadow:0 0 0 1000px #091827 inset!important;
  caret-color:#fff!important;
  border-color:rgba(102,233,255,.35)!important;
  transition:background-color 9999s ease-out 0s!important;
}

/* CLOUDFLARE */
body .make-body .center-col .formbox .cf-turnstile,
body .make-body .center-col .formbox [class*="turnstile"]{
  position:relative!important;
  z-index:5!important;
  display:flex!important;
  width:100%!important;
  margin:19px 0 4px!important;
  justify-content:flex-start!important;
  filter:
    saturate(.92)
    drop-shadow(0 10px 22px rgba(0,0,0,.30))!important;
}

/* CHECKBOX */
body .make-body .center-col .formbox label.checkbox{
  justify-content:flex-start!important;
  margin:19px 0 0!important;
  color:#9cb0c3!important;
}

body .make-body .center-col .formbox label.checkbox span{
  color:#9cb0c3!important;
  font-size:10px!important;
}

body .make-body .center-col .formbox label.checkbox a{
  color:#81edff!important;
}

/* SUBMIT */
body .make-body .center-col .formbox .submit{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:22px 0 0!important;
  padding:18px 0 0!important;
  border-top:1px solid rgba(102,233,255,.075)!important;
}

body .make-body .center-col .formbox .submit button{
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  width:100%!important;
  height:58px!important;
  margin:0!important;
  padding:0 24px!important;

  transform:none!important;
  overflow:hidden!important;

  border:1px solid rgba(102,233,255,.62)!important;
  border-radius:6px!important;

  background:
    linear-gradient(180deg,#187991 0%,#0c5a73 52%,#084056 100%)!important;
  background-image:none!important;

  box-shadow:
    inset 0 1px rgba(255,255,255,.16),
    inset 0 -1px rgba(0,0,0,.28),
    0 14px 34px rgba(0,0,0,.30),
    0 0 30px rgba(102,233,255,.10)!important;

  transition:.22s ease!important;
}

body .make-body .center-col .formbox .submit button:before{
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  inset:0!important;
  background:
    linear-gradient(110deg,
      transparent 25%,
      rgba(255,255,255,.22) 45%,
      rgba(102,233,255,.20) 51%,
      transparent 72%)!important;
  transform:translateX(-135%)!important;
  transition:transform .68s ease!important;
}

body .make-body .center-col .formbox .submit button:after{
  content:""!important;
  position:absolute!important;
  left:14%!important;
  right:14%!important;
  bottom:0!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,#9bf2ff,transparent)!important;
  box-shadow:0 0 14px rgba(102,233,255,.8)!important;
}

body .make-body .center-col .formbox .submit button:hover{
  transform:translateY(-3px)!important;
  filter:brightness(1.12)!important;
  border-color:#99f3ff!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.20),
    0 19px 42px rgba(0,0,0,.38),
    0 0 38px rgba(102,233,255,.20)!important;
}

body .make-body .center-col .formbox .submit button:hover:before{
  transform:translateX(135%)!important;
}

body .make-body .center-col .formbox .submit button b{
  position:relative!important;
  z-index:3!important;
  color:#f6fcff!important;
  font-family:"Inter",sans-serif!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
  text-shadow:
    0 2px 0 rgba(0,0,0,.28),
    0 0 17px rgba(102,233,255,.28)!important;
}

/* Left-side small lore copy without HTML */
@media(min-width:1001px){
  body .make-body .center-col .formbox .register{
    box-shadow:
      -34px 0 100px rgba(6,13,23,.42),
      0 28px 65px rgba(0,0,0,.42),
      inset 0 1px rgba(255,255,255,.025)!important;
  }
}

/* TABLET */
@media(max-width:1000px){
  body .make-body .center-col .formbox{
    min-height:auto!important;
    padding:38px 28px 42px!important;
    background-position:center!important;
  }

  body .make-body .center-col .formbox:before{
    display:none!important;
  }

  body .make-body .center-col .formbox > h1,
  body .make-body .center-col .formbox > h2,
  body .make-body .center-col .formbox > h3,
  body .make-body .center-col .formbox > h4,
  body .make-body .center-col .formbox > .title,
  body .make-body .center-col .formbox .alert,
  body .make-body .center-col .formbox .register{
    width:min(620px,100%)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* MOBILE */
@media(max-width:560px){
  body .make-body .center-col .formbox{
    padding:25px 13px 30px!important;
    border-radius:8px!important;
  }

  body .make-body .center-col .formbox .register{
    padding:20px 13px 22px!important;
    border-radius:8px!important;
  }

  body .make-body .center-col .formbox > h1,
  body .make-body .center-col .formbox > h2,
  body .make-body .center-col .formbox > h3,
  body .make-body .center-col .formbox > h4,
  body .make-body .center-col .formbox > .title{
    font-size:19px!important;
  }

  body .make-body .center-col .formbox .default input,
  body .make-body .center-col .formbox input[type="text"],
  body .make-body .center-col .formbox input[type="password"],
  body .make-body .center-col .formbox input[type="email"]{
    height:49px!important;
  }
}